This process lasted a total of eight weeks: four weeks for discovery, three weeks for testing and one week for final product tweaks. 

I started by researching what competitors were doing. I noticed immediately that the trends favoured white space and large images and embraced the scroll. The main objective for the redesign was to make the newsletter responsive across any platform the reader would be using. With this objective in mind, I created an initial mockup that simplified the existing design and worked visually on desktop, mobile and tablet-sized screens. 

AZURE is an image-heavy brand featuring gorgeous pictures of architecture, interiors and design. It was important to the brand that the images were front and centre. By decluttering the newsletter, I allowed the images to breathe and tell their own stories. 

AZURE maintains a strict Style Guide when it comes to editorial, but graphically, there are opportunities to play. AZURE has a strong, clean aesthetic that is present across brand extensions including the magazine's online presence, the AZ Awards, and other assets. To remain consistent, I took some visual elements from the website: the striking red bar below the AZURE logo, the web safe typeface Helvetica and heavy black lines used as category dividers. By incorporating these details, and a decent amount of white space with large imagery, I was able to keep the newsletter visually consistent with our brand. 

Using data from our email service provider, our team was also able to take a look at what areas of the newsletter people clicked on the most. With that information, I was able to discern that certain areas weren’t being activated at all, which helped identify small details that could be eliminated, like cluttered links underneath the logo. This opened up some white space within the newsletter to play with.

The testing process was a few weeks long and incorporated different groups of people. The first meeting gathered a member of each team: editorial, marketing, web and art. We shared ideas and focussed on the details we liked about other newsletters. Once the first mockups were created, this team met again to critique the roughs and select two to move forward. Next we created mockups that we could play with on different platforms and selected the final layout. Finally, more testing was done to ensure that the design was responsive on each platform, and we were able to dispatch the new design.

The old newsletter was able to accommodate three ad positions for the sales team to offer to advertisers. With the new structure and template, we were unable to use the same sizes. To fix this problem, I built in two solutions.

First, I set aside a place for a standard leaderboard size that would run underneath the header, as well as another spot at the bottom of the newsletter. However, when adapted for mobile view, the leaderboard became unreadable. To counteract this, I designed the leaderboard so that in the mobile view, it is replaced with a boxed version of the same ad. This solution required advertisers to give us two sizes of the same ad. This solution came with its own challenges. In some cases, advertisers are unable to provide both sizes, either due to timing or a lack of resources. To account for these cases, I built in a custom size “big banner” that can be viewed on both desktop and mobile. Our sales team can present both options to advertisers to give them the chance to choose what works best for them.

Another design challenge was flexibility. The editorial team needed an option for featuring less visually impactful posts. To address this, I designed two templates: one that displayed all of the articles full-width with large header images and another that displayed a quadrant of smaller blog posts at the bottom of the newsletter. This allows the editorial team to choose the layout that best suits the stories they are promoting.

Results

Since launching our new newsletters, we have seen an increased rate of readers on mobile devices. The increased readability allows users to view newsletters without having to zoom in or increase the type size, and the newsletter now better represents AZURE's clean branding. Click rates have also increased from an average of 3-4% to 5-6%, which ultimately has a positive impact on website traffic.

Designer Takeaways

1. Always listen to the needs of the client.
2. Do your research and figure out what works and doesn’t work for your client/brand.
3. Test, test, test. Try and see what works and be open to making changes.

Client Takeaways

1. Be open to new ideas and new ways of thinking.
2. Be clear about end goals.
3. Keep in mind that the end result should be open to change based on test results.