6 ms·

Are videos really the best tool for the job of educating coders?

40 points by samerbuna 10y ago

Hello, I've been hacking on a new tool for teaching JavaScript. The main idea is, instead of using videos or articles to explain concepts, I used just audio that's matched with an in-browser editor. I used time cues from the audio to programmatically change the content of the editor and execute code. After each session, a challenge with code assertions can be used to validate what was learned. Here's a demo (using a basic React example): http://jscomplete.com/interactive-learning-demo/ I'd love to hear what you think of this idea and educational delivery format. Thanks! https://edgecoders.com/are-videos-really-the-best-tool-for-the-job-of-educating-coders-e550a3be54a1

hugja 10y ago
What you're describing sounds very similar to how [1]Khan Academy teaches programming. Which is probably one of the best ways I've seen programming taught through a browser. 1. https://www.khanacademy.org/computing/computer-programming https://www.khanacademy.org/computing/computer-programming
- samerbuna 10y ago
  This is great! I think all coding education providers should adopt a similar format.
jabv 10y ago
Hi - I only checked out the introduction, but I think you are right that this is a far superior form compared to traditional video. I make things like this for product trainings with my company using a graphical tool (Articulate Storyline), and I think your idea and execution are both quite good. Check out the book "ELearning and the Science of Instruction" for research-based tips on fine-tuning things you're doing. At first glance, the visual indicators (code or box highlights) are really important and a little understated. I would make them more prominent visually. Secondly, I would think about feedback on incorrect answers as well as hints. E.g., on section 1.1, the user may feel stuck without a clear memory of how to write Hello class. Allowing for something like "show me the next line" to get started would help learners who need more support.
- samerbuna 10y ago
  Great points. Thank you! I've been thinking about feedback on incorrect answers and providing hints when the learner is stuck. I want to try and make this dynamic based on what the learner tries. Of course there are endless possibilities there, but at least if they do something that's known to be bad, it's a good opportunity to teach them why not to do so.
markm208 10y ago
I am working on a tool that allows developers to walk others through their code. It can certainly be used purely for teaching others but I think there is also value in having developers reflect on what they have done in their workflow: https://github.com/markm208/storyteller#storyteller https://github.com/markm208/storyteller#storyteller
- samerbuna 10y ago
  Love it! glad to see other efforts in the same domain.
thenomad 10y ago
Can't speak for everyone, but personally I absolutely hate having to trawl through audiovisual format for learning anything, and coding is particularly bad. It's just so damn slow. I can read and absorb information about 5x faster than I can watch a video. That leads me to feel a lot like the video's just wasting my time. On occasion I've even considered sending tutorial videos to a transcription service. So - personally, I much prefer a textual alternative. But I know some people like video. Given you are doing video-like things, please make sure they're as tightly edited as possible. Really tightly-edited audiovisual content is a lot more tolerable. There's very little more annoying than a two-hour-long, rambling tutorial that could have gotten to the point in 12 minutes.
- samerbuna 10y ago
  I am more of a visual learner but I completely agree about tightly-edited content. When I record video courses, I spend most of my time editing and rephrasing to make it shorter.
- Fradow 10y ago
  You also cannot search a video or audio. That's a huge disadvantage in my eyes: often enough, I know exactly what I am looking for, and if you don't explain the exact concept I want to learn, I don't want to sit through because I can't search or skim the text.
  - andai 10y ago
    I'm working to combine the technologies of spectrograms and photo-reading to be able to quickly skim any audio or video. Though, by the time I'm done it will probably be trivial to just use speech recognition
  - knewter 10y ago
    I'm a co-founder at https://www.dailydrip.com https://www.dailydrip.com and we produce 2 screencasts per week in each topic (5 minutes a day, 5 days a week, 3 times it's just text), but we always provide a full text script for the video screencasts for those that prefer just learning via text. Also: search, as mentioned.
