8 Ingredients for a Successful UX Strategy

ArticleJuly 13, 2017

Over the past several years, startups and Fortune 500s alike have invested more time and money into the growing fields of user experience (UX) and customer experience (CX). And it pays off.

Amazon’s Jeff Bezos invested 100 times more into customer experience than advertising in his first year, and Mike Gebbia of AirBnB has credited UX with his company’s $10 billion value. And it should come as no surprise that in May, Payscale named ‘UX Designer’ in their top 15 ‘Best Jobs in America’ report.

At Elevated Third, our UX strategy is designed to scale. What we do at the enterprise level will also work for nonprofits, or any project with a smaller budget. After years of refining our process, one thing remains constant. No matter the size, UX strategy plays a pivotal role in every digital experience we help our clients create.

Through trial and error, we’ve found that these 8 ingredients lead to a successful UX strategy.

Business Goals Icon

1. Understanding business goals and identifying KPIs.

UX Venn Diagram

There’s a well-known venn-diagram in our industry that shows three circles: Business Goals, User Goals and Technical Requirements. Where those three come together—that’s user experience.

Our process takes all these things into consideration as we approach a project. During discovery with our clients, we listen for business goals and user goals and find the harmony between the two. When these things don’t align, we push back. We write a short, clear Client Brief and Project Brief to capture what was agreed upon, and get sign-off on them to ensure all stakeholders are on the same page.

Building off of the business goals, we aim to define the right KPIs in the early stages of a project. These are crucial to nail down, as every decision we make later has to be validated against these success metrics. It’s how we judge our strategy, how we test with users and how we look at analytics post-launch to see if we did our job correctly.

Goals and KPIs created by Elevated Third for a marketing site.
Research Icon

2. Benchmarking & best practices

Our team is made up of many UX professionals, so we generally keep up on the latest trends and best practices in our industry. Even so, every project comes with its own set of requirements that allows us to dig into a specific niche.

For instance, we recently began working on a web app project where the UI combines a survey with real-time display of results. Our team spent time benchmarking similar tools in the client’s specific industry, but we also buffed up on general best practices for forms and surveys. Making even small updates to things like button language, field size or time to complete can make a world of difference in conversions. Taking time to research up front allows us to skip the “We think...” statements. We know the decisions we’ve made are ideal.

Users Icon

3. Getting to know the users

User personas are a big part of most UX strategies. Elevated Third’s process is no exception. However, we treat user personas a bit differently than some.

For every project we work on, we educate our client on what personas are, and sometimes more importantly, what they aren't. Our team doesn’t waste hours writing bespoke stories about each user while selecting the perfect headshot in iStock to match. Instead, we work quickly and efficiently to determine the key need of each persona and we validate it early with our client team. The important thing to capture is how each user’s needs and concerns will impact what they get out of the digital experience we are designing for them.

Considering user needs at the beginning of every engagement allows us to craft our strategy around our users, not the other way around. And once our personas are defined, they’re everywhere (literally). We pin them on walls, on our desks, and next to wireframe sketches on the whiteboard. Every strategic design decision is validated by the users. Personas are key to every decision throughout the process.

Some example user personas posted to our walls
Analytics Graph

4. Reviewing the analytics

At Elevated Third, we geek out over good data. Getting access to Google Analytics (GA) is a client requirement during discovery, and we really dig in. We’ve found it’s key to focus on the right data, not just general metrics like site visits or top trafficked pages. Usually, the most compelling metrics compare a number of data points: Finding out how new vs. returning users compare on the product landing page form gives us a lot more insight than just looking at general traffic to that same page. 

In addition to GA, we use a few other helpful tools for monitoring user behavior on an existing site. They even allow us to test ideas we’re planning to implement. Hotjar features heatmaps and clickmaps, recordings of users interacting with specific pages, and surveys and forms to engage with users on the site at integral moments. Tools like Optimizely allow us to A/B test language and content on an existing site to see what performs best.

A sample Hotjar heatmap of the Elevated Third homepage
This heatmap, recorded through Hotjar, captures user clicks and scrolling on the Elevated Third homepage.

When we combine data & analytics with best practice research, we can improve conversions in just about any scenario.

User Flow Icon

5. Understand all systems and integrations

