How to Add Screenshots and Animation to GitHub Pull Requests

Featured Github Add Animation Screenshots

GitHub programmers often add screenshots or animated GIFs to their repository pull requests. These techniques are definitely more eye-catching than making someone read several lines of plain text. Adding static screenshots is helpful if you want to insert visual changes or photographs inline. A GIF animation is a nice way to demonstrate process flows and mouse-cursor motion.

The following tutorial will show you right from the beginning how to add screenshot images and GIF animation in GitHub pull requests. Even if you have never used GitHub before, you can use these steps to get started.

1. Add a New Repository and Branch

If you are new to the world of GitHub, follow the procedure here to create your account.

Click the “+” sign on the top right to create a new repository. Remember to check the “Initialize this repository with a README” option.

Github Add Animation Add New Repository

In the next stage, add a branch to your repository using the drop-down menu shown below. Here, the branch “Guten-tag” has been added to the “Hola-World” repository.

Github Add Animation Add New Branch To Repository

The purpose of a branch in GitHub is to help the developer work on features and bug fixes separate from the master production branch.

Github Add Animation New Branch Added In Repository

2. Create Screenshot or Animation

For adding screenshots, you need a good screen capture software. In Windows 10, some of the best and easiest tools are Snip & Sketch and Snipping tool.

To add GIF animation, you need a good video screen capture tool. A recommended tool is Recordit which is extremely easy to use for fast screencasting. It is available as a direct download for both Windows and macOS.

After installation, you can record a few seconds of any screen using a Record button. All your recent screencasts will be visible from the system tray menu and open in a browser.

Github Add Animation Recordit Screencast Added

Since GitHub pull requests don’t allow video files (MP4, etc.), you will need to convert them into GIF files. In fact, it supports a very limited number of custom files: JPG, JPEG, GIF, PNG, DOCX, PPTX, PDF, TXT, XLSX, and ZIP. You can easily convert an MP4 to GIF using Ezgif or any other online tool.

The following created GIF file will be inserted in a GitHub pull request. It demonstrates the simple sequence of adding a new branch to a GitHub repository using the GitHub Desktop app.

Github Add Animation

3. Add Screenshots or Animations to GitHub Pull Requests

Go back to the branch you created earlier and navigate to “Pull requests.” Here, you can edit the pull request data from a three-dot menu.

Once in editor mode, you can attach the screenshot image and GIF animation files from the “Attach files” option. If you’re committing for the first time in GitHub branch repository, click “commit.” Otherwise, the choice is to “update comment.”

Github Add Animation Add Screenshot And Animation To Branch

The created screenshot and animation have been added successfully to the GitHub branch, and in turn, the repository.

Github Add Animation Gif File Added To Pull Request

GitHub is all about collaboration with other developers. If they like your proposed changes, they might merge it upstream into their own repository. This is done using the “merge pull request” option.

Github Add Animation Merge Pull Requests

An animation is definitely a good way to attract the attention of other developers in the GitHub community. By completing this tutorial, you have learned how to add screenshots and GIF animations to your GitHub repository and any of its branches. If you are not into GitHub, you can check out this list of GitHub alternatives instead.

Subscribe to our newsletter!

Our latest tutorials delivered straight to your inbox