As a designer, I’ve been capturing others’ good design patterns and interactions to get inspired. Here are some tools I’ve been using on Mac.
Take screenshots:
Both Windows and Mac offer great default tools to take screenshots. When I was on PC, I used the Snapping Tool, which allowed me to screenshot a specified area, add annotations (text, lines, shapes) and then save to somewhere on my hard drive. Super convenient.
After I switched to Mac, it’s much easier to take screenshots, but for making annotations? Not so much.
I normally use these two shortcuts for screenshots:
- command + shift + 4 for a certain area
- command + shift + 4, then space to capture the currently active window
- command + shift + 3 for all the active displays
Mac conveniently saves the screenshots in high-res .png images to the Desktop. Unfortunately, there’s no easy way to add annotations right after they are taken. One option is to open them in Preview to do further tweaks; another option is to download a free annotation app Skitch from Evernote.com. Both are very easy to use.
Skitch:
Preview:
Capture/Record screens:
Here are two tools I found extremely helpful when I want to capture good interactions from websites and apps.
Gifgrabber
Gifgrabber is a free and awesome app from Mac App Store. It has been a great buddy since I found it last year. It records 30 secs of screen interactions into .gif images. You have the options of capturing mouse, resizing the images to 50% / 75% / 100% of original size before save.
I noticed quite a few occasions there weird were color twists in my gifs. I contacted Gifgrabber and they kindly sent me their latest beta, which works great! Download their latest beta version at http://www.gifgrabber.com/beta
QuickTime Player
Pre-installed in Mac, QuickTime lets you record videos as you interact with items on your screen.
Initiate a recording on desktop:
I’ve heard it can record iPad or iPhone interactions if you connect your device to your Mac using the Apple lightning cable, and hit the record button. It looks like QuickTime doesn’t like my 3rd party USB cables very much, so I haven’t succeeded yet.
A Pinterest board of design interaction captures:
If you are a designer and interested in good interactions I captured with Gifgrabber, check out my Pinterest board: GIFs of Design Interactions. You’re welcome to join as a contributor for this board, just send me your email and I’ll add you.