Making an animated banner for your G+ page is as simple as making an animated gif, well actually it’s 5 animated gifs lined up in a sequence. So it’s as easy as making one animated banner-sized gif, then slicing it into 5 squares!
First you need an original animation in the size of the banner. The space consists of five 125 x 125 squares. So the width of the banner is 5 times 125, or 625 pixels. Technically there are four 15 pixel spacers between the squares, so your final banner dimensions will be 685 px x 125 px.
Below are two of the final squares in our banner, with the 15px spacer.
For our Urbane Media banner, I used Adobe Flash to create the original movie file.
NOTE: For better quality, don’t save your flash animation as an animated gif, wait to do this in Photoshop because it does a better job. Instead save as a jpeg sequence or a quicktime movie from Flash.
Next import your movie into Photoshop for chopping. Now it’s a matter of cropping and saving the 5 squares. For an easier time, set your crop tool to 125 x 125. If your images are but a pixel to large, they won’t animate on your G+ page.
To get the spacing right, I copied and pasted a screenshot of another Google Plus page to use as a template.
after each crop, export as a gif by going to “export for web and devices” under the file menu.
Now upload them into your Google Plus page in order from left to right, and you’ve got yourself a brand in motion!
Matt Oberdier
Matt Oberdier received his BFA in Illustration from the College of Creative Studies in Detroit in 2008. He has since worked as a freelance graphic designer & web developer. In his free time, Matt enjoys playing guitar & singing, cooking vegan food, photography and acting.
Follow Me:
