LA County Fair Ticket Flow Redesign

Project Overview

The LA County Fair has been a So-Cal tradition since 1922, that offers a wide variety of food and entertainment options for the whole family. The website attempts to encompass every feature of the fair and the result is a cumbersome navigation structure.

The ticket purchase flow is particularly frustrating and confusing. The goals of this project were to draft a new navigation schema for the whole site, to identify key pain points and issues in purchase flow, and to find solutions that allow the user to complete the process as excited to go to the fair as they were when they began.

Role: UX Researcher & Designer

Project Type: Spec

Software: Lucid Charts, Excel, Sketch, Survey Monkey

Duration: 3 week sprint

Research

Screen Shot 2018-10-29 at 6.59.15 PM.png

Heuristics

A Heuristic review helped me to identify issues and rate their severity on a scale of 1 to 5. The most severe violations centered around the navigation and UI.

Competitive Analysis

An analysis of similar event sites revealed features that could address the heuristic violations, such as:

The ability to adjust their ticket quantity, and even select different ticket types, on the same screen.
Less steps overall from ticket selection to payment completion.

Why buy online?

My user interviews and surveys revealed important insights into people’s motivations for purchasing tickets online.

Click here to see my survey results

Exploring the Site

Drafting a sitemap gave me a high-level view of the information architecture. The website, like LA and the fair itself, was a sprawl. The titles in the nav bar are really only titles of dropdown menus, so everything below the yellow boxes is accessible from every page. It’s all breadth.

There was a lot of redundancy, and I discovered ticket purchase options buried throughout the site with no clear indication in their headings of what they were, making them very difficult to find.

Card Sort

I used open card sorts to uncover how I might re-structure, and scale down the navigation.

Insights:

Users were confused by the vague primary and secondary navigation titles
They added new layers of navigation, as well as more specific primary nav headings.

I implemented the new categories in a closed card sort. This is when I was really able to see my way to taming the site’s overwhelming content. The categories were validated and I was able to add more structure and depth.

Proposed Navigation Schema

The new navigation schema has a streamlined primary navigation, additional local and tertiary levels, and no redundancies. I grouped all of the ticket options together under the same global nav heading, with secondary levels for the different types.

It’s still a lot of information, but it’s now structured in a way that will make sense to the user.

Synthesis

Meet Ben

The LA County Fair is family-oriented event, so I created a parent persona to represent the average fair-goer. Like many parents, Ben loves to take his kids on adventures, but doesn't have a lot of time to plan, so he looks for easy, local alternatives.

User Tests of the Current Site

To get insight into a user’s experience with the flow, I gave my test subjects a task based on my persona, and asked them to talk me through the the ticket selection and purchase process.

Ben’s Journey

His journey through the ticket purchase flow is based on what I’d learned from my interviews and tests.

User Flow

I created a user map of the current flow and highlighted the pain points along the process, particularly during the selection phase.

Then I sketched a new flow, with a more straightforward selection and checkout process.

Insights

People like to purchase online tickets to events:

To save on effort and time

So they can plan ahead and be assured that they’ll be able to get in

Problem Statement

Ben’s time is limited, and he wants to organize his family’s trip to the county fair so they can make the most of their time together.

How might we make the LA County Fair online ticket purchase flow more intuitive and linear?

Design

Low-Fidelity Wireframes

My goal was to strip out all but the bare essentials necessary to purchase a ticket, so Ben would have a clear and easily navigable path completing the process.

Testing My Design

I did a series of usability tests on my medium-fidelity paper prototype versions of that flow and users were able to navigate it well.

Click here to see medium-fidelity wireframes.

Prototype

Iteration

While working on a high-fidelity mockup of my prototype I discovered that while the flow was functional, the screens were too busy. In my quest to simplify the process, I’d fixated on fewer screens, rather than an improved UI, as a solution.

I designed a tab bar to split up the ticket options over a couple of screens while maintaining the ability to navigate back and forth with ease.

Clickable Prototype

Click anywhere on the screen to see a video of my prototype in action.

The 2018 LA County Fair season is over and most of the site’s contents has been taken down, which represents an excellent opportunity to re-work its information architecture. In order to build a more navigable 2019 site, I recommend a full content audit of this year’s site, as well as a more thorough site map, to clarify issues and learn from them.

Additionally, a redesign of the mobile site, which is plagued with many of the same navigation and UI issues, is another important step towards improving the fair’s online e-commerce experience.