Bath & Body Works hero

An Email Worth Scrolling For

From: Bath & Body Works
Date: 2/01/20
Subject Line: 💘 your Valentine’s Day gift guide 💘
View it in a browser

Bath & Body Works Email

Every now and then I get an email that makes me jealous, as a designer. Today was one of those days.

According to a study done in 2019, the majority of emails are opened on a mobile device (roughly 42% mobile, 40% webmail clients and 18% desktop). Viewing on a smaller screen forces you to scroll more than on a desktop. Therefore, it’s important to create designs that entice you to reach the bottom.

Bath & Body Works Phone Scroll

When you look at this email as a single image, it really isn’t as impressive as seeing it scrolling. Bath & Body Works was able to create one long vertical image that SEAMLESSLY incorporates multiple products — while also creating flow, balance, and dimension. I find myself dissecting the image, looking for any seam or a misplaced shadow, but I can’t find one. It’s amazing work. They also add interest by including an animated gif in the header (the candle flickers).

Bath & Body Works animation

The only missed opportunity is the lack of call-to-actions. Bath & Body Works does include a link at the top and bottom of the “scroll area” to SHOP GIFTS. (I appreciate the CTA at the bottom, BTW!) However, the products within the scroll are missing these. The long image is broken into multiple pieces to allow for multiple links (room fragrances and 2 new scents), but all sections link to the same landing page (Gifts for Her).

This design, graphically, is nothing short of inspiring!

Read More

Target

Right On, Target

I’ve noticed two things that Target is doing nicely. First, they have been selecting products that coordinate in color for their sections. For example, in this email all the decor is teal, the electronics are silver, etc. Doing this makes the groupings aesthetically pleasing, feel as if they belong together, and helps to define the sections. Even the products in the recovery module are coordinated in Target’s signature red.

Second, is their use of responsive coding, which best optimizes rendering for desktop vs. mobile. On a computer the email is significantly wider, with the hero image to the left and it’s related links to the right. Whereas on a mobile device the sections stack vertically. This makes the text and images larger on a small screen, therefore, easier to read and click.

From: Target
Date: 8/22/15
Subject Line: Psst! Save 30% on kids’ clothing. Ends today.

On a computer:
Target Computer

On a mobile device:
Target Mobile

Read More