One of the best parts of working exclusively with Drupal is that it pairs well with an incredible amount of third party tools and systems. Part of our UX strategy involves mapping out all of these tools, and determining what pieces play what roles in the technical architecture.

Different services and systems that Elevated Third can connect to Drupal.

We approach the system mapping in a visual way, as it really helps our clients and our internal teams understand the complexity of an engagement. These visuals aren’t necessarily beautifully-designed UX diagrams; we like to use tools like Google Slides or Draw.io diagrams, which are easy to share and even easier to edit.

Another important activity during this phase is technical sandboxing. Setting aside hours for this in discovery ensures a developer understands how each integration and API will connect to Drupal, and avoids the common pitfall of waiting until implementation to learn that a key third party system will now take twice as long to connect. It also helps the UX team know early if certain parts of the user flow may be dictated by a third party process.

An example user flow diagram
This is an example user flow diagram created for a client. It may not be pretty, but it does it's job!
Prioritize Icon

6. Define and prioritize features

At this point, we’ve started to determine what shape a project will take. It’s important to begin documenting each feature we’ve discussed with the client in one place, so designers, developers and clients understand what things are actually getting built. 

We create a “user stories” spreadsheet to get everything aligned in one place, and this document becomes canon in defining the hundreds of experiences that need to occur within the website or app. Each user story is written from the perspective of that user role, which usually sounds like “As a [Blank], I want to be able to [blank] so that I can [blank].” 

Example: “As a returning user on the website, I want to be able to log-in and see what’s new so that I can stay connected with my community.”

Example: “As a website administrator, I want to be able to see the number of times a user has filled out a contact form on my site, so that I can compare data over time and find ways to improve conversions.”

Once user stories and technical requirements are defined, we go through a thorough process of prioritizing each one—both internally and with our clients. We rank every story from 1 to 3, with 1s being essential, and 3s being “nice-to-haves.” This prioritization allows us to work closely with our clients to shift things as needed. If a “3” feature needs to be prioritized, we work to move or alter a “1” or “2” story down on the list of priorities so we can still build the project on budget and on time. 

Wireframe Icon

7. Sketch, wireframe, prototype

Throughout the entire UX process, our team is beginning to define the UX design through sketching and whiteboard sessions. Loose ideas become solidified through wireframing and we often create clickable prototypes to share the skeleton of a website with our internal and client teams. 

One crucial step in our process is getting members from all teams involved in the UX design. Our developers and designers will sketch and review a concept together in it’s infancy, which brings up any concerns or constraints before time is wasted on high-fidelity prototypes. By setting this expectation, all members of our team feel ownership of the concept.  If something fails, it’s on the entire group, and not just one designer. 

Test Icon

8. Proto-testing

When you combine prototyping and user testing, you get proto-testing. Buzzwords aside, usability testing might be the most important part of any UX strategy. 

Getting user feedback is critical to evaluating our UX strategy. The UX team is often too close to a concept after spending many weeks with it, so getting impartial, external feedback helps validate that our idea will work in the market. If five testers don’t understand how an application should work, neither will real users post-launch. 

An example of results from a user test.

We use various tools to test our prototypes. For smaller projects with a broad audience, we might simply send out a set of wireframes to friends and family and ask them to go through a series of tasks. For larger projects with more targeted goals, we use tools like Usertesting.com or TrymyUI to put our wireframes and prototypes to the test. With tools like Optimal Workshop, we perform card sorts to determine the best way to group topics or categories. We’ve often found Google Consumer Surveys are helpful for getting quick feedback on things like label names, icon design, or gut reactions to designs.

A test we created to look at user's preference of ads for a butter spread
We asked 150 participants which ad they preferred in a Google Survey to gather insight on a marketing campaign we did for a butter-like spread. The Winner? Product + Image (C)

Often the feedback we receive is unexpected or surprising. We’ve learned that when a client wants to save hours by not testing, that time usually gets spent later to fix a feature that doesn’t work as intended.

At Elevated Third, user testing has taught us to be flexible. We build things for users, not ourselves, so being able to adjust a concept in order to make it more usable is a requirement 

These 8 ingredients have helped Elevated Third develop a strong UX strategy for our clients and partners. If you have a project or website that needs a UX overhaul, we’d love to learn more.