The Problem:

Velocity’s old site had grown organically from a site showcasing a training center, to encompass featured artists, dynamic classes, and engaging performances. Our team needed to make sure that the new Velocity site captured everything they did clearly and succinctly.

The Solution:

A new website that features all of the projects that happen at Velocity Dance Center;

A clearer understanding of user goals and motivations;

Alignment within the Velocity team around organizational communications, goals, and expectations from the website.

Tasks:

1. Usability audit using heuristics
2. Information architecture assessment
3. Internal Stakeholder Interviews
4. User Interviews
5. Creation of new information architecture
6. Initial Prototyping new site
7. Usability Testing
8. Visual Design Iteration
9. Launch!

Results:

• Launching of new site in October 2019<
• New Google Analytics software to track metrics
• Decrease in calls for easily findable information
• Alignment internally around website communications

Usability audit using heuristics:

When Velocity first approached Story2 and Photon, they were eager to redesign their entire site. Feeling that their old site was outdated, they heavily focused on the visual style and design.

I wanted to take a deeper look at the site, first starting with a heuristic anaylsis of the current site. There were several things about Velocity’s site that could frustrate a user including lack of status update about the site’s functionality, confusing user flows that would not meet user’s expectations, and internal inconsistencies within the site.

Understanding the Analytics:

Looking at the analytics showed the most visited pages on the website. I was also able to see the flows, and drop offs, for each part of the site. Using this, we were able to identify where most users went within the site. Understanding analytics, we saw that most of the users, when looking for classes, were looking a the “New to Dance” call out that existed on the old page.

Analytics also told us that most people coming to the site were new instances, not repeat people. Understanding that the audience coming to Velocity’s website for the first time was huge. Prioritizing clear, understandable content and navigation this site was crucial for a great user experience.

Assessing Information architecture:

After taking a look at the heuristics of the site. I assessed the information architecture by combing through the pages. I took note of top level pages, secondary pages, and even tirary pages. By doing this sweep, I was able to spot inconsistencies in flow, and discover outdated areas of the site. Velocity was really surprised that some of the information was still on the site.

Internal Stakeholder Interviews:

I conducted internal stakeholder interviews with Velocity staff to understand how each department would need the site to serve it. Throughout these interviews, most of what came up was a feeling of embarrassment about their current site’s visuals. Steering the conversation, I asked what would staff like to see that the website do, and how the website works.

One key insight came from the Operations Manager who intercepted calls from people who could not find the information they searched for on the site. The Operations Manager spent a good deal of her time focusing on answering customer questions, instead of focusing on other parts of Operations. Hearing similar sentiments from other staff members, reducing calls became a Key Performance Indicator for this build.

User Interviews:

While clarifying organizational goals clarified for Velocity, understanding user’s motivations and tasks became important to me. At the beginning of the project, I designed a Top Task Survey that was placed on the site. Using this survey, also allowed me to identify users that were part of several major audiences on the site. This survey also asked if a user would be willing to be interviewed about their process coming to Velocity.

Interviewing about 10 people, I was able to distill three distinct personas of people trying to engage with Velocity, their motivations, and tasks to be done. With this in hand, I began to craft a new site structure for Velocity.

Creation of new information architecture:

After understanding the top tasks of the users, and the organizational needs of each department, I set out to create a sitemap that fit the users needs.

The first sitemap was used as a conversation tool within Velocity to think about balancing the needs of its users with their organizational goals.

To help prioritize, we held a workshop I facilitated cross-department conversations. Since Velocity staff is small, many fo the staffers focused on their work, and the priorities of their departmental needs, instead of looking at the website holistically. Facilitating this workshop helped bring alignment to both staff and the web team. After seeing how the staff prioritized different pages and features, I went back and iterated on the sitemap.

The second sitemap was approved by Velocity, and we began moving into prototyping.

Prototyping new site:

Since our team was distributed, we used Adobe XD to prototype the site out. From analytics, my team knew that most users either used the site on mobile, or a desktop, so I prioritized those two devices for testing. Collaborating the visual designer, we laid out the wireframe for the site on both desktop and mobile.

It was here that the visual designer, the developer, and I laid out which interactions would work well for the site. Over several iterations, we determined the look and feel of the site to test with users.

Usability Testing:

Once we had a wireframed prototype, I set out to test it with users. Over the next few weeks, I conducted moderated user tests with the prototype, testing top task flows for ease of use, and task completion.

Since the analytics showed that most of the sites visitors were new, we set out to do some guerilla testing as well. Understanding where new users would get caught up in flows were important.

Visual Design Iteration:

Over the next few months, visual design iterated over the look and feel of the site. Working with a copy editor, the team made sure that both visuals and copy aligned to provide users clear, informative design as we polished the site.

Occasionally, I would consult on copy placement and phrasing to help with clarity, particularly with UX.

Launch!

In September 2019, we launched the new Velocity website with stunning visuals, clear copy, and new user flows. During this month, the Velocity Communications team monitored analytics and call volume from customers.

About halfway through the month we got an update from the Velocity team. Calls had been reduced and the analytics were looking good.