Twitterizimization, Twitterizing Adimification. Twitter Ads.

/ ericlahti

Back in the day I aspired to be a graphic designer. I’m not overly great at it, but I always wanted to do it. I suspect being a designer is much like everything else – better on paper than in the real world. So I became a programmer instead and now I spend my days parasailing with movie stars and lounging on beaches. It’s a rough life, let me tell you.

hackgibson

Programming is exactly as awesome as this, only I’m usually surrounded by supermodels.

But there’s always that itch, that strange desire to create something visual that claws at the back of my head. It’s a feeling that simply writing doesn’t quiet so I create random things like book covers and twitter ads. P.S., if you need a cover designed drop me a line; I work cheap.

The combination of programming and some design background has given me access to a bunch of tools and the understanding that images have certain sizes that are expected from the applications that display them. Facebook cover photos are supposed to be 851 x 315 px. Shared FB posts render out at 504 x a variable number and the recommended strategy is to upload a 1200×1200 px pic. Twitter banners should be 1500 x 500 px. WordPress header images are variant depending on the theme you’re using. Tumblr banners have some size recommendations, too.

So when I set up my Facebook, Twitter, Tumblr, and WordPress sites, I followed the instructions and used images that would fit where they were supposed to go. I’m a little less rigid with my Facebook posts because they’re usually just random things or text string and everything works like it should. When I started putting up Twitter posts about my books I followed the same philosophy and wound up with things like this.

It looks okay here, but it’s cut off in a feed so you only see a portion of the whole image.

shocked

The problem was I stopped thinking like a programmer or a designer and started thinking like a lunatic. A little thinking and a little research and I actually managed to make a few Tweeted images that didn’t look like ass. Things like this, which look much better and can easily be viewed directly from a feed.

The trick was to get the sizes right. Shared images in Twitter (think things like your book covers and ads and stuff) are rendered at 590×295. That’s a 2:1 ratio. Twitter has an algorithm that decides how to handle images that are above that scale. That algorithm examines portions of the image and attempts to determine the important parts and scales the total width based on the important parts it finds. While this is an impressive bit of coding it’s not always going to render things the way you want them rendered. The solution: understand the image size limitations and work within the confines. Rather than pushing up an image that 1563×2500 (Amazon’s recommended book cover size), I pushed up an image that was 181×290. Small, to be sure, but good enough for Jazz and government work.

Book covers are only a part of the equation, though. An ad for a book gives you a bit more flexibility than just a simple 140 characters and some hashtags. They allow you to spend more time on things like dialog or extra explanations. This comes in really handy on a book like … well, anything I’ve written. For instance, look at The Clock Man images above and they don’t tell you an awful lot about the stories. They give a basic indication of the primary story, but there’s a lot more going on in the back ground and the cover doesn’t really describe the text. That’s why I came up with this guy:

I like to think the dragon itself (himself) is eye-catching and the text (pulled straight from the story) gives a hint of what lies inside.

That ad was done in my best friend, Inkscape. The dragon image came from Dreamstime and the text came from The Clock Man. The image was resized in GIMP and the whole piece was all assembled in Inkscape, then fed back into GIMP for some cleanups like getting the sizing right. The sizing was the key. Twitter images are rendered out at 590×295, so I designed the image at 1024×512 and then let Twitter’s algorithm shrink it all down to size. The result worked.

WOOO!

WOOO!

But let’s say you don’t have all the time in the world, don’t want to learn GIMP and Inkscape, and generally just need to knock a few things out quickly. Well, that’s where a little place called Canva comes in. It’s a free site that has pre-built templates for most social media and enough flexibility that you can make something that looks pretty good without killing yourself figuring out GIMP and Inkscape. Canva isn’t quite as flexible as GIMP and Inkscape, but it cane make some pretty slick looking ads with a minimal amount of effort.

As an example: here’s an ad I was working on today for The Clock Man. Aside from the very obvious fact that sex sells, the image actually does have a purpose, but you’ll have to read Zona Peligrosa to figure out what it is. Just to experiment, I first created the ad in my usual combination of Inkscape and GIMP and then tried to recreate it in Canva. The results are below:

ClockManLingerieAd

Created in Inkscape. Main image from Dreamstime: ID 22789426 © Alenavlad

 

ClockManCanvaBlackLingerie

The Canva version

The two images look pretty similar which means you can get a lot of quality design out of Canva for not a lot of effort. I like that. There are a couple caveats, though: the smoke rings and Clock Man logo were done in Inkscape and uploaded to Canva, so some of the image elements were pre-created. Canva has a ton of prebuilt images you can use, but if you want something special you’re going to have to create it yourself. Personally, I prefer the text work I can do in Inkscape; Canva doesn’t seem to have the ability to modify leading, kerning, and tracking. This isn’t surprising and isn’t really a show stopper. You can can get leading effects easily in Canva by using multiple body text elements and scrunching them around.

So which one did I go with? The Inkscape one, but that’s just because I had a specific font I wanted to work with and I had already done the layout in Inkscape.

But you’ve got to admit, Canva’s a hell of an awesome chunk of code. It’s fast, friendly, and easy-to-use. It has pre-built template sizes that are a breeze to work with and a very minimal learning curve. The kicker, though, no matter which program you use is to get the sizes right. If the ad comes out at a non-standard resolution it’s going to look wonky in the feed.

So, here’s the ad posted to Twitter.

If you want to learn more about the various image sizes, you can’t go wrong with a little research. Fortunately, someone’s already done the heavy lifting for you. Social Media Design Cheat Sheet

8 thoughts on “Twitterizimization, Twitterizing Adimification. Twitter Ads.”

  2. Oops. Sorry about that Eric. I was just about to rush off and posted the wrong comment. But I can repeat what I wrote. This is VERY helpful. I use Canva at the moment because it’s easy to use and meets my current needs. But I’ve bookmarked your page for later.

    Reply

  4. Pingback: Queen, the Serial Novel – My First Twitter Image Ad | Felipe Adan Lerma

  5. Pingback: Queen, the Serial Novel – Promoting On YouTube, Twitter, and Facebook | Felipe Adan Lerma

  6. Pingback: New Header # 22 – Samantha Lacroix Thrillers from Felipe Adan Lerma | Felipe Adan Lerma

  7. Pingback: Leap Day Adapalooza – Twitter Ads | Eric Lahti

Leave a comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.