Many of you will be familiar with the two column audio / video format. This script adds a third column, "annotations". At HapYak, we typically fill this column first and let the annotations inform the audio and video columns. This was an actual shooting script for this marketing video we produced.
Sample interactive video script
Title: Most Common Interactive Annotations
Audience: Consideration phase leads
Goal: Viewing of 3+ segments to indicate a MQL
Key Interaction: Sign Up / Login
This is a branching video with a splash screen - use Chris' icons for each of the types of the annotations. Make the icons 3D with a subtle drop shadow.
Each section of the branching video is itself a micro-learning video - 90 seconds or less. It will clearly and simply say for each annotation
- What it is
- Why you’d use it
- What value it has
The Master Branching video will be 960 x 540 on a Landing Page directed at consideration phase leads.
The Question annotation lets marketers score and qualify leads directly within the video
And, lets trainers ensure compliance and engagement.
|(Two Icons, One for Marketing, one for eLearning)||[Dave Z on Cam]|
|Which would you like to learn more about?||Hotspot - Link to time||[Z gestures left and right at eLearning Professional and Marketing Professional icons|
|Marketing: Marketers use polls or surveys to help qualify leads [pause for example], score leads [pause for example], or extract lead intelligence. We see a roughly 65% response rate to well-placed in-video questions.||[Screenflow of marketing Examples]|
To create a poll or survey using the question annotation, on the control bar click this icon. Next, Ask a question! What question? Simple. Use the few tried and true questions you ask already on a lead wall or your sales teams ask on Discovery calls. For example - "What’s your budget in the next Fiscal Year?"
Add your answers.
|[Screenflow of creating a quiz for Marketing]|
Let’s skip forward to add the next question. We highly recommend spreading your questions throughout the video.
A good rule of thumb is add your first at a natural transition point about 15 - 20% into the video.
|[Screenflow: Add an annotation at a natural transition point]|
Then - a new question every 60 seconds or so.
Have fun with the answers. Marketing’s fun.
Select "Done". We’ve just created our first in-video question. If you want to discover the best leads and prospects hidden within your audience, this technique can’t be beat.
[Screenflow at 4x speed: Add two more questions "Do you use online video as part of your marketing strategy?".
Add answer: "Every chance I get!" "I’ve added a few in my time." "A what now?"
Skip forward. Add third questions. "How many videos will you produce this year?"
|[Branching to eLearning option]|
Compliance, Engagement, Assessment.
The question annotation is used by eLearning / training professionals to increase engagement or ensure the viewer is in compliance.
|[Screenflow of eLearning Examples]|
Let’s take a look at creating a basic eLearning example. At the bottom of the project editor click the question annotation icon.
Next, Ask a question!
We recommend playing around with different styles and timings of quizzes.
They can be foreshadowing questions, can be lightweight or very detailed - they can even ask about material covered in a previous video.
Use the same instructional design techniques you’re used to to enhance retrieval, recall and retention.
Two tips on the options:
[Screenflow of creating a quiz for eLearning]
[Screenflow: CU of Clicking “done”]
You create a Free Response quiz by deleting the multiple choice answer and clicking + Input
Free Response quizzed ensure the viewers are engaged and can repeat the material in their own words
|[add another quiz. delete MC answer. Add + Input.]|
What’s eLearning all about? Encoding and Retrieval. Encoding and Retrieval. Video is BY FAR the best technique for encoding - it’s how our brain is wired to learn.
In-video questions are your final piece of the puzzle - retrieval built right into the video.
|Add images on top of your videos to display your company’s logo or enhance the overall aesthetics.||[Dave Z on Cam]|
|Text Annotation: Link to Knowledge Base Article||[Screen Flow of Creating Images]|
|Using buttons in your videos is an effective way to highlight CTAs to your viewers. Buttons can also link to different parts of your video to create a branching effect, link to external content that you want your viewers to see, and even trigger other interactive annotations to take place. Let’s see how to create a button.||[Dave Z on Cam]|
Using buttons is easy, simply make a text annotation with your desired text, then, link your text annotation to external content or a specified time or chapter in your video.
Let’s take a look at creating a button to link to internal video content
Create a text annotation by navigating to the control bar in the project editor and type the text you would like to appear in the button.
For our purposes, we are just going to link to a different time within this video, say second 45.
Press submit, and you have just created your first button! It’s that easy!
|Quiz Annotation: Engagement Multiple Choice Question||[Screen Flow of HY Project Creating a button]|
|Well, that was cool, but what if you want to use an image or a logo as a button? Simple! Let’s take a look at how to do that now.||[Dave Z on Cam]|
|To create a button using an image simply navigate to the location in your video that you want your button to appear. Click the image annotation in the control bar of the HapYak player. Images can be uploaded one of two ways, a direct file upload, or from the URL that the image lives on. For our purposes, we are going to upload a file from our local machine. Click the “Upload File” tab in the annotation window and select the file you wish to use as your image. Resize the image the desired dimensions and make sure to place it where it won’t obstruct your content. Next link the image to the content or time in your video as desired. We’re going to link to another website. Notice you can choose to continue or loop back the video if the user does not click the button. We’re going to set ours to continue. Press submit, and you’ve just created a button using an image!||[Screen Flow of creating a button with an image]|
|Hotspots should be used when you have existing elements in the video and you want make it clickable. For example if you have added images and/or motion graphics (in programs such as Premiere, After Effects, etc…) you can use an invisible hot spot to overlay that section of the video, making it clickable.||[Dave Z on Cam]|
|Let’s take a look a few examples of hot spots.||[Screenflow of Hotspot examples|
|To make a hotspot, click the hotspot annotation icon in the control bar of the project editor. Next position the hotspot over the desired image or motion graphic in your video that you would like to make clickable. We’re going to set ours over the HapYak logo. Resize the hotspot to fit the parameter of the image. Next, set a duration that the hotspot should be active for. We want ours to be actionable throughout the entire video. After setting the duration, it’s time to link your hotspot, we are going to link ours to our HomePage. (You can also link to a chapter or specified time in your video). Select done, and we have just created a HotSpot!|
|One of my favorite features of HapYak’s video platform is the ability to make branching or, choose your own adventure videos. This allows viewers to have the ability to choose how the video is played, often times in a nonlinear format that skips to different sections based off user interaction.||[Dave Z on Cam]|
|A branching, or choose your own adventure, video is a common use case that we see our customers often use. Branching videos can help your viewers find the content most relevant to them the fastest, while helping you understand what is most relevant for your viewers. A branching video can also be a fun way to keep you viewers engaged. Let’s take a look at how we can create our own branching video.||Hotspot Annotation: Link to examples with hotspots.||
[Examples of a branching]
Show Nutanix, Lenovo, HP - link or examples grid
Three different outfits
|[Screenflow of building branching video]|