- Create Camtasia file at 1280 x 720 px
- Open browser at 1280 x 720 px
- Record video using Camtasia
- Place recording in Camtasia time line
- Shrink video to fit into frame
- Use zooming to show parts of the screen at full pixel:pixel scale
- Use Camtasia arrow drawing to draw labels then add label afterwards
- Arrow in #D90000 (rgb 217,0,0)
- Add labels at 72 px Caveat bold #D90000 (rgb 217,0,0)
- Add intros, either data intro or how to, depending on type of video
- Extend out top bar so that it lasts the length of the video
- Change label in intro and top bar
- In YouTube enable Closed captioning.
- Go into Closed captioning and Duplicate and edit the Automatic closed captioning.
- Go through and fix any errors.
- Add a yaml file in a folder that makes the most sense (e.g.
media
folder orvideos
folder in the same folder as your article) - IMPORTANT: use the 3-letter extension:yml
, notyaml
. - Make sure the video yaml file has the following fields:
type
- always set to "video"title
— title of the videodescription
— description of the videoyoutube_id
— video id copied from a youtube url (note: only the id, not the full url)
- Add the
related_videos
field to the frontmatter of your documentation file. Therelated_videos
field should contain a yaml list with a path to your video. For instructions on how to write such a path, see the metadata instructions.
type: Video
title: Select a species or assembly
description: How to select a species, strain or assembly.
youtube_id: v6HKpja5t1M
Using this option will allow us to extract the video and to display it side by side with the body of the article, in a way shown in this design.
You can add a video inside the body of your article by copying its embed code from youtube and adding it in the body of your article, like so:
Here is my first paragraph, right before the video.
<iframe width="560" height="315" src="https://www.youtube.com/embed/C2g37X_uMok" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
Here is my second paragraph, right after the video.