Foursquare Leader Email Template

After designing a new email that would combine four of Foursquare’s newsletters into a single HTML template, the code has been finished and the first email is scheduled to go out the first week of September.

Aside from being a massive step forward for Foursquare visually, the new template is a perfect example of just how powerful the new changes to Campaign Monitor are. Rather than being locked up in a single layout, Campaign Monitor has opened up their code for programmers to create layout options, which are elements that can be added to an email on the fly. For example, the new Foursquare template sports multiple single-column, two-column and three-column options that can be dropped anywhere in the template. This makes the email more like a curated page of content than a typical newsletter. Just swap out the header image, select some different layout options and you have an entirely different email than what went out before!

The trick for the design was to find a balance between the current look and feel of the Foursquare website and where Foursquare wants to go in the future. While the previous email template was a direct translation of the website, the new email can stand on its own, with a real minimalist appeal. I used a lot of neutral tones so the email would look natural with any masthead that’s dropped in the design. When your logo features red, blue, gold and purple, you practically have practically the entire spectrum to deal with. Better to keep things simple than go way overboard with a paintbrush.

This template also has to pack a lot of content into a tiny amount of space. While most websites have the luxury of sprawling out to at least 960 pixels, email etiquette suggests keeping your design down to no more than 650 pixels since there is so much discrepancy among the window sizes of email applications. So that doesn’t leave a content-driven organization like Foursquare a whole lot of breathing space to pack in the two dozen articles and links they like to include in most newsletters. To avoid a traffic jam of content, I made sure to design several layout options, including one-, two- and three-column elements (both with and without images) that can be used anywhere in the email at any time while keeping the minimalist appeal I was going for in the design. Nothing will ever look out of place and Foursquare now has the most flexible and manageable email template they’ve ever had.

The new template makes its debut the first week of September and I’m excited to see it!