Gadgetory


All Cool Mind-blowing Gadgets You Love in One Place

The art of making GIFs (Verge @ Work)

2013-03-22
we live in a digital age where texting has become largely preferential to voice the Verge's staff is scattered around the globe and as such we spend a majority of our days social and otherwise in chat rooms and mail clients but text only says so much it never really conveys the right emotion with a me at all you can always use a smiley face but well that isn't always clear either so for majority of communication we use gifts lots of gifts no wonder I went yeah I want to add that but then I was I was riffing I didn't know where to go for that all right I think I know how to do it okay think of it as an artisanal emoticon lighter than a video heavier than a still perhaps deeper than both an unchanged container capturing human history or you know cat history making a gift doesn't have to be that difficult all in fact for the most basic things we just use a still image in a web app let Oscar favorite ones include blingy which has a lot of extra gaudiness and flare the other one we like is deal with it which will so we're gonna make a blingy all right so let's go ahead and find the right picture all right now we've got Thomas Easton let's go ahead and start adding a couple dancing Santas over here there's Christmas let's add some snow yeah now that is the winner I like what he needs a hat Oh cats cats always work alright and now we're set stills are nice but video is really clutch for us it all starts with the video thankfully there's a lot of quality apps that are the most everything you want to do for OS 10 we've been having fun with gif brewery it's simple its intuitive and about five dollars in the App Store it's relatively cheap for this example we're gonna use the Verge's own David Pierce the next step is arguably the most important find your moment we look for moments that are useful in everyday chat we typically like to find anything that can convey happiness frustration disappointment or you know morale is low just a good laugh framerate is the other key factor here and if your app lets you change it we'd recommend starting at 12 frames per second and going from there the trick to the perfect loop is isolation as a little bit of a moment in time as possible to really ensure constant or these fake continuity now we have much fewer frames and we've got a full fluid David dance because the limitations the medium captain's really do play a huge part in maximizing the message obviously there's no audio with a gift so let's focus on a subtitle now for some apps you can definitely do a frame-by-frame text but unfortunately for gif brewery it's really all or nothing so let's go ahead and just make a party down David alright and with that okay hopefully your work of art is ready to be birthed it's time to export and compress in file size is very important here as a hard and fast rule we generally shoot for gifts that are under one Meg typically half that but tumblers file size limit is one Meg we think it's a good metric let's go ahead and really quickly let's throw that on some kind of sharing site so that's the basics it really should cover most of what you're gonna want to do both The Verge video team and dev team swear by using professional software like Adobe Photoshop Premiere After Effects Apple's motion and it really makes sense we can think about because these are professional software tools they were used to make high quality video and high quality stills and the gift just falls somewhere in between those two hey buddy hey I'm just making this advanced animated gif here so I'm gonna start this project in After Effects although I guess you could do this in Premiere or Final Cut Pro or any other video software but I'm gonna go with After Effects today because we're gonna use a couple of the unique features of that program so I've already imported my video clip it's David here looking confused angry sad this range of emotions in this clip I think I'm gonna drag this onto a new competent than After Effects and trim it down a little bit so I think it would be great to punctuate that moment a zooming in on him and the reason I'm doing this in After Effects is because I'd like to apply some dramatic motion blur so that's looking pretty good but I want to punctuate this a little bit more so of course the font to use is impact David grows David displays hamburger and cuts off their so now I'm gonna export this but the trick here is to pick a frame rate that's pretty low this thing started at 24 frames a second but I'm gonna lower it down to 12 or 15 frames a second because as I see in the next step keeping a gift small and file size is key to making a successful gift so now that we're in Photoshop I'm using cs6 so it'll handle video pretty well we can scrub through it and check that everything looks okay the real trick here is using safer web this is huge so I'll have to resize this down to maybe 500 pixels wide another very important part of gift making is making sure that it loops forever not once now just to double check my work when I throw that file into Chrome well it's looking pretty good to me now for the final step see what David thinks so looks to me like that was a successful gift all right I know it sounds ridiculous but in this modern age we really do think of gifts as a necessary tool for communication for really conveying the right emotion and getting your message across you know at the right time a gift can be more of a personal statement and less of a random joke you know just be a random drug
We are a participant in the Amazon Services LLC Associates Program, an affiliate advertising program designed to provide a means for us to earn fees by linking to Amazon.com and affiliated sites.