Where the brand was

The company had carefully fostered values it lived by: growth, loyalty, innovation, resourcefulness, fun, and transparency. The brand embodiment, focused on fun and innovation... However, over time it had skewed towards fun and left innovation behind. Our vibrating color schemes and gradients didn’t make it so clear to potential customers that we could be trusted to perform. Through two separate campaigns AdRoll sought not to redefine themselves, but to rebalance their identity. 

Campaign 1 - Customer Stories

Our clients were our biggest champions and vice versa, they were the undeniable proof of our capabilities. Each customer had an unique business journey that often went unheard, but was not uncommon among businesses. AdRoll sought to share these customer stories as social proof and present them as case studies on how to adapt business strategy. These stories allowed potential customers to see how AdRoll could help their business in ways they hadn’t even imagined. AdRoll didn’t need to convince them of anything, they could just listen to their peers and decide for themselves.  

Of all the campaigns AdRoll had launched, this was the best performing. 

Campaign 2 - Brand Relaunch 

AdRoll has existed for over 10 years, within the industry there is a lot of brand recognition. Regardless of how many brand iterations take place, the identity still needs to be consistent with what has historically existed because of that brand recognition. Before pursuing a brand update the limits were known and established. The goal was very much to refresh the brand, not completely change it. 

One of the design challenges with SaaS products is that by their very nature they aren’t seen as humanistic. Since the target audience was marketing teams, generally people outside of technical fields, we really wanted to convey this was a product relative and accessible to them. We knew that the aesthetic should be friendly and fun, a product marketers are comfortable engaging with. 

Given that there were restrictions on what we could change, we focused on the what and how we could change elements to fit our desired identity. Color, graphics, and illustrations would have to be a representation of that friendly and fun aesthetic we felt would speak most to our audience. 

Previously all colors had been so bright they bordered on abrasive, when everything is bright nothing is. Now we sought to create balance and draw attention by creating softer compliments. We started with our original palette and removed colors that were less flexible while adjusting the colors we had chosen to keep. The overall idea was to allow for a wide enough color range to create interesting graphics and illustrations, but still being able to integrate the blues from the original identity. Once the palette had enough buy in we began exploring how it would be manifested through illustrations, graphics, and web components

In selecting an illustration style we wanted it to work very much like the web design, compositions that could be broken up and re-assembled while still preserving visual integrity. Another important feature was making sure that the illustrations embodied a humanist aesthetic: textures, patterns, strokes, organic shapes. Fluidity was important. We found an illustrator whose personal style worked best with our vision and asked them to create illustrations around our most central ideas. What that meant was giving concepts like “machine with dashboard and dials connected to a webpage” and iterating with her as she developed the illustration. Again, the idea being that we would want the ability to break apart and build up illustrations around universal styles and themes. As we built the website out more we now had the ability to composite as many illustrations as we wanted because we had the core elements of our illustrations created. At this point I could easily create different concepts based on her components.  

By the time the illustrator was involved there was already a solid website structure. There was an idea of how and why visitors should navigate the site. Now moving on from the Design Component, I’ll take a dive into the UX of the site.

Campaign 3 - UX Optimizations

There was a product narrative established by leadership to convey the selling features of the platform. What that meant was that they knew what they wanted to say and we needed to figure out how to say it. 

The information most relative to marketers is more along the lines of: 

• What does AdRoll do?
• Why does that matter? 
• What are the use cases? 
• How does it do it? 
• How much does it cost? 

In order to convince potential customers the website needed to touch on all these questions in a comprehensive manner. The navigational structure very much reflects this pattern of thinking. Through each subsequent link a customer can answer these questions, each page intended to be a deep informational dive into that part of what the product is. 

The more information available the more content there is to manage and design. The website itself is very large and it was important to make sure the UI was scalable regardless of amount of content. From the beginning wireframes were created that would allow for variations in content structure, each page would be capable of having interchangeable components while still preserving visual quality. Overall the ideology was that the website should be modular in every way. Still, there were instances that we knew this approach wouldn’t work and approached those pages in the most suitable way for that content. 

Historically the pricing model was built around what customer’s actually achieved. In essence if they didn't get clicks or make money, we didn’t profit. This isn’t a traditional pricing model that can be generalized for each unique customer. In order to get an accurate representation of what a plan would cost they needed to contact the sales team. 

This was a huge problem since it was asking for a greater level of commitment from those who were just looking for information. The iteration I worked on was one prior to the one live on the website. We still had a table outlining the features available, but instead of having prices at the top they were asked to contact sales. We sought to make that contact process more accessible and prevent sign up drop off. 

The way we solved this was by moving some of the contact form fields directly to the pricing page. Just by asking for their email address we were able to pre-fill two form fields from the sign up flow on the following pages, aside from their name and password this was all they needed to create an account. Presenting pre-filled forms alone created a 4% increase in sign ups through the pricing page. Eventually this method was tested throughout the site and applied in a handful of other locations. 

The way we solved this was by moving some of the contact form fields directly to the pricing page. Just by asking for their email address we were able to pre-fill two form fields from the sign up flow on the following pages, aside from their name and password this was all they needed to create an account. Presenting pre-filled forms alone created a 4% increase in sign ups through the pricing page. Eventually this method was tested throughout the site and applied in a handful of other locations. 

-------

In summary, the AdRoll website redesign project seamlessly blended design and user experience considerations. From revitalizing the brand identity with a friendly aesthetic to addressing UX challenges like navigational and pricing issues, the project showcased a strategic and thoughtful approach. The modular design principles ensured scalability, while streamlining the pricing process significantly increased sign-ups. Overall, the project successfully transformed the website into a visually cohesive and user-friendly platform, aligning with AdRoll's goals and enhancing the overall user experience. I’m happy to say that the latest iteration of the AdRoll brand has been in place for 3+ years.