How to create a GIF - vmware/versatile-data-kit GitHub Wiki

This tutorial is step-by-step guide on how to create a GIF as in the example below:

Steps to make a GIF

Download and set up OBS Studio

  1. Download the OBS Studio.
  2. Create a scene and select Source -> Window Capture.

"Tip" here's a quick tutorial on Window capture (https://youtu.be/IsrHxGVKjHE?t=52)

  1. In the Window section select your terminal.
  2. Drag and make the terminal visible on the screen that will be recorded. You can zoom in, zoom out, move the window, etc.
  3. In Settings -> Video, I've set the resolution 1700x1260 (if you're using another size you'll have to adjust the video to your size later too)
  4. Set Settings -> Output, to mp4.

Tip: if you want to use the same terminal colors they are - #6FE9FF and #24272E.

  1. Start recording. You can pause recording once you have a command recorded (I used to clear the screen before I start another command).
  2. When you're done with your recording - Stop the recording, it will automatically be saved.

Edit your video

  1. You can open any video editing software. I use a free editor - HitFilm Express.

Tip: if you're using another editor, just consider the size of your project (1700x1290) and the colors of the text all the other instructions are HitFilm Express-specific

  1. Create a project and set the size of the video to 1700x1290.
  2. Import the video you just made.
  3. Create a new Media source -> Plane -> Set the color to #24272E.
  4. Create text to match your actions
  5. Export the video
  6. Export -> Presets -> Create a new Preset, mp4, Dimensions should be from the source. Save it.
  7. In the Export panel, select the new preset
  8. Press Export -> Export Now -> Contents

Convert your video to a GIF

  1. Go to mp4 to GIF converter
  2. Upload your gif and Convert it.

Great success!

Congrats! You have your GIF ready!

If you want to add it to your documentation, upload it to the /support/images And use the following way to embed your video in your documentation, you can adjust your size by changing the width: <img alt="alt text here" src=" URL to your gif " width=70% height=auto />