Screencasts, SaaS, and micro-interactions

There’s an explosion of GIFs & micro-interactions on websites today. Why?

Because SaaS companies are all asking the same thing: how to show off our product?

So what will you learn in this article?

1. What top companies are doing and why
2. How you can do the same thing on a budget
3. A walk through of how to make a screencast video with solid story
4. Tips on which editing techniques will givey ou the most bang for buck
5. Common mistakes to avoid shooting yourself in the foot over 

The 2021 solution is to blend styles & mediums.

Similar to what Buffer is doing above on their homepage. You want to capture the nature of the experience: part of it human in reality & the other part within the digital realm.

Or this Monday.com homepage video.

Today the screencast is no longer just a tutorial walkthrough. Gone are the days of grainy audio and 5-15 minute walkthroughs. (and it’s best for everyone).

But the question stands: how do you really show? What does it mean to show and not tell?

What we learned from this year of producing screencasts 

Here’s a quick demo reel of this years projects:

From having worked on about 30-40 screencast videos this year.

This was the year of the dashboard (or UI/UX). Where companies wanted to

1. Show off the actual product, but in a sexy way (think micro-interaction, GIFs, smooth animation)

2. Connect the product to the outcomes (what happens outside of the dashboard?)

3. Combine the digital with the real world - using stock, or having live-action crews film them.

4. Give more life and dynamism to their dashboards, even if it meant distorting their “actual” UI/UX, or in more euphemistic terms “embellishing” it.

5. Stories are surprising, relevant and emotional to the TARGET audience - not to everyone, so don’t worry if others “don’t get it”.

These are our 5 takeaways. And we developed them into a framework for how you can approach your screencast video for maximum impact.

From a scripting point of view, we have already covered a good general idea of how to script videos for B2B markets here.

And no, it doesn’t require throwing tons of money at it.

Some time, yes. Some thought, absolutely, but money will only get you so far - in the end it comes down to great product and great market solution fit.

But before you pull out the moneybags and start spending - consider this: when is it time to get an explainer video?

After the economics of it make sense, proceed to the next step.

A simple approach for excellent screencast videos 

In order to get this done, there’s a simple approach:

1. Within the UI/UX, what are the highest value actions? The ones which trigger a game-changer for the viewer? Gather those first.

2. What are the product outcomes? How can you display them visually? This is your opportunity to “story-tell”, to wrap it all up.

EXAMPLE: You run a mobile app for local dog babysitting. You decide that within the app, the things which you want to show - the highest value actions are probably:

• NOT the signup - because it’s obvious and generic (unlikely to be the core objection)
• NOT your terms and conditions, because that won’t build emotional momentum
• PROBABLY app profiles of dog babysitters, since that will build trust, show human faces, and community
• PROBABLY showing the simplicity of booking + payments (since this could be a big objection)
• PROBABLY information around rating, reviews & safety

So we could just make a video with ONLY these app screenshots, and create a story around it. But, that’s not the full power of video. 

Now, what are the outcomes?

• The app profiles give her peace of mind, we could show her smiling, petting her dog, maybe her dog runs up and she gives it a treat - we want to capture the feeling of security, safety and trust.
  
• Booking & payments. She’s in a rush. Money is never a fun topic. Let’s confront the elephant in the room - how much will it cost, how will you pay, by being transparent lowering the perceived friction for Samantha. The solution becomes clearer.
  
• Reviews. Here we want to focus on Samantha doing her primary activity with zero concern about her dog. Even showing the extreme level of love and care her dog is getting while in care. 

From here, we can start thinking about the visual rhythm or narrative as a combination of features from the product dashboard, which will lead to critical actions and afterwards capture the feeling within the outcomes.

Now contrast that with how people usually make their video “lets just show everything”. Which I guess is a very honest (and lazy) approach to marketing or in some ways it’s even DIY. In the sense that you expect your viewer to put together the puzzle that you were too lazy to.

So a simple formula: 

Product screenshots -> critical micro-interaction -> outcome shot (illustration or live action)

Ways to improve the production quality of your screencast demo video.

Of course, content is great, but style, aesthetic, is something we’re all drawn to. So how can you make your content stand out? 

For your actual screencast of product dashboards 

Focus on using techniques like:

1. Pre-fill content. If you want just fill in 1 field so you have some movement to catch the eye - this way you can move into camera movements or transitions instead of text typing.

2. Think of strong poster-like text headings. You can’t assume your audience will understand the dashboard. It’s a good idea to include headings or key messaging.

3. Tilt it. Doing a tilt and pan can do wonders for your screencast. Consider this a must if you have a particularily sexy interface.

4. Distort it. Use key pieces of your interface and add other elements like real people cutouts (or videos). Companies like Monday.com do this with huge success.

5. Continue the aesthetic across mediums. Take the app and add it to real world environments. Using a bit of 3D can make stock footage feel customized.

6. Animate the fill outs. It always looks better, more smoother, puffier, a little more tasty for the eyes to watch.

Those are some easy ways to add more flair to your shots. Give them a bit of life and make it aesthetically more interesting for someones eyes to stay tuned.

With that being said, let’s talk about some of the things not to do with screencast videos.

Common mistakes we see people making with screencasts 

The most important thing arguably in video content is the flow. It’s the interplay of the visual and the script, how it comes together. It could be silence, pause, ebb and flow.

It's important you follow a solid screencast video production process.

For some reason when it comes to screencast, people think it means you have to pull the personality. Yet many companies such as Wistia, AHREFs or again Monday.com, have managed to create tutorial videos which not only educate but entertain (under 5% of the time).

The point is: your screencast doesn’t have to be boring. That’s a choice YOU make. And if you want to make a boring screencast video, no one is stopping you.

And by that same logic: no one is stopping you from making the best screencast the world has ever seen. 

But while no physical person is stopping you, here’s a few mistakes that could really shatter your hopes and dreams of winning an Emmy for your next screencast video.

1. You start off slow. Remember, it’s a video - people want to get excited in the first 5 seconds… don’t say “hey guys” - don’t show a login screen. Tell them the context, the value upfront, of why they are tuning in.
   
   
2. You want to explain every detail. This is excruciating. If I ask you to clean your desk - you know what to do. I don’t need to film a video showing you how to put pens in the holder, but, I might want to give you a before and after to show you desired outcome.
   
   Point is: know where the limit is, know what not to show.
   
   
3. Shorter is better, wherever you can cut it down - do it. Copywriting is all about simplicity and effectiveness, so always be boiling it down. Reducing. Simmering the best parts about your products story into a delicious sauce your audience will eat up.