I love discovering new cool WordPress plugins/solutions and I love it even more if the developer has taken the effort to create a demo video of the plugin in action.
However:
So, let’s address that. What is my opinion about that? I think it comes across unprofessional and sloppy. There, I said it.
Now, it’s very easy to criticize something, but it takes effort to actually come up with a solution. Or rather, in this case, steps to take to prevent sloppy demo videos. On that note, I’d like to share with you the steps that I take before I start recording a demo.
Screencast demo preparation steps
Time needed: 2 minutes.
In order to produce a clean and distraction-free screencast, follow these steps:
- Close all non-related apps
All non-essential apps should be turned off before you start recording.
- Use a dedicated Demo Desktop screen
Consider using either a dedicated clean account on your computer, or if you’re using a Mac, use a dedicated screen for your recording.
- Kill all notifications.
Make sure you kill all notifications before you start recording. In OSX you can do this easily in your the Notifications pane in your general settings.
- Set up a fresh demo installation
Create a new and fresh local development environment with a domain name that reflects the purpose. DesktopServer will allow you to do that, for instance.
- Update all the things. WordPress, plugins, themes, and translations. Yes, all the things.
Not having any updates available will allow all those OCD viewers of your screencast to focus on the actual screencast.
- Dismiss all notices in the Dashboard
All those upgrade and other kinds of notices are distractions. Perhaps even use a clever way to hide and combine all those notices, but that’s a different subject 😉
- Hide the toolbar, bookmarks in your browser
There are possibly personal and/or private links in your bookmarks bar, so it’s probably better to remove it while recording.
- Hide all the browser extensions and plugins
This is easily done by either using a private browser window or to slide the address bar all the way to the right.
- Make sure you have a fitting desktop wallpaper if you have the possibility it might be shown when clicking around
If you’re recording your entire screen and you need to click around to show what you want to show, you may want to consider a friendly background image.
That’s my demo preparation checklist. Obviously there are some things to consider when actually recording as well:
- Use a storyboard if it’s a long demo with lots of steps
- Do a proper introduction starting at the beginning
- Explain your steps while you’re doing them. Don’t assume the audience knows why you click somewhere
- Get a proper microphone that records something that’s actually similar to your voice
- Do a proper recap
So there you have it. Problem and solution. I’m sure there’s tons of smart stuff you folks do as well when creating demo videos and I’d love for you to share them in the comments!
4 responses to “Demo Screencast Preparation Steps”
Looks like there’s a super handy way to just remove all admin notices in one line of code:
remove_all_actions( 'admin_notices' );That assumes that all notices were added using the correct hook, so if a dev rolled their own notice loader then it won’t work of course. It’s probably handy just to load that code before doing a screencast to prevent any unwanted notices appearing.
Thanks Hugh! Great addition if your demo doesn’t depend on displaying any notices in the process 😉
Very timely post, as I recently recorded my first screencast. My biggest win would probably to get a better microphone but when it comes to clearing up admin clutter, I found the WordPress Database Reset plugin to be of great help.
It allows you to quickly revert a site to just after the installation process, the entire process takes 20 second tops.
Anyway, great tips, fully agree. Thanks Remkus!
That’s a great plugin / solution as well. Thanks for sharing!