On Your Way Out of a Project? Capture What You Know in a Screencast

At Atomic, we regularly rotate in and out of projects. We work hard to pair with our clients and give them artifacts to help them after our contracts are over.

Sometimes, though, we know that they’ll need to really dive deep sometime in the future. It won’t be cost-effective to bring our team back in just for that. Instead, we can record screencasts.

How to Make a Screencast

On a Mac, you already have everything you need to record a screencast with QuickTime Player. The steps are simple:

1. Launch it,
2. Cancel the file dialog, and
3. Select New Screen Recording from the File menu.

From there, you’ll see a little toolbar. Select to record a screen or a portion of your screen. I like the former because it becomes easier to bounce between apps. I have a two-monitor setup, too, so I can record just one of the screens this way.

Once the countdown timer goes down from 5 to 0, you’re on the air. Go through your demo, explaining things you want to point out along the way.

When you’re done, go back up to your menu bar and click the stop icon — it’s a square inside a circle. QuickTime Player will open your captured video file.

Tips for Making a Great Screencast

There are a few things you can do to make your screencast great.

1. Clean up your desktop before you start. Things that aren’t related to the screencast can be distracting and may even give away sensitive information.
2. Go on Do Not Disturb, just to make sure nothing pops up to interrupt you as you work.
3. Get a quiet room. The mic in a MacBook or your AirPods is really good, but it’s still best to eliminate background noise.
4. Embrace the chaos of a live demo. For example, I recently got to the 12-minute mark of demonstrating a complex framework and was trying to show that the framework had typed a parameter. Unfortunately, Visual Studio Code showed it as “any.” The transcript from that section of the screencast:
   

   We have a message handler… and the second parameter is any. Why is it any?

   *video cut*

   This is not actually the wrong type. I reloaded TypeScript…

   You can stop the video in situations like this, start a new one, then put the clips together by dragging one into the other right in QuickTime Player.

   And your audience will probably enjoy it, having experienced this sort of thing so many times in their own lives as well.

Getting That File Down to Size

Set some time aside for video encoding.

My 21-minute demo in 4K originally clocked in at around 5.3 GB. That’s way too big. Saving the joined files from QuickTime Player got it down to 3.1. A trial run on my iPad Pro (which also kicked it down to 30 fps) got it to 1.1.

But what really helped me out was ffmpeg. You can install it from Homebrew, and use it like this:

$ ffmpeg -i Screencast.mov \
    -c:v libx264 \
    -tune stillimage \
    Screencast.mp4

Once this finished — on my 2018 i9 MacBook Pro, it took about 50 minutes — the resulting file was 266 MB. Much better.

Follow Up

Encourage your client to look over your finished product and ask questions at this point. See if everything’s clear or if they could use some additional commentary. Resist the urge to edit your video — you can include errata instead. Video editing is very time-consuming, and probably not the best use of your limited time. Once you’re done, share it somewhere they’ll be able to find it later (ask them where!).

With your screencast, you’ll be able to help them long after you’re gone.