- email design started: Hotmail 1996 (free, low requirements, anyone could get an address)
- email is permissive (people sign up and permit communication with them)
- email design is often compared to web design, but email has key differences
- short dev cycle
- not periodically delivered
- customers not asking a website to reach out to them
- supporting other marketing channels
- email is periodical: through multiple emails you’re developing a relationship with the customer
- each email is a small part of the larger
- very little oversight over email design
- “mad scientist” syndrome: trying out many different techniques, take chances
- story arcs are important
- if your story arcs are short, like a rising and falling action every episode, your viewers will become fatigued. longer story arcs are more fulfilling
- 4 key lessons
- aggressive learners win: making a point to absorb a huge amount of information and tying it together very well
- data inspires design creativity: how can we use analytics to improve our design exploration
- design drives business (which drives design): design of your emails leads to success or failures, which affects business. You can allow the business data to shape your design process and get better results.
- design is constraint: it's about being given a problem and needing to find a solution. wacky constraints cause us to take a different path than web development.
by Dan Oshinsky
- email articles had huge feedback - this is an area that could really be a capitalized upon
- buzzfeed: 80m+ unique, passed new york times last month
- 75% from social (incl. email)
- 50% from mobile
- 60% 18-34y
- don't bug or be irrelevant to your customers. be:
- personable
- shareable
- timely (right time of day)
- reliable (design, mobile)
- email is very personal - your chance to get an audience with important characters
- opportunity to create unique voices to stand out from the crowd
- email can be a place to delight people
- why to people share on social networks?
- causes a reaction
- reinforces identity
- makes sharer look smart or helpful
- Facebook: who I am, what I believe in
- Twitter: what's happening, what makes me look good
- Email: can include all of the above
- buzzfeed newsletter
- design and content that anyone can get into
- gifs: spike in clicks
- long-form newsletters with great content are undercapitalized
- DIY: vertical with identity-reinforcement
- royal baby emails: identity. 65% open, 22% click
- "Trust Bank": you have only so much equity with customers
- continuously delivering on promises builds trust quickly
- Brendan's trust map - bad:
- comcast
- Brendan's trust map - good:
- patagonia
- apple
- vooza: making fun of startup culture
- George Zimmer - "you're going to like the way you look - I guarantee it"
- great front-person
- building the best video template
- engaging images
- video production - avoid the fear
- wistia did video hosting, but never produced video for promoting themselves
- $100 diy lighting set up
by Elliot Ross and Justine Jordan
- people are taking emails out into the world more
- factors to deal with with mobile email:
- attention
- internet connection
- amount of email
- location
- device & app capabilities
- sunlight
- experience matters
- when an email design is not mobile optimized:
- 80% of people would delete it (15%+ over last year)
- 30% would unsubscribe
- 5 easy design wins
- concise content: less space so get the message across
- 1 column
- designed for touch: bigger buttons - min size 44px2 - and spaced out
- shorter subject lines and information at start (iphone cuts off at 35 char)
- more contrast
- additionally
- alt-text (styled if possible)
- pre-header text
- not just images
- 5 responsive techniques
- resize content: make images fit, text larger
- hide content
- stack columns
- 100% wide buttons
- stack navigation items
- media query compatibility
- -exchange
- -webmail on Android
- -Yahoo mail app
- -window phone 6/7/8?
- -bb os 5
- +ios
- +android native
- +wphone 7.5
- +bb 7, 10
- +palm web
- +kindle fire
- media queries - android observations
- images blocked
- two apps with opposing support for media queries
- primary content focus on left side
- various screen sizes
- sometimes autoscale
- media queries - bb
- media queries
- images blocked
- styled alt-text
- does not scale/auto-zoom
- no separate app
- media queries - wphone
- mixed mq support
- strange fonts
- blocks images, no alt-text
- not popular
- media queries - iPhone
- auto-scales
- very good css3 / mq support
- images on by default
- auto-resizes up fonts under 13px
- live image content: integration with a back-end to deliver customized images
- small user experience wins:
- tel: or sms: links
by Tim Watson
- even comedian do test runs of their content
- split customers 50/50, find out which performs better
- we have theories, but we should test to be sure
- test things that are going to allow you to reuse the knowledge
- hypotheses (customer stories): what is the customer thinking?
- ex. "header is too busy", "two calls to action are too confusing"
- open, click and convert rates
- design changes can more wildly influence convert and click rates
- careful consideration needs to be made to get a balance of the best results
- most tests won't win you anything
- incremental and compounding gains
- obama campaign:
- $500M from email, +$200M from email testing
- sometimes extreme simplicity wins
- "frankenstein" emails: emails created from winning parts of other emails
- validity of your tests (repeatability, reliability)
- test cell sizes - min 3k, better 5k - 10k, sometimes 25k+
- rarity of response
- conversion rate change is difficult to measure since it doesn't happen very often
- small changes -> small results
- big changes -> big results
- wait periods
- 10 days for $$
- 2 or 3 days for click results
- don't be afraid of doing large changes in your tests - easier to learn a lot more quickly
- failures of testing
- data skew can occur with insufficiently random data
- measurement failures
- customer centricity
- focusing on what's best for the customer, not just short-term gains
- most businesses sit in land of indifference - they don't really love or hate you
- holy grail is really authentic, genuine interactions with customers that customers love you for
- is: personal
- is: human point of contact with the company
- example: customer centricity
- RiteCheck - cheque cashing company building a great relationship with the customer
- Virgin America Airlines - customer missed his flight and they helped him still get to his destination. Richard Branson "If you win people over, profits will follow"
- creating trust and value
- flat design trend - trying to simplify the message and help the customer with reduced embellishment
- auto-unsubscribe - customer-centric measure to avoid spamming customers
- Google's tabbed inbox: making customers more receptive to the content that they want to receive
- no segmentation a problem
- customers want a single brain that has all of the history of the customer
- this doesn't happen very often
- more often: multiple representatives with no information sharing
- this will change in the next 5 years
- multi-channel aggregation - bringing the information in multiple online profiles together for targeting purposes
- trak.io - twitter, location data, in-app activity
- customer.io
- real-time targeting
- if customer reaches out on twitter and calls support, automatically send discount code
- MovableInk: real-time image targeting based on location
- Netflix: targeted recommendations of videos
- Recommendation engine: $500k to build in-house
- DirectedEdge, richrelevance: drop-in solutions to recommendation engine problem
- customer-centric email programs in the future
- -number of emails
- +wanted emails
- +personalized content
- yesterday: objective = consistency across platforms
- today: objective = optimization
- roi, making improvements on
- why?
- ubiquity
- design-led companies have broken email's old rules
- responsive email: mobile first is the new mantra
- brands recognize value in quality email design
- people consume their email at 9am at their desk with outlook.
- explosion of devices and situations
- tablet sales > laptop
- us biggest consumer of mobile email, uk just shortly behind
- +138% mobile opens in last 18 months
- can't ignore mobile any more
- not just about getting the best results in your favourite email client - it's about the best results across multiple devices
- knowing what features can be safely used across the email clients your audience use
- Ros is a mac fangirl
- panic - about pushing the envelope
- webfonts
- diamond resorts
- css animations
- static headers
- crocs mobile success: +7.7% clicks, +15.6% opens on iPhones
- make sure it's practical
- don't just procrastinate just by trying out things
- but also just muck around, you can learn a lot!
- campaign monitor, mailchimp have great starting template, good boilerplate
- limitations like smaller screen sizes and shifting consumption situations force us to be better email designers
- responsive represents a big opportunity - many emails don't take optimize and get dismissed
- 1/3 subscribers will unsubscribe if email is not mobile-optimized
- mobile first = results first
- simple email approaches tend to work pretty well everywhere
-
email used to be seen as a small value add - if it works, great, if not, no biggie
-
now it's becoming more imporant and central to business values
-
clients are embracing the shift
- would you recommend talking numbers and roi when trying to win over clients on responsive design or are there other approaches too?
-
email is the new social
-
56% companies plan on increasing investment in their email marketing channel
by Kristina Huffman and Schuyler Wareham
- it's called art work for a reason, not art fuckingaround
- benchmarks are bullshit - measure for yourself
- don't get stuck in the world where specific devices matter
- mobile triage is a myth
- peak times morning, evening for mobile
- less clicks on mobile
- more opens, less clicks
- factors: usability, trust, time
- mobile clicks won't ever catch up to desktop
- but multi-platform openers are high clickers
- 60% mobile only, 20% mobile+desktop, 20% desktop only
- click overlay heat maps are a great tool to see if there are big deficits in your design
- data-driven decisions vs expertise driven decisions (design whims)
- large dormant percentage of audience masks true impact of improvements
- purest way to test is with new subscribers
- "more white space" - every designer
- for better results: use data points like increasing readability to justify design decisions
by Matt Byrd
- best practices: training wheels
- weddingwire: online wedding planning resource for couples
- 1/3 mobile
- 76% of engaged couples using smart phone
- 65% mobile opens of email
- get rid of link clusters: reduce links and use buttons instead
- retina images
- test different from names, subject lines, pre-header text
by Brian Graves and Brent Walter
- Portland General Electric (PGE) - utility company
- provide power for 1.5 Million people
- newsletters for green energy options
- wide range of customers
by Brian Graves and Becs Rivett and Alex Ilhan
-
do you have all your content, assets, links?
-
will the content work?
-
check the design with the developer
-
create an adaptable design system that's reusable
- anticipate use cases
- content types in the email
- common elements
- content hierarchy
- design patterns instead of pages
- responsive email patterns
- create a style guide
-
q for brian: what is your full front-end build process? grunt?
-
set expectations for deadlines and signoff
-
take tips from the experts
- anna yeaman