DoubleVerify UX Strategy   •   UX Design   •   Visual Design

Project overview

Based in New York, DoubleVerify is the leading provider of digital advertising measurement software that authenticates advertising quality and effectiveness for large brands and media platforms.

When I joined the company as the Head of UX, their SaaS platform was in bad shape. The B2B platform was about seven years old and was made up of a hodge-podge of UIs, and several different-looking web-applications that were created at different times. As the company was maturing, it needed a unified UX design and a brand-consistent look and feel.

After much deliberation with the VP of Product it was decided that everything had to be rebuilt from the ground up. This called for crafting a comprehensive UX strategy, user research and testing, hiring a design team, creating a common component and design library, and a platform styleguide.

User scenarios and user stories

Personas

"Who are the customers of the platform and what are their needs?"—was the first question I asked, which led me to the creation of personas. Personas are a great tool for understanding a product's core users, their needs and what they are trying to achieve—they represent user types synthesized from user research.

I created two core types of personas: external users who are client managers and media planners, and internal account managers who manage campaigns for clients.

Customer personas

Defining User Flows

Redesigning applications for the platform, I went through the process of refining user flows that came from user research. To aid the process, I drew up quick representations of task flows screen-by-screen so we had a bird's-eye view of the user experience. This process allowed me to redefine functionalities, strip away anything that wasn't needed, specify new interaction requirements, and collaborate with engineering with the goal of optimizing the platform for the best UX.

User flows, user scenarios, and user stories

Building a Design System Library

Once redesigned interfaces and a new look-and-feel were gaining traction, it was imperative to establish a design library and a universal UI framework so all application UIs going forward would be consistent. The goal: to deliver seamless, high-quality user experiences in line with the company's brand, across all applications on the platform.

The concept of Atomic Design was widely employed to create a design system. Not only were typography and colors determined, but all frequently used UI components were put into a shared Sketch design library that the entire design team could use.

Design system and design library

UX Strategy – Executive Presentation

As part of guiding the new user experience on the platform I developed a comprehensive UX strategy in collaboration with the VP of Product, and created a roadmap for implementation for the coming year. Part of the presentation was not only laying out what we were doing and why, but it also projected an expected ROI. The UX redesign project was given the green light and the timeline, budget, and resources were allocated.

I made sure the executive team understood that we needed to provide more flexibility and efficiency of use. It’s not enough to design a nice-looking product; great usability is a significant contributor to product quality and a seamless experience. Better usability increases trust in the system, therefore the brand. It also reduces errors and costs (both for internal and external users).

UX strategy executive presentation and roadmap of the universal UI framework and design library

Brand Alignment and UI Unification

One of the first things that I wanted to tackle was the customer login screen. Everyone had to view it, yet it was just a white screen with a bland form. A wasted opportunity. It needed to be branded and stir excitement; it could also be used to announce new apps, features, and updates.

The page was redesigned in alignment with the brand, and a special area was designated next to the login area where periodic announcements could be displayed.

UX strategy executive presentation and roadmap of the universal UI framework and design library

Personalized Customer Dashboards

After logging in, customers were taken to an uninspiring homepage with a company logo and the customary platform navigation. One of the top priorities on my to-do list—together with developing a new navigation framework and the overall look-and-feel of the platform—was to design a customer dashboard that displayed the most useful, actionable data for customers, and was also completely customizable.

These mockups were presented to help executives see the time-saving features that would boost productivity and result in a significant ROI of the UX redesign.

Please note: These screens were high-fidelity mockup "design explorations" for discussions with product teams and company executives—not final designs.

UX strategy executive presentation and roadmap of the universal UI framework and design library
UX strategy executive presentation and roadmap of the universal UI framework and design library
UX strategy executive presentation and roadmap of the universal UI framework and design library
UX strategy executive presentation and roadmap of the universal UI framework and design library

Platform Unification – UI Designs

Over a dozen applications had to be redesigned for a consistent look-and-feel, to align with the brand and a new UI styleguide. Here's a sampling of final UI designs for various applications on the platform.

UX strategy executive presentation and roadmap of the universal UI framework and design library
UX strategy executive presentation and roadmap of the universal UI framework and design library
UX strategy executive presentation and roadmap of the universal UI framework and design library
UX strategy executive presentation and roadmap of the universal UI framework and design library
UX strategy executive presentation and roadmap of the universal UI framework and design library
UX strategy executive presentation and roadmap of the universal UI framework and design library
UX strategy executive presentation and roadmap of the universal UI framework and design library

Results

The result was an improved user experience on the platform, as well as positive feedback from customers and company stakeholders alike.

Due to fewer support calls, the company realized significant cost savings as a direct result of the UX redesign. We achieved increased customer loyalty and boosted the company's net promoter score (NPS).

We increased word-of-mouth referrals, realized significant productivity gains, and increased performance and efficiency—which translated into cost savings both externally and internally.

What I Learned and Key Takeaways

I learned how to communicate more effectively with the executive suite. Despite evidence that design investments enhance customer experience and address business problems, it is often challenging for executives to define the financial benefits using traditional ROI measures. As a UX designer and strategist, I best serve businesses to not only create great designs that “work,” but to also bring tangible business results and KPIs to the table. In other words, solidly demonstrate that there is true value to great UX design and that there is undeniably ROI in UX.

As I performed extensive user research and testing, wireframing, prototyping, and visual design on this project I learned a lot. Along with a requirement to think systematically and establish a standardized set of tools for the design team to use, the necessity to craft a component library, a platform styleguide, and design library made me a better designer.

More Projects