A Few Hints for Tutorial Videos   November 6, 2009

November 6, 2009

A client recently needed some help on setting up video tutorials on her website. I realized that this info is probably of value to just about everybody, so here it is. Disclaimer: these are my opinions as to what constitutes an effective tutorial and this is by no means authoritative.

  • Initial capture:
    1. Script out the mouse clicks and screens that you want to hit in order (sometimes I do this in PowerPoint)
    2. Capture that workflow in a video with Camtasia or Captivate (possibly run the PowerPoint in another window for visual queues OR just print it out)
    3. Edit LIBERALLY to get tutorial down to final runtime
    4. Play video and record VERY rough voice over to get the basic structure down
    5. Replay voiceover and transcribe into a script, editing for brevity
    6. Read your script while the final video is playing and capture audio
    7. In Captivate or Camtasia, marry the audio with the video
  • Stay away from the post-it style popups that are so popular in Captivate … people are way too impatient to read in a video, so these are not effective (example: subtitled films don’t do well)
  • Instead, to highlight content or actions, perform a ZOOM in the video editing software
  • When doing the VO, keep a consistent distance from the mic. I’d say 12 – 14 inches if you have a standalone mic. If it’s clip on or headset, then ignore this.
  • I like audible clicks and typing sound effects in tutorials.  In Camtasia, this is one click box.
  • Make sure the volume is fairly loud, but not blaring on the final version … people always have their speakers wayyy too low
  • If this is an intro-style of video, it should be really fast, like 30 – 45 seconds (you are telling your audience that your service or product is as easy as 1-2-3 … so REALLY make it as easy as 1-2-3)
  • Unless you have an insanely complex form (and if you do, you might consider redeveloping it), when demoing a form being filled out, show the beginning of filling out a form, then do a blur transition to “fast-forward” to the completed form.  If you must, fast-forward blur to the challenging parts of the form and in your voiceover, give users clear, concise direction.  Or, like I said, redevelop.
  • Break non-intro tutorials into 1 minute to 1:30 chunks
  • Use an SEO-friendly player like Longtail

That’s a messy, incomplete set of guidelines to making an effective tutorial.

Responsive Design and MarketingtopLingo is Orange County's premier responsive web software developer.

Responsive web design optimizes the site experience for both desktop browser and mobile traffic, while minimizing page overhead. Top Search engines recommend responsive development for cross-platform marketing. TopLingo specializes in responsive application development. To see our capabilities first hand, view our site on a tablet or phone.



Client Testimonial

See what is being said about topLingo. Design World Online

topLingo took on a web project that most other web providers would not touch based on timing and cost. They not only stepped up and took on the project, but kept costs under control for a custom & rush development situation. With strong leaders and ...

Portfolio Slideshow

Tap into our design expertise. topLingo Portfolio

Make Contact

Get in touch with us.



Web Development Firm