Created: 2017
Project: Email layout design
Goal: Transform the outdated What's Trending email layout and template to a modern card system in order to boost conversion and improve the speed of the weekly production of graphics. The What's Trending email is sent out to customers once a week and highlights the most popular events that are on sale. One of my weekly work tasks was to place the artwork for each relevant event into a template, edit the text, and export them at the sizes that were needed for this email. This redesign project was intended to make this process more efficient and save time.
My Role: Design a new What's Trending email layout that works for desktop and mobile platforms, while making the individual graphics easier to assemble in the template.
Rethinking the Grid
The original What's Trending email layout (above) had a grid structure that restricted the images, content, and CTA buttons to small square boxes. This layout couldn’t accommodate longer sentences of text, so this system really limited the content that could be displayed. The event titles were also part of the static images, which isn't a best practice for web typography. I was challenged with finding a better solution for these issues with my new design.
The Wireframes
First I sketched out a few different email card layouts on paper and when I settled on the best one, I turned it into a digital wireframe. I experimented with the best font sizes, image placement, card padding and visual hierarchy.
The Final Mockups
Finally, I added the TicketNetwork branded colors and imagery to my digital wireframes, giving it a light, clean and vibrant appearance. The top feature card is meant to highlight the most popular event of the week. In order to make it stand out from the rest of the cards on both desktop and mobile platforms, I added a purple background behind it and increased the card size when viewed on desktop.
My new layout streamlines the workflow of developing the Weekly What’s Trending email. Each week, my team and I would have to add text onto the performer graphics that were going to be included in the email that week, export them, and hand them off to the developers. My new layout eliminates this process completely because text is no longer part of the static images. Since my new design is more flexible and spacious than the original, I set it up so that the developers could just add the event names and body content next to each image. Eliminating this extra step saves valuable time and makes the whole process more efficient.