MK999 10y ago
Teach me how to do interesting things in wasm.
tmaly 10y ago
Back in the mid 90s when I was taking electrical engineering courses that dealt with modeling the transistor, I found videos very valuable to review what was said in the class. Fast forward to today, I think a great blog post with links to code and break outs of sample pieces of the code explained in the blog post do a much better job.
djmashko2 10y ago
I built this approach at a hackathon with a friend, it's something that enables people to teach about code by inspecting different parts of a pre-existing project: https://www.codetours.xyz/ https://www.codetours.xyz/ Never took the extra time to polish it up after the hackathon, but if someone is interested I'd be happy to work together on improvements.
- mthoms 10y ago
  Wow. I think this could be incredibly useful.
- markm208 10y ago
  I already posted to the original but thought I would chime in. I like the idea of guiding someone through some code with a narrative. Your tool is very helpful for this. I have a similar tool but it allows the comments to be added to the code as it evolves: https://github.com/markm208/storyteller#storyteller https://github.com/markm208/storyteller#storyteller The main difference being that the context of the comment is always in line with code at the point the comment is made. One other difference is that a person can add drawings and audio to their comments.
- ivan_ah 10y ago
  Very nice! In particular I really like how simple the file format is, e.g., https://raw.githubusercontent.com/partyparrot/GitHunt-API-code-tour/master/context.md https://raw.githubusercontent.com/partyparrot/GitHunt-API-co... and the "playlist" file: https://github.com/partyparrot/GitHunt-API-code-tour/blob/master/.codetour.json https://github.com/partyparrot/GitHunt-API-code-tour/blob/ma...
sean_patel 10y ago
> Are videos really the best tool for the job of educating coders? In most cases, I believe they are. Let me explain why. I checked out your React example and noticed 2 things. 1) You jumped straight into coding, whereas your audience might be at different levels / experience in their coding history. 2) Your audio-only format works well ONLY for client-side stuff like Javascript, HTML, CSS programming. It quickly falls apart if you are teaching ASP.Net, or iOS Programming, Webservices, SQL Server, Oracle, pretty much anything that involves more than just saving a file and clicking refresh in the browser. #2 is where videos shine. If you take a look at PluralSight videos, or even Udemy coding videos, the Instructor is able to SHOW the IDE, the things you've build by going to various browser, folder locations, as well as menu options, settings etc in the IDE. How will you do such things in Audio only format? It will take a lot of words, and if the student doesn't find it then they panic. Whereas in Video they can see EXACTLY what you are doing.
kstrauser 10y ago
"How long is a rope?" Some people learn better from video. I've never heard a programmer claim that they were one of those people, but it's surely possible. But consider all the text you deal with on a daily basis and why you use it. Can you imagine a man-page-as-video: "You can type dash capital A to list all entries except for the current and parent directories. This is always true for root anyway."? That'd be hellish. Did they already get to the part about how to display inodes or do I have to wait for it? Wait, what was that bit about the recursion? In short, you can't search through video or instantly go back a sentence with a flick of your eyeballs. Well, that's exactly how I feel about videos trying to teach me how to install something. I can't trivially skip past the part where they discuss the differences between RedHat and Debian. I can't go back. If my ears are tired, I can't adjust the "contrast" to make it easier to listen to (although I suppose some video players have audio compressors/expanders). I can't copy and paste it into an editor to see how it works locally. Your idea goes a long way toward addressing those problems. I could see it being great for people who prefer listening, but still want to, you know, interact with the thing they're learning. I'd vastly prefer this approach to Yet Another Youtube Video.
- andrewflnr 10y ago
  I know some of my friends at school like videos for learning programming, concepts at least.
garysieling 10y ago
I like that you included subtitles in this.
deleted 10y ago
[deleted]
deleted 10y ago
[deleted]
robattila128 10y ago
What people who prefer videos wont admit is they just find it more comforting to have someone instructing them. Especially if they left an impression on them previously. It's lonelier and harder to establish a connection through blog posts so they will sit through videos instead.
- sean_patel 10y ago
  Not entirely true. How would you teach a course like "Ship your 1st iOS App from Scratch". It involves lots of different things that you can't do just with Audio. Like I said, Audio-only instructions works only for simple scripting stuff like batch files, or client side scripting / coding like Javascript (which is what OP's example is in) and HTML, CSS etc. ETL tools like Informatica, SSIS etc also need a visual, otherwise you get quickly lost. And how will the instructor do it in just audio "Oh, on left you will see a toolbox, look and locate the one that looks like a grid, but not the one that has an X on top right, also not the one that has a red cylinder icon at the bottom." The 1 caveat I see in video instructions is that you have to constantly pause the video and code and then un-pause again, if you are following along with the coding. I get around that with the dual monitors.
- FullMtlAlcoholc 10y ago
  I do find it more comforting to have someone instructing me, but in the context of being in a class or group of people who also are learning with me.
brador 10y ago
Very cool. Polish, Package, Sell to education establishments or as training material to corporations.
garymoon 10y ago
Since I started learning most of the people that helped me told me RTFM sometimes it was kind of rude but I got used to it. Most of the time I read official docs, but if a project is very complex or not well documented I go with books, tutorials, videos, etc.
teilo 10y ago
I love videos for learning visual things - like how to replace the fuel pump on my car. I hate videos for non-visual things - like code.
cellularmitosis 10y ago
This is essentially the same format as Gary Bernhardt's 'Destroy All Software' screencasts, which are absolutely delightful.
ivan_ah 10y ago
Hi samerbuna, jsComplete is very nice. The multi-panel interface is pretty intuitive and the COMMAND+ENTER to re-run the code works well too. One thing about the speed control. You should consider making it a [-|spped|+] button rather than offer 1 1.25 and 1.5 as predefined options. I can usually handle audio at 2x normal speed or sometimes even more. This Chrome extension[1] is my best friend. [1] https://chrome.google.com/webstore/detail/video-speed-controller/nffaoalbilbmmfgbnbgppjihopabppdk https://chrome.google.com/webstore/detail/video-speed-contro...
soneca 10y ago
I am actually learning JS, but much basic stuff. I'm using freecodecamp. I personally prefer "type on the browser following written instructions" than videos. Pace on video is very hard to set right. I only checked the first and second lessons, but I did like your tool! As I can type while the voice is still talking, I can move faster if i want. And listen to instructions while highlighting the part of the code on the screen felt natural. So I think you are on to something and you can have the best of both worlds, clear instructions that stick on your brain and flexibility to follow anyone's pace. The features I would ask: i) allow me to click at the bar of the bottom and go back (or forward) to the part of the audio that I want to read. ii) mark at the bar the exact moment where you objectively explain the key concepts of the class (and make sure at each lesson you have one sentence that explains each concept very directly, like "render function is.."). good luck!! Sounds very promising! :) Example
leepowers 10y ago
Video can be great for describing certain concepts. Like illustrating the relationship between pi and a co/sine wave. Or anything related to animation, physics, etc. in code. Video can also be useful for learning how to setup a development environment, to show how to use developer tools in FF/Webkit, setup an Xcode project, etc. Instances where a student needs to navigate a complex UI to begin the work of actually coding. For coding there's many problems with video. One issue is bandwidth: text can be scanned and consumed very quickly. Text can be given a hierarchical structure that a student can jump between, which makes it easier to understand complex relationships between concepts. Video is linear. Code is not. Code has a relational and web-like structure that is more accurately represented by hypertext.
iKlsR 10y ago
I'm not sure why this fad popped up with people recording themselves and overlaying this over 1/4 of the video. Why do I want to see you with a gigantic mic over your face and your cat in the background?
weishigoname 10y ago
I don't think video is very efficient way to educate, specially for coders, do-by-learning is very efficient I think.
marssaxman 10y ago
Your world is very different from mine, because it would never occur to me to ask that question, much less to answer it with anything but an emphatic "no". I am fairly sure I have never learned anything about programming from a video and have trouble imagining how that would work. I am curious - who produces these videos? Where do you find them? What sorts of things do you learn from them? How do they overcome the slow pace and low information density which appear to me to be intrinsic to the medium?
aaron695 10y ago
I think your title question detracts from the real question :) Your idea sounds like it might be quite good, just try and keep interactivity fairly often, perhaps.