Your SlideShare is downloading. ×
Design by Numbers           David KepetsCreative Director, Strategic Services
On average47% of openersread or skimwithin 4-11seconds.
Perfecting theright formulaof contentand layout.
Lets play alittle gameof memory.
Lets play alittle gameof memory.
Key components for any email                  MOBILE       SUBJECT LINE | PRE-HEADER LINE                  BRAND          ...
SUBJECT LINEChoosing the Right Words:                                            71%A Guide to Optimizing                 ...
SUBJECT LINE                                  CURIOSITY          What’s red, blue and waiting for you?             Questio...
PRE-HEADER LINE
PRE-HEADER LINE                  Overall clicks can                  range in this area but                  could show a ...
PRE-HEADER LINE                                                      Compliment    If you are unable to see the message be...
CUSTOMER TARGETING
CUSTOMER TARGETING
CUSTOMER TARGETING                     80      %                     Increase in Mobile                     opens over the...
CALL-TO-ACTION
CALL-TO-ACTION                 Test                 Be Relevant                 Buttons over text                 High con...
CALL-TO-ACTION                 Test                 Be Relevant                 Buttons over text                 High con...
SOCIAL         1-2-3         Pinterest cannot be         ignored with over         100 million total visits         per mo...
SOCIAL         Be Relevant         Add messaging         Promote         Position can vary
80      %Increase in Mobileopens over the last6 months
Responsive Design   Mobile Friendly     RD                 MF                                      20      %              ...
RD
Uses CSS                Best used with aStacked content    RD   set template.Mostly HTML text        Try adding it to aLim...
Without Media Query   With Media Query / Fluid Layouts
Gmail with Media Query / Fluid Layouts
MF
1. Reduced width           3. Positioning2. Increase size of   MF      of CTA’s   copy and CTA’s
Old Template                            New Mobile Friendly               560-600 pixels wide               40 pixel radiu...
Design for mobileResponsive Design     Mobile Friendly• Plan ahead          • Reduced width• Use as a template     560-580...
How can westand apart andpull ahead?
Add somemovementAnthropologieAnimation / Pinterest
Add somemovementSony Entertainment NetworkAnimation / Reactivation
Add somemovementSony Entertainment NetworkAnimation / Reactivation
Add life toimages offDIRECTVMobile Friendly
Add life toimages offDIRECTVMobile Friendly
Add life toimages offFox / Family Guy OnlineImages Off
Add life toimages offFox / Family Guy OnlineImages Off
Add real-timecontent withliveTweetsDIRECTV
Thank YouDavid.Kepets@Experian.com
Design by Numbers: Taking your creative beyond the code
Design by Numbers: Taking your creative beyond the code
Design by Numbers: Taking your creative beyond the code
Upcoming SlideShare
Loading in...5
×

Design by Numbers: Taking your creative beyond the code

498

Published on

Learn how to utilize data to create smart, effective, and of course great
looking emails. We'll cover best practices for mobile, attention-grabbing
animations, how to optimize emails when images are turned off and much
more. Real-life industry examples and tactics will help you walk away with
a new creative outlook on email design

Published in: Business, Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
498
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
0
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Transcript of "Design by Numbers: Taking your creative beyond the code"

  1. 1. Design by Numbers David KepetsCreative Director, Strategic Services
  2. 2. On average47% of openersread or skimwithin 4-11seconds.
  3. 3. Perfecting theright formulaof contentand layout.
  4. 4. Lets play alittle gameof memory.
  5. 5. Lets play alittle gameof memory.
  6. 6. Key components for any email MOBILE SUBJECT LINE | PRE-HEADER LINE BRAND CUSTOMER TARGETING CLEAR MESSAGING & HIERARCHY CALL-TO-ACTION SOCIAL
  7. 7. SUBJECT LINEChoosing the Right Words: 71%A Guide to Optimizing of subject lines are Direct messages butEmail Subject Lines Fun and Curiosity have the highest unique open rates.CURIOSITY, FUN, DIRECT, RELATIONSHIPS
  8. 8. SUBJECT LINE CURIOSITY What’s red, blue and waiting for you? Questions, riddles and unfinished thoughts evoke a sense of mystery and question in the reader so they will want to read more. FUNTravel to Ireland and feel like you’re walking on Eire Humor, puns, plays on words, and provocative language are used to surprise subscribers and keep them wanting to keep reading. DIRECT Extra 40% Off Sale (Today Only!) Clear and to the point, direct messages use urgency, succinctness, promotions, and price incentives. RELATIONSHIPS Adele Fans! Get Her New Album Here Subject lines help readers identify with the products by their association with some group or special interest. These can include social media, special events, member newsletters, or group buying sites.
  9. 9. PRE-HEADER LINE
  10. 10. PRE-HEADER LINE Overall clicks can range in this area but could show a lift if positioned right!
  11. 11. PRE-HEADER LINE Compliment If you are unable to see the message below, Entice click here to view. Actionable Personalize Limit to 75 characters Your Daily New York City Groupon Go to Groupon.com | UnsubscribeBe sure to add mail@e.groupon.com to your address book or safe sender list so our email get to your inbox. Learn how
  12. 12. CUSTOMER TARGETING
  13. 13. CUSTOMER TARGETING
  14. 14. CUSTOMER TARGETING 80 % Increase in Mobile opens over the last 6 months
  15. 15. CALL-TO-ACTION
  16. 16. CALL-TO-ACTION Test Be Relevant Buttons over text High contrast Size & position
  17. 17. CALL-TO-ACTION Test Be Relevant Buttons over text High contrast Size & position
  18. 18. SOCIAL 1-2-3 Pinterest cannot be ignored with over 100 million total visits per month
  19. 19. SOCIAL Be Relevant Add messaging Promote Position can vary
  20. 20. 80 %Increase in Mobileopens over the last6 months
  21. 21. Responsive Design Mobile Friendly RD MF 20 % iPhone and Outlook are in a near-tie for overall email opens
  22. 22. RD
  23. 23. Uses CSS Best used with aStacked content RD set template.Mostly HTML text Try adding it to aLimited imagery triggered Mailing.
  24. 24. Without Media Query With Media Query / Fluid Layouts
  25. 25. Gmail with Media Query / Fluid Layouts
  26. 26. MF
  27. 27. 1. Reduced width 3. Positioning2. Increase size of MF of CTA’s copy and CTA’s
  28. 28. Old Template New Mobile Friendly 560-600 pixels wide 40 pixel radius around each CTA 14-16+ point size
  29. 29. Design for mobileResponsive Design Mobile Friendly• Plan ahead • Reduced width• Use as a template 560-580 pixels• Mostly HTML Text • Increase point size & CTA• Limited Imagery • Radius of 40 pixels for• Extensive QA each CTA• Not compatible • Full compatibility with gmail apps
  30. 30. How can westand apart andpull ahead?
  31. 31. Add somemovementAnthropologieAnimation / Pinterest
  32. 32. Add somemovementSony Entertainment NetworkAnimation / Reactivation
  33. 33. Add somemovementSony Entertainment NetworkAnimation / Reactivation
  34. 34. Add life toimages offDIRECTVMobile Friendly
  35. 35. Add life toimages offDIRECTVMobile Friendly
  36. 36. Add life toimages offFox / Family Guy OnlineImages Off
  37. 37. Add life toimages offFox / Family Guy OnlineImages Off
  38. 38. Add real-timecontent withliveTweetsDIRECTV
  39. 39. Thank YouDavid.Kepets@Experian.com

×