Creating gifcap.dev gif

Mini tutorial

From a glance, you aren’t able to understand what gifcap does so how do we get users to understand the usefulness of gifcap?

I use this tool a lot for my portfolio to capture interactions so I wanted to show my support by contributing something!

Components I created

Buttons

Dialogs

Fake desktop

Timeline

Interactions

Press the start recording button opens up a dialog.

The dialog opens another dialog to pick the screen you want to share.

You’ll record your screen and when you stop recording…

You’re able to see your video! I did a quick timeline animation and desktop animation to represent a fake video.

Lastly, the video plays from what you cropped the timeline to and you can download it!