In olden days, technical sharing are done through book. However, much illustration is needed when we share some procedure and steps, since the data written is static.

With technology, now we could find technical sharing done in Youtube video. It’s dynamic and perfect in illustrating technical process. However it’s content is hard to search, since all details embed within the video.

Hence technical blogging with GIF is the best middle ground where we have both static searchable information as well as animated content for clearer illustration. It’s the way of more successful technical sharing moving forward.

Are you referring to the trending GIF Emoji?

Hmmm … a little. It is popularly used to express emotion. Used it rightly it will help engage your user making the content less dry with add on feeling you try to expressed.

Nonetheless, what’s I’m referring is more on GIF that illustrate technical content.

Hmm, how to create such GIF?

Well, I’ll share with you how I do it using my Mac Machine.

1. Use QuickTime Player to record your content

In QuickTime Player, there’s a feature called New Screen Recording.

Using it you could record a selection section of your computer screen. It will generate a MOV file.

2. Use an online tool to convert MOV to GIF

There are several online tool that help convert MOV to GIF. They are free, and allow you to convert any video format to GIF. Listed below are 2 of them.

Making a better GIF

The above process will just generate normal GIF. It doesn’t record some of the thing like, mouse click and keyboard use. Below are some ways to improve your GIF.

Showing mouse click

In QuickTime Player, the Screen Recoding does have ability to record with showing Mouse Click as illustrated below.

During record you won’t see the mouse click. However after record, you’ll see the CIRCLE in your video showing the mouse is clicking as illustrated below

Showing the key pressed with Virtual Keyboard

Sometime we want to show the key we pressed (that is not visible) in the video. In Mac, a virtual keyboard is provided. You could get it from the Keyboard Icon (top right of the screen).

With this in place, you’ll have a keyboard shown and they key type is recorded.

Nonetheless the keyboard is so small and hard to see.

Showing the key pressed with KeyCast

If you are allowed to installed a tool to show your pressed key, the below tool would be helpful.

Using it, you could clearly see the key type cast to the screen. Hence what is type is so clear in the recorded GIF.

GIF has indeed made the technical blogging better illustrated. It is nice as it is auto played and replayed. User would be more engaged and understand the content.

I hope this post is helpful to you. You could check out my other interesting topics here.

Follow me on medium, Twitter or Facebook for little tips and learning on Android, Kotlin etc related topics. ~Elye~