072 JSJ Screencasts

Download MP3



01:31 - Screencasting Experience


Next Week

React with Jordan Walke and Pete Hunt


JOE:  Well, you can represent the newbie perspective then. CHUCK:  Yup. JAMISON:  That’s my default job on this podcast. [Laughter] CHUCK:  No, that’s my job, believe me. JOE:  Au contraire, mon frère. [Hosting and bandwidth provided by the Blue Box Group. Check them out at BlueBox.net.]  [This episode is sponsored by Component One, makers of Wijmo. If you need stunning UI elements or awesome graphs and charts, then go to Wijmo.com and check them out.]  [This podcast is sponsored by JetBrains, makers of WebStorm. Whether you’re working with Node.js or building the front end of your web application, WebStorm is the tool for you. It has great code quality and code exploration tools and works with HTML5, Node, TypeScript, CoffeeScript, Harmony, LESS, Sass, Jade, JSLint, JSHint, and the Google Closure Compiler. Check it out at JetBrains.com/WebStorm.] CHUCK**Hey everybody and welcome to Episode 72 the JavaScript Jabber show. This week on our panel, we have Jamison Dance. JAMISON:  Hello. CHUCK:  Joe Eames. JOE:  Hey there. CHUCK:  I’m Charles Max Wood from DevChat.TV. And this week, we’re going to be talking about screencasting and sharing what you know through that kind of a visual medium. Before we get going, I’m wondering how much of this have you guys done? JAMISON:  None. JOE: **[Chuckles] I’ve done a fair amount. I’ve got my three courses with Pluralsight that I’ve done. That’s pretty much all the screencasting that I’ve done, is through Pluralsight. But I have to say I’ve definitely done a fair amount, several hundred, maybe a thousand with the screencasting.CHUCK:  Nice. JAMISON:  When you say a thousand hours, do you mean a thousand hours of recorded video or a thousand hours of time put into this? JOE:  Yeah, a thousand hours of time actually spent. So I’ve probably produced ten or fifteen hours of recorded video. Probably about that much and five or six hundred hours of time spent producing that much video, right around that. CHUCK:  Well there you go. If you’ve read outliers, you know you have nine thousand hours to go, right? JOE: [Chuckles] Yeah. Exactly when I’ll be an expert.CHUCK:  That’s right. I’ve done a fair bit of screencasting as well. In fact, I got into podcasting through screencasting and I ran TeachMeToCode.com for a few years. I’m actually looking at reviving it but it’s just some time that I haven’t been able to commit yet. But yeah, it’s definitely a fun and interesting thing to do to share what you know and get the word out about whatever technologies you’re passionate about. JOE:  Yeah, definitely. Why did you get into it, Chuck? CHUCK:  What was it, 2007 I think? Eric Berry, who’s a local programmer, started this website called TeachMeToCode.com and he was putting out videos primarily focused on Ruby. He reached out to a whole bunch of people that he knew in the local community and we all put together some videos for him. My first screencast was on routing in Ruby on Rails. Then I started podcasting and Eric got into Groovy on Grails. So he actually turned TeachMeToCode.com over to me and I produced videos for it for another year and a half. Then life just got crazy and I stopped doing it. I pod-faded, so to speak, on that. But there are a bunch of series in there that are fun, like building a Twitter clone in Ruby on Rails and things like that, that was extremely popular back in the day. Now, mostly the technology is old. It was on Rails 2.0 I think and now we’re on Rails 4.0. But anyway, it was a lot of fun. Eric did the Twitter clone. I did a bunch of other stuff, either demoing technology or building applications. What I’m looking at doing right now to bring it back is actually to start just basically, “Here, we’re going to build a website that has this.” So something like a URL shortener or another Twitter clone or something like that so that people get into that again. JOE:  Very cool. CHUCK:  How about you, Joe? How did you wind up getting into screencasting? JOE:  I met one of the main guys over at Pluralsight at a user group meeting and I told him, “Hey, you guys need courses on this and this and this?”  And he said, “Well, why don’t you come build them?” I said, “Well, alright.” That was pretty much it. CHUCK:  Nice. JOE:  Yeah, an inauspicious beginning. But I’m really glad that I ran in there and he invited me to do some screencasting for him because I’ve really begun to enjoy it. I really like teaching and sharing what I know. So it’s a much wider reach. I can go and do a talk, work for 20 people or user group for 30 people or at a conference for 100 people, but I can publish a course and reach thousands of people. And the learning comparison in video screencasting versus a conference. I enjoy conferences tons, but you can’t, at a conference, pause and rewind if you miss something, right? You can ask a question, maybe. But if you’re in the back of the room, that could be a problem. CHUCK:  The other thing is that the conference talks tend to be more about sharing an idea as opposed to the videos. It’s actually sharing a technique or explaining how to use a particular library. As opposed to something like this podcast where it’s all audio, again it’s really hard to show somebody how to do something or explain. You can’t really read code over the air and have people really get it. That’s another place where these videos really come in, is that people can see what you’re typing. They can see the tools you’re using. They can watch and get an idea of the workflow. And in the end, you can actually demo what you built. JOE:  Right. JAMISON:  So how does this relate to JavaScript? We’re talking about screencasts, but we’ve got an angle on this podcast, right? So why are we talking about it on JavaScript Jabber specifically? JOE:  I’d like to take the first stab at that one. I made the switch from being a full-stack, more backend developer to being a frontend developer. Part of the reason that I did that was because frontend and JavaScript, this is where not just exactly the frontend, because Node is part of this, but JavaScript is really one of the most exciting places right now in technology. So much innovation is happening. So many new libraries are getting published. So many people are solving big problems and there are so many opportunities to solve these big problems. But one of the big, big issues that we face is sharing that knowledge. How difficult is it when you go to use somebody’s new library and they haven’t had time to really put together a nice documentation site? Maybe this is probably more the exception than the rule, but they actually did write a little blog post about, “Alright, here’s how to build something basic, utilize my library with something basic.” And that’s nice. But with video, you can get such a better idea of how to use something if you watch them go through soup to nuts and put something together. I don’t know if either of you guys have been to Egghead.io to look at Angular videos, but man, those are such great videos. They’re short little two, five minute videos where he just shows how to do one little tiny thing but so many people have benefited from those videos. And I think in JavaScript, it’s a burden on us that we should take this responsibility to share that knowledge with other people that we pick up, whether we’re authoring a new library or we just figured something out. It’s so easy to do a quick little screencast, post it up to YouTube and make it searchable. Somebody else can come in and find a solution to the same problem. That’s so much more effective than a blog post to me. You don’t have to worry about your grammar and punctuation. You just have to be able to speak clearly enough that people can understand you CHUCK:  Yeah. I just want to add onto that. When I got into Ruby on Rails, I had somebody sitting by me helping me out. But eventually I found things like the Rails Envy Podcast which was an audio show, but they were talking about Rails news. Then there was another one called RailsCasts by Ryan Bates. He put out a video every week and it was a video on some aspect of using Ruby on Rails or using some library that is connected to Ruby on Rails. A lot of these very similar, I’ve been looking at Angular and Ember, so finding videos on, “Here’s how you do this with Angular. Here’s how you do this with Ember,” NSScreencast for learning how to do iPhone development by Ben Sherman, it really helps bring people into the community. It helps show them how to solve problems that they run into as they’re coding. It really just adds to the overall community effect and feel as well as helps those people who are making a transition come and contribute to our communities. It’s a huge, huge thing. I totally agree with what Joe is saying. And just bringing new people in, getting people to use the right tool for the right job, there are a lot of payoffs for this. Yeah, most of it’s community-focused but ultimately, it makes our code better. JAMISON:  So, I know that Ryan Florence has Embercasts. They’ve been a good resource for me when learning Ember just because it’s a large idea to get your head around. At least for me, it’s harder for me to learn that just by reading docs and trying stuff out. It’s easy, a lot easier, if you have someone that’s found the happy path, found out how things work for you. So that was a good resource. You mentioned Egghead.io right? That’s the place for Angular screencasts? JOE:  Yeah. JAMISON:  Have you guys come across other good resources for JavaScript screencasts? CHUCK:  For JavaScript screencasts? JAMISON:  I know Pluralsight has a few. Or not Pluralsight. Well, they do too. But PeepCode has a few. CHUCK:  Yeah, I know PeepCode has a few. Then I think there was, wasn’t Tim running one for a while that did Node screencasts? JAMISON:  I’m not sure. I know he did blog posts, HowToNode.com, but I don’t know if there were screencasts on there or not. CHUCK:  Yeah, I thought there were. JOE:  Yeah, I’m not really sure and nothing obvious comes to mind, which I think is sad, other than YouTube. But then you sort through the big pile on YouTube. There are some great ones in there and some not so great ones in there. CHUCK:  Yeah. JAMISON:  How do you think screencasts compare? You mentioned conference talks not reaching as wide a variety of people or as wide a number of people. But it seems like more and more conference talks are being recorded, right? So how do you compare a screencast against a recorded conference talk? You still prefer the screencast for learning? JOE:  I do. But again, it depends. I think that Charles had it right there with a conference talk is more like an idea. And in that 45 minutes to an hour, they probably cover very little code and the recording of a conference talk often isn’t a capture of what they’re putting up on the display board, it’s a capture of them walking round and talking. So the code, you might have a harder time seeing it. And most likely they realize that even though they’ve got this 45 minutes, they can’t show nearly as much code. So the code that they show is really what you probably show in 10 or 15 minutes of a screencast. I would say, in comparison of the two, I would prefer a screencast to a recorded conference talk if it comes down to, “I need to learn how to do something very specific.” But when it comes to ideas, I watch lots of recordings of conference talks because there’s lots of great information. It’s more about the ideas of how to do something or somebody talking about their opinions on doing something a certain way that you get that I really appreciate. CHUCK:  Yeah. Just to add on to that and I’m going to give some more concrete examples to this. I’ve watched conference talks on things like functional programming in JavaScript or in Ruby. Basically, they just start talking about the payoffs, the different tradeoffs that you make using functional programming versus object-oriented programming, stuff like that. You get these ideas around or concepts around different aspects of programming from the conference talks. Most conference talks aren’t heads down, heavy demonstration of how to write the code that gets the job done. That’s where the screencasts really shine. The screencasts, it’s, “I’m using this functional programming technique in order to solve this problem. Then we’re going to go in and we’re going to do these couple of other things because they make the problem a little bit easier. And in the end, look, we have a widget that does x, y, and z.” That’s the difference. One is very high-level and one’s very low-level. But they both pay off in different ways depending on what you need. So if you need somebody to show you how to solve the problem, then you’re going to go to a screencast. If you want to expand your mind and find new ideas for how to approach different aspects or areas of programming, that’s where the conference talks are. JOE:  Right. What do you think, Merrick? Or sorry, Jamison? JAMISON:  Merrick is not what it is today. I can’t replace Merrick, dude. I haven’t said dude nearly enough times in this podcast. CHUCK:  Dude. JAMISON:  Or bro. I love you Merrick. CHUCK: [Chuckles]JAMISON:  What was the question? JOE:  What is your preference for learning? Screencasts versus watching recorded talks? JAMISON: [inaudible] I think I’m biased towards the impractical crazy things so I like conference talks more, just because I agree with Chuck that conference talks are more like, “Gee whiz, this is so crazy,” and a screencast is like, “Here’s this thing that will help you in your job.”JOE: [Chuckles]**JAMISON:  So screencasts might be more useful in the short term but I like conference talks. I probably watch a lot more conference talks than straight up screencasts. I feel like I learn things from them that I wouldn’t be able to learn through experience or through reading on my own. JOE:  Right. What about when you’re trying to get something specific. Do you prefer searching for a blog post or a screencast? JAMISON:  Still blog posts. You could just do Ctrl+F and then find the problem that you’re looking for whereas if it’s an hour-long screencast, then you just sit through an hour-long screencast. I don’t know. That might just be my ADD. JOE:  That’s a good point, and an hour-long screencast is a bit much. CHUCK:  Yeah, that’s definitely true. However, if the screencast is ten minutes and it’s focused on solving whatever problem it is that I actually have, then I definitely prefer that because I can actually see the screen. I can see the code. I think it’s a higher bandwidth communication because you get the way that the author is speaking about something, or the presenter I guess, whatever you want to call him. I’m going to call him the author, just so that I can keep the terminology straight. JAMISON:  The artiste. CHUCK:  Yeah. So you get to hear what they’re saying. You get to see what they’re doing. A lot of times, they’re using a lot of the same tools that I’m using. And if not, I get that out of it as well. But yeah, a ten-minute video isn’t a big deal for me to go watch to figure out how to do something. I can pause it. I can rewind it and everything, like Joe said. The blog posts, a lot of times, I don’t know. I just don’t feel like they really give me as much of a guided tour because if my path deviates from the video, then I can go back and re-watch it and see what I did wrong. With the blog posts, a lot of times, they just give you the highlights or the basic points. So you may deviate because they omitted something. I think it’s easier to omit something in the blog post as opposed to the video, because in the video you are recording it real-time. JOE:  Yeah, quite true. JAMISON: **Unless you’re doing stop-motion screencasts with Claymation and stuff. [Laughter]**JAMISON:  That’d be sweet. CHUCK:  I would love to do that. JOE:  That would be awesome. JAMISON:  That’d be pretty cool. I’ve got a nephew that’d be amazed with that. So maybe we’ll make a new startup. CHUCK:  There we go. JOE:  I agree with what you’re saying with Jamison, about Ctrl+F. There are definitely times when I feel like, “Alright, I just need a quick example of what was this one little thing,” in which case a screencast can be really inconvenient. I need to find just this one example. But when it comes to, “Oh, I just don’t know enough about this. I need to learn this better in depth,” then I’d definitely go for a screencast. CHUCK:  Yeah. I think it also comes down to the way that you learn, if you’re a visual watch somebody else do it learner as opposed to read it and understand it that way. You may be better off even going to a book. JOE: **Well let’s take for example that I wanted to learn Sinatra. Not a Ruby guy, I’m not a Rails guy, but I wanted to learn Sinatra. I would definitely go for a screencast. But if I’m building a really complex [inaudible] Angular and I’m looking for, like I’ve got my transclusion wrong, something screwed up on it and I want to refer to some examples of how people transclude, I would probably prefer a blog post. Then I can scan through it quickly and be like, “Okay, okay, okay. Alright. Now I have the information I want and go to the next one.” Whereas watching a screencast about transclusion probably wouldn’t help me out.**CHUCK:  Yup. So I want to change gears here for a minute and talk about recording screencasts as opposed to watching them and what the payoffs are. What tools do you use to record your screencasts, Joe? JOE:  I use Camtasia. CHUCK:  Are you on Windows or Mac? Because I know they have both. JOE:  I’m on Windows when I do most of my recording. I haven’t done any recording on my Mac but I might need to start doing some recording on a Mac. I might be picking it up for the Mac. CHUCK:  Awesome. I use ScreenFlow and that is Mac only. But it’s a pretty handy tool. I have used Camtasia in the past. For the most part, the basic features you’re going to use for either one are the same. You record, you edit. They have basic effects in them, stuff like that. They’re both excellent tools. JOE:  So let’s say that you just wanted to do just a little tiny bit of screencasting. I don’t know, is ScreenFlow a paid project? CHUCK:  Yes, it is. I don’t remember how much it is. JAMISON:  I think it’s $100. CHUCK:  Yeah. JOE:  That’s not terrible. But still, unless you plan on making that money back somehow. If you just want to contribute to the community though, it’d be a bit much to buy it off. What are the alternatives for somebody who wants to just contribute to the community but doesn’t want to drop $100 on a tool? CHUCK:  There are a few free ones out there that you can use.  Yeah, it’s $100 for ScreenFlow. I’m trying to remember what some of the other paid options are, but QuickTime will actually record your screen. That comes on the Mac and it’s free. It doesn’t have all the nice little editing and other features in it. The reason I use ScreenFlow is because I wind up substituting the audio. I record the audio on the same equipment that I record the podcast on then I put it in there and it sounds a lot better. But yeah, you can use QuickTime. There’s also Jing.com. It’ll record a short screencast and then it’ll put it up on screencast.com. I don’t know if you can actually get the original file for it though and do anything else with it, but you can embed it off of the screencast website. That’s made by the same folks that made ScreenFlow. I think. No, I think it’s by the same folks that make Camtasia. JAMISON:  That’s the one where you have to sign up for an account, right? It’s free but CHUCK:  Yes. It’s free, but you have to get an account and there are limitations to how long it can be, on Jing. JOE:  Interesting. CHUCK:  There are a few others out there. I know that there are free ones for Windows as well, but I can’t think of what they are off the top of my head. But yeah, I’ve also used, I’m trying to remember what it was, for Mac. But there was another one that was big for a while that ScreenFlow eventually won out. JAMISON:  Do you just do all your editing in these tools? I know ScreenFlow, I’m sure Camtasia as well, provides editing stuff. CHUCK:  Yes. Yes, they do. That’s what I do. I don’t know if that’s what you do, Joe. JOE:  Yeah, I do my editing on Camtasia. You know, the screen recording isn’t really the most important part of Camtasia. It’s the editing. Choosing a screen recorder, it’s the editing tools that are the really important part. There are a lot of things that will capture the video. Yeah, maybe you might be particular about, “Oh I want to be able to turn my mouse on and off,” but the majority of what you’re going to do in screen capturing the video recording options are far less important than having good editing options. But that’s if you’re doing something long. If you’re going to do something short, I want to shoot, record two minutes of showing you how to do something, I think at that point the editing probably doesn’t matter. You probably just would rather re-take if you screw something up and not even bother editing, if you’re just going to do two minutes of video. CHUCK:  Yeah. JOE:  I’m always recording big, long things. I’m trying to string together three, five hours of videos, so I need to do a lot of editing. I have a big, long plan of how pieces fit together. But if I wanted to just take something little that I was doing and rather than writing a blog post on it, do a little video, a little screencast on it, then it would be a lot easier to do something where I didn’t have to worry about editing tools. I’d just grab one of the free screen recorders out there, sat down, record it, then when I was done, post it up to YouTube and that’s just like a blog post. CHUCK:  Yeah. Jing does that. Again, I don’t remember all the limitations, but that’s usually what I use Jing for, is the one-minute, “Hey, this is the bug I’m seeing. Go check it out over here.” JOE:  Right. and I really wish that more people would do that, use these free screen capture tools and just put something together for a minute or two rather than writing a blog post all the time. Because if you want to show, “Oh here’s how I solved one little problem or do one little thing,” and you just code through it, that’s really beneficial. There are just not enough videos out there like that. CHUCK:  Yeah. JAMISON:  So do you talk over yourself while you’re doing the thing that you’re demonstrating on the screencast or do you record completely separately and then do a voiceover later? I feel like I’ve seen it both ways and it seems like it takes a lot of skill to be able to do what you’re talking about and talk about it at the same time. But some people can pull it off. I don’t know. CHUCK:  What do you do, Joe? JOE:   I record afterwards. So what I actually do is I’ll, using the editing software, I’ll record my typing, then I’ll stop and talk for a minute, then I’ll do more typing. Then using the editing, I cut out the typing or shorten it up, speed it up, something like that. There are a lot of different reasons for that, one of which is if I screw up what I’m saying, then when I need to re-record that, I’m recording against a still image that’s not changing. So it makes the editing a ton easier. But that’s a lot more important when you’re doing a big long screencast. If you’re doing a short screencast, then just pausing while you type, and for me I’m also with what Jamison said, there are certain people that can talk and type at the same time and I’m not really great at that. Much better at doing one thing at a time. JAMISON: **I can’t even talk and talk at the same time. [Laughter]**JAMISON:  Adding another thing onto it, that makes it rough. JOE:  Yeah, I’m single-core. So it’s either talking or typing but not both. CHUCK:  That’s funny, because I’m definitely the other way. I will type and talk at the same time. I have tried dubbing afterward. It just doesn’t work for me. The timing always feels wrong. Rather than doing that, I’d rather just stop and explain something if I don’t have anything to type until I’m onto the next topic. Yeah, I’ll just stop and explain rather than actually record all the typing and all the programming then go back and explain what I did. I feel like I’m rushed at some points and I’ve got this huge gap where I’m just typing and not really explaining what’s going on. So I’d rather just talk through it. It tends to work pretty well for me. But that being said, I have gone back and touched things up and recorded small segments after the fact and redubbed them in. but typically for the most part, if you’re watching a screencast that I’ve made, I am talking while I’m working. JOE:  So you don’t have any problem talking while you’re actually typing? I do the same thing, but I do not talk and type at the same time. CHUCK: **I have no problem talking and doing just about anything else at the same time. I talk a lot. [Laughter]**JOE:  No argument here. CHUCK:  All kidding aside, it really is much easier for me just to explain it while I’m doing it. Then the timing just works itself out and it sounds good. Sometimes, I do go in, especially if it’s more of a professional thing. Now on my own screencasts typically I don’t do this, but for a screencast, I’m actually in talks with Pluralsight right now to become one of their authors, I would go in and I would clean it up, a lot of the ums, ahs, uhs, that are in there and just make it so that it’s more continuous and feels a little bit more professional. JOE:  Yeah, that makes sense. CHUCK:  And one other thing I want to jump in and talk about real quick is the audio quality on your video. So the video quality has to be good enough for people to tell what you’re doing. I found that with most videos, if the audio quality is really poor then people won’t watch the video. Even if the video quality is high and the content is what they want, if the audio quality is poor then they will find another video. JOE:  Yeah, I totally agree. The difference between a really terrible video and a really great video is not what’s going on in the video, it’s the audio. CHUCK:  Yep. JOE:  It’s the quality of the audio. CHUCK:  And I’ve seen that play out over and over and over and over again. JOE:  The good news is Macs seem to have a great microphone. MacBook Pros, they seem to have a really great microphone that’s included with them. So if you just are in a quiet enough room when you’re recording, then I think those are actually really good. CHUCK:  Yeah. If you’re going to be recording professional quality though, I still recommend that you go get a professional quality microphone. You can get away with a $50 or $100 microphone. You don’t have to go out and get a $300 or $400 microphone. I know the Pluralsight and the Lynda.com for example, they approached me about a video and then decided that the, anyway they were talking about money issues and open source and stuff and they just weren’t willing to commit to it. But both of those companies require you to go buy a decent microphone, usually, at least a mid to high-end microphone. JOE:  Yeah. The Blue Snowball, that’s a great microphone. That was my first microphone and I picked that up for $60, $50. CHUCK:  Yeah. The Blue Yeti, which is a little bit more, I think it’s closer to $100, is also a good option. If you want to go more along the lines of a traditional microphone with an XLR plug, if you don’t know what an XLR plug is, it’s the kinds that you see for regular PA systems with the three prongs in the back. You can go get one of those. There’s a Shure SM58, which is an excellent microphone. It’s just a handy little dynamic microphone and it’ll cost you $50 as well. But then you have to find a way to either convert it to USB or get a mixer for it. But as far as USB mics go, the Blue mics are awesome. JOE:  Yeah, absolutely. CHUCK: **Then if you want to go higher end, then you can get the RE20 or the Heil PR 40. But you don’t necessarily need to do that unless you’re going to be doing a whole lot of screencasting or podcasting and you just want that extra rich sound that they give you. So one other thing that I have people ask me sometimes is do you need the high-end editing software like Adobe Premier Pro or, what is it for the Mac, it’s Final Cut Pro. I have to say, I have both. [Chuckles] I’ve paid for both and I never use them. Premier also does Effects. That’s pretty much all I’ve used it for. The same with Motion, which is the counterpart for the Effects with Final Cut. Basically what I do is I go to VideoHive.net. I’m going to give away some of my picks here. They have After Effects project files and Apple Motion graphics files. So if you need an introduction effect, so for example on Rails Ramp Up, which is my Ruby on Rails course, each of those videos begins with an effect that fades in the logo. If you want an introduction like that, those intros cost anywhere up to about $20. Then you just plug them into motion or aftereffects and you put your image in there and then you just tell it to render it and it does all the rest of the work. So you can get a professional intro/outro if you’re looking for something like that on these videos. Now if you’re doing something for Pluralsight and those guys, they do a lot of that stuff for you. So you just format it the way they want, and then they do the rest of the work. But that’s a really awesome tip that I’ve used in the past as well.JOE:  Cool. So I’ve got a question for Jamison. JAMISON:  Yes, sir. JOE:  Have you ever thought about doing any screencasting? Have you ever considered doing a screencast for something rather than, you blog, right? JAMISON:  Very intermittently. I have blogged. JOE:  Have you ever thought screencasting stuff? JAMISON:  I’ve thought about it. I think I have the free version of ScreenFlow sitting around in my hard drive somewhere. I just have never done it, probably for the same reason that I don’t write very many blog posts. I just have lots of ideas, then I start them, then I throw it away. So yeah, maybe this podcast will be the inspiration though, to start. That’d be cool, if more people start doing screencasts, right? JOE:  Yeah. JAMISON:  I was talking to a coworker the other day who’s brilliant but he’s a little young. He thinks that he’s not that smart. I think he has this perception that he has to be old and famous to give conference talks. I was trying to tell him that he has tons to offer to people right now. It seems like the same thing with screencasts, right? You don’t have to be a famous expert in your field, although that helps. But there are people that could benefit from stuff that you already know about JavaScript. CHUCK:  Yeah. A lot of the introductory stuff that you know after doing JavaScript for a few months, that’s still stuff that other people are going to want to learn if they’re picking up JavaScript. JAMISON:  And everyone’s an expert at something, right? You’re application has specific things that you have to learn. Maybe you do a lot of low-level DOM manipulation or maybe you do tons of crazy synchronous stuff. There’s something that you know that other people do not know that they could benefit from. JOE:  Oh, absolutely. Another nice thing about just doing a little short screencast here or there of that really focused topic and throwing it on YouTube is it’s a lot easier for people to find an answer to a problem through your screencasts that way. JAMISON:  Sure. I’ve thought about doing screencasts as well to prepare for conference talks a little more. Usually, I just practice by myself or I’ll give a presentation at a user’s group or at my company or something. But it seems like that could be a good way to do a lot more focus preparation on your topic. JOE:  Yeah. JAMISON:  So I might try that for an upcoming talk. We’ll see. CHUCK:  Yeah, it’s definitely worth trying at least. You can see, “Oh, I rushed this. I need to explain this a little bit better,” because you can play it back. JAMISON:  Sure. If only you could have your sweet intro in your conference talk, right? Like you zoom in and dissolve into appearance like your logo on your screencast or something. CHUCK:  You can do that. You can embed videos into Keynote. JAMISON:  Well, I mean I was talking about literally in real life, like you slide in from the top like your logo slides in from the top or something. CHUCK: [Laughter] Oh that would be cool, yeah.JAMISON:  That’d be pulling a fan man, I guess. CHUCK: [Chuckles]**JOE:  It’d be awesome though. CHUCK:  So when you’re preparing for your screencasts, Joe, you actually write out an outline and do you actually practice it a few times or do you just write the outline and then go for it? How do you approach that? JOE:  Well, for a Pluralsight course, it’s going to be three or four hours of topic. So I do a lot of preparation there, outlining, breaking things down into modules and organizing the content. There’s a lot of that kind of prep. But when it comes to, “Alright, I’m filming one clip and the clip is going to be two or three or four minutes long and I know what is going to go into the clip,” I already have the content laid out and now it’s just how am I going to present that content. I might write a script. I might not. If I don’t write a script, I at least make notes about what I want to talk about. Then I don’t know that I will necessarily practice, but I do a lot of, I stop, I get ready, I know the topic that I want to talk about for the next 10 to 30 seconds and I have it in my mind what I’m going say, then I hit record and I talk for that 10 to 30 seconds. If I screw it up, I just stop and start over again. If I didn’t screw it up, then that’s great. Then I’ll pause and get ready for the next 30-second bit and do that, and do that over and over again until I got the two to four minutes that I’m going to have for my clip. That’s how I do it. CHUCK:  Yeah, that makes sense. I tend to just outline it. I will never write a script. Again, I just don’t feel like I can express myself well by reading a script. I feel like I’m trying to fake the inflections and things of what I’m trying to say. But yeah, other than that I pretty much do what you do. I’ll just work through the outline. Sometimes I’ll type out code samples. I have two screens on my machine so a lot of times, I’ll have the code that I’m writing up on the left and the code that I am recording myself writing up on the right. So I’ll admit that I have cheated, so to speak, on some of my screencasts. But the nice thing is then I can just boil it down to the essential parts of what I’m doing. The other thing that I do want to point out though, is sometimes I do just go and cowboy code the video and I’ll make mistakes and I will leave them in if I think they’re valuable. What I mean by that is if it’s an easy or common mistake to make, then I’ll leave it in. if it’s a typo or something, then a lot of times I’ll back up and re-record it. JOE:  Right. Yeah, I’m not really a big fan of doing scripts, but I certainly can say that I found myself a bunch of times going back and when I was editing discovering that I used the wrong word for something three times. And not like a normal mistake, but something that you only make because I’m right in the middle of focusing on the coding that I’m doing and things that I’m talking about and I just mixed up words. So sometimes, the script really helps out with stuff like that. Of course, when you’re just throwing something together to post up on YouTube, mistakes are not that big of a deal. Leave the mistakes in, right? CHUCK:  Yeah. JOE: **If you’re trying to do something more professional, you may want to [inaudible] the mistakes out or what I’ll do is I’ll just note, “Hey, it’s really common to make a mistake here and do this,” but leaving the mistake. I don’t normally leave the mistakes in for professional stuff, because the expectations are a bit higher.**CHUCK:  Yeah. JAMISON: **You could borrow my notebooks-driven development methodology for the screencasts, so just don’t make mistakes. [inaudible] that’s fine.CHUCK: [Chuckles] There you go.JOE:  Very nice. JAMISON:  Thank you. CHUCK:  Yeah, that’s Jamison, the embodiment of perfection. JAMISON: [Chuckles] Literally. [Chuckles]**CHUCK:  So one other question I have for you, Joe, is when you’re recording your screencasts, screencasts I’ve seen usually straddle the gap between something like demonstrating how to write the code and actually presenting concepts regarding the code, so in that sense, they go more toward the conference talk area. But you’re setting the stage so that you can actually write the code. Do you typically do that with some kind of PowerPoint or Keynote presentation or do you just explain it as you go or is there another approach that I haven’t thought of? JOE:  I do the PowerPoint type thing. I like to use diagrams and I’m a very visual person myself. So I like diagrams to explain concepts. So I’ll use PowerPoint and colored blocks and move them around on the page and explain how pieces fit, or at least outline bullet points. Alright, there’s this, this, and these are the options. Then I’ll go into the coding and then I’ll go back to the PowerPoint. CHUCK:  Yeah, I tend to do that, too. And I do it on my secondary screen so that when I’m switching between programs and I hit Command+Tab on my Mac, I think it’s Ctrl+Tab on Windows, to switch between the most recent programs you’re running, then it shows the switching window that comes up on the Mac, it shows it on the primary screen. And since I’m recording the secondary screen, it’s just a seamless transition from the slideshow back to my editor. JOE:  Right. CHUCK:  And then the other thing that I like to point out is make sure that your fonts are large for videos. The reason is even if you’re recording it, you’re going to release it in 720p or 1080p high definition, most people aren’t going to watch it in that. They’re going to watch it on their phone. They’re going to watch it on YouTube, where it’s 600x400 and you’re going to need a higher resolution font. You’re going to need a larger font so that they can read it on those smaller window screens or devices. I always blow it way up so that people can see it. JOE:  Yeah. I like to just record at 800x600. That way, I know that from a small device to a big device, they can see and not try to cram too much content into the screen. It limits me from trying to put too much on the screen. CHUCK:  Yeah, that makes sense. It depends on whether or not I promised somebody that they’ll have high definition or not. But yeah, I’ve done that too. And ScreenFlow, and I’m pretty sure Camtasia does this too, when you export the video to its final .mov, .mp4, .wmv, you can tell it to export it to that smaller size as well. It’ll scale it down. JOE:  Right. CHUCK:  Have you put closed-captioning on any of your videos? JOE:  Pluralsight does that for us. CHUCK:  Okay. JOE:  So I don’t know, I haven’t been involved with that process at all. That all happens after me. CHUCK:  Yeah. I know that ScreenFlow will allow you to put closed-captioning on your video. I’m just trying to think if there are any other aspects of this that we should talk about. Do you ever do a video of you talking to the camera as part of your screencasts? JOE: **I don’t. But I think that I’m not the kind of person that people want to see a video of. [Laughter]**CHUCK:  I did that. JAMISON:  It seems like it could be incredibly cheesy if done wrong. JOE:  Yeah. CHUCK:  I did where it was the picture in picture on some of the Teach Me To Code videos. Some people liked it and some people hated it. I eventually stopped because it is such a pain to move that picture around when you move the cursor into where that picture is. JOE:  Right. CHUCK:  So I just got tired of dealing with it. The only time that I’ve actually done the face to face video is if I’m doing some kind of introduction. “Hi it’s me, I’m doing this class. You want to see my face. You know I’m a real person,” kind of thing or in a marketing video for the same reasons. They look at it and they’re like, “Oh, okay. He’s a guy. He exists,” kind of thing. You get that personal connection because you’ve seen their face. But generally, I don’t do that either. I’ll put a picture into the slides at the beginning or end or something. JOE: **Yeah, I agree. I think there are certain personalities for which that works. I’m thinking of Day[9] who does the screencasting for StarCraft and he’s just go the right kind of personality. You see his picture all the time, or at least a lot. He’s just got a good personality for that. But for a lot of people, they just don’t have a personality that can be really engaging while interacting with essentially nobody. It’s just hard to do.**CHUCK:  Yeah, it is really hard to do. A lot of times, I’ll include other content with my videos because some people want it. So I’ll have things like cheat sheets. JAMISON:  Other content? Oh I thought you were going to say my favorite song in the background playing. CHUCK:  There you go. No. So I’ll put out cheat sheets and things that people can download. So it’s, “Hey, go here and do this.” I’ve also been using a product, and I may have picked in on the show before, called Wistia. They actually allow you to do things like embed an email signup or something in the video so people can enter their email address and sign up for your mailing list and things like that. That’s also an interesting thing that you could do if you’re embedding this on your own website. JOE:  Right. But I don’t think that, even though Jamison joked about it, let’s say that you did want to write a blog post but thought about doing a screencast instead but weren’t necessarily comfortable doing a lot of talking, well then just screencast writing the code. Describe what you’re doing and then throw some music in the background. CHUCK:  Yup. JOE:  On a little 30-second to two-minute video, I’d be totally okay watching that if the code was actually something that I was looking for  and solved the problem that I needed. CHUCK:  Yeah, I would put a little short introduction before that that says this video just shows me writing the code and the explanation follows. JOE:  Yeah, exactly. JAMISON: **Seems like it’d be really surreal if you didn’t have that. You’d just be some guy coding in his bedroom while [music sounds]JOE: [Laughter]CHUCK:  Yeah, there you go. JAMISON: [inaudible] plays in the background and stuff.JOE:  It kind of gets creepy. No, I was thinking like you describe the topic really well in the notes in your YouTube videos that people can find and know exactly what you’re going to do in the video. Then in the video you just code it up. You don’t need to talk. You could throw the music in just so that it’s not dead space. I don’t think even talking is nearly as absolutely required for a decent screencast if you’re doing a short topic about something very focused that you can describe in a few sentences at the beginning of the screencast. CHUCK:  Yeah. The other thing is having the text, whether it’s a transcript of your show or just an explanation, that’s also really helpful for people who are hard of hearing so they can see it. They might have trouble completely hearing or understanding what you’re saying but they can go and read about it afterward. JOE:  Right. CHUCK:  And it helps with your SEO among other things as well. So there are several reasons to do that. JOE:  Exactly. CHUCK:  Alright. Well I think we’re pretty close to done. Unless there’s anything else you can think of to bring up, let’s go ahead and do the picks. JOE:  Nothing comes to mind. CHUCK:  Alright. Jamison, what are your picks? JAMISON:  I have two picks. My first pick is this RequireBin little example. It’s just a few dozen lines of JavaScript that shows how someone is, I think it’s playing the Final Fantasy theme, one of the Final Fantasy themes in your web browser with JavaScript and the web audio API and stuff. It’s cool. And RequireBin is a cool tool as well. It’s like one of this JSBin things but it uses Browserify so you can pull in Node modules and stuff like that. My other pick is just The International 3. It’s this annual tournament that Valve throws for their game Dota 2. I think the prize pool is $2.8 million this year. CHUCK:  Wow. JAMISON:  And it’s a week long. It’s the finest event in e-sports. Just incredible production values. Really good games. I actually got a bunch of people in the office to watch it that aren’t Dota fans. So that was fun. It felt like being someone that cares about football. It’s a unique experience for me. CHUCK: [Laughter]**JOE:  Do you wear a jersey? JAMISON:  No, I don’t. I don’t wear a jersey, but oh man, the finals was a best of five series and it just came down to the wire. Everyone was just hunched around the TV cheering and stuff. I didn’t really have that experience growing up. I understand people that love sports a lot more now. So The International 3. That’s my other pick. CHUCK:  Nice. Joe, what are your picks? JOE:  Alright. So I’ve got three picks. I just came back from That Conference. That actually is the name. It’s called That Conference. I’ve picked it before. I want to pick it now that I’ve actually gone and say that it was a really great conference. It’s was pretty regional and it was just a wide variety of topics like ten tracks. They had topics on everything and they had a track for kids and family where they’re teaching kids how to program their Legos. It was really cool. It was very well done, very well put on. And it was an absolute steal. I had a really great time at the venue that they chose. So I’d like to pick that. I also want to pick a book called Seraphina. It came out last year I think. I saw it in the bookstore and it just had a cool cover so I picked it up and read a little bit of it. Then I just got completely engaged. It’s a long book but I’ve been zipping through it, really enjoying it. It’s sort of a Harry Potter type of novel. But I really enjoy it. Fantastically written. Great, great, great book. Then for my last pick, I’m going to once again pick ng-conf. the reason I’m picking it is because it won’t be too much longer before tickets are going to start going on sale. It looks like we’re going to be turning people away. So I just want to make sure that if anybody really want to go to an Angular conference, that you pay attention, because I don’t think there’s, I think the tickets are going to go quick based on the amount of interest that is getting generated for ng-conf. because there’s just only so many spots that we’ve got. I’m going to pick ng-conf. That’s www.ng-conf.org. CHUCK:  Awesome. Alright, I’m going to do a couple of picks here. The first one is Video Hive. I mentioned it before. That’s where I’ve gotten the intros and stuff for my videos. It’s awesome. I’ve really been happy with what I’ve gotten from it. They also own a bunch of other stuff like ThemeForest.com where you can get html layouts and stuff with nice designs. Because I never invent those well on my own. The other pick that I have is more related to business. I hired a bookkeeper to fix my books for the last year. She fixed them so good that I knew the numbers were not right. So I went in to try and see what was going on. She was using QuickBooks on my mess. QuickBooks is impossible to figure out. So I went and tried LessAccounting.com which is a bookkeeping software for sane people. It is super easy to use. It made things really easy to see where everything goes. I’m definitely going to be picking LessAccounting.com. And those are my picks. JOE:  Sweet. CHUCK:  When does the call for proposals open up for ng-conf? Or you’re just filling it from people who come to you and say, “I want to talk.” JOE:  It’ll be opened up pretty quick. CHUCK:  Okay. JOE:  We’ve only really going to have a couple of spots to fill so it’s going to be pretty tight on the call for speakers. But that’ll be opening up soon. CHUCK: ** Okay, sounds good. Alright. Well, we’ll wrap up the show. We’ll catch you all next week.

Sign up for the Newsletter

Join our newsletter and get updates in your inbox. We won’t spam you and we respect your privacy.