Logo: LH

UM Athletics Tickets

WHEN
Sept 2022 - Apr 2023
TEAM
Kevin Choi, Adrian Berrigan, Elizabeth Yang
ROLE
UX Researcher and Designer
TOOLS
Figma, Miro, Qualtrics
A redesign of the University of Michigan Athletic Department ticket purchasing website, focusing on simplifying navigation, reducing information overload, and enhancing ticket purchasing experience.
Skip to Solution
See More Line
Background
Redesigning the athletic event tickets purchasing process. 
The University of Michigan Athletic Department oversees 29 varsity sports and generates over $50 million annually from 13 ticketed sports. Their website, MGoBlue.com, is critical for fan engagement and ticket sales.

By collaborating with the University of Michigan Athletic Department, our redesign aims to reduce information overload and simplify navigation, streamlining the  ticket purchasing process and supporting the department's mission to connect fans with their favorite sports events efficiently.
Process
Research
Competitive analysis: analyzing existing solutions.
We conducted a competitive analysis of direct, indirect and analogous competitors. This process identified current solutions and revealed design opportunities for six key features: navigation, featured elements, user journey, information architecture, filters, and mobile experiences.
Survey: gathering insights from real customers.
We distributed a survey via the athletic department's email list, gathering insights from 1,200 customers on their ticket purchasing behaviors, preferences, and pain points with the current experience.
Interviews: learning the details of user's behavior and preferences.
We conducted contextual inquiries with 7 participants, selected from survey respondents. The 30-minute interviews provided insights into users' navigation patterns, preferred features, expectations, behaviors, and pain points while using MGoBlue.com to purchase tickets.
Key research insights:

01

Complicated navigation
Users struggle with finding the right page for purchasing tickets due to confusing information architecture, unclear labels, and overwhelming navigational menus. 

03

Poor seat selection and filtering options
Users desired enhanced seating maps, more comprehensive filtering options (like those on StubHub), and better information on seat availability and premium options.

02

Information overload and content relevance
Users were frustrated by the cluttered pages with repeated and unnecessary information, slowing down the ticket-purchasing process. 

04

Missing key ticketing features
Users noted the absence of features common on competitor sites, including event-saving options, advanced sorting capabilities, and easily accessible promotions.
Defining the Problem
The tickets pages are very content heavy and contain unorganized and often repeated information, leading to a complicated and inefficient ticket-purchasing process for users.
Ideation
Personas: converting insights from themes into personas.
We formed our research insights into four key themes, resulting in the creation of four distinct personas. These personas summarize the motivations, frustrations, goals, and technological ability of our target users related to fashion consumption.
Click to enlarge
User Flows
Mapping the user journey.
Expanding on our ideation phase, we collaborated on creating a comprehensive user flow diagram to visualize the optimal user experience and identify key features and actions needed to effectively solve the defined problem.
Click to enlarge
Wireframes
Translating sketches and user flow ideas into wireframes. 
After identifying key components through refinement of the user flow, we developed a set of mid-fidelity wireframes. This process focused on optimizing usability and content organization, laying the groundwork for the visual design phase.
Click to enlarge
Creating the design system.
Before creating high-fidelity prototypes, we developed a design library consisting of components, typography, layout spacing, icons, and color schemes. This allowed us to maintain consistency with the current website and brand identity and across the user flows.
User Testing
Iterative refinement through prototyping and A/B testing.
To validate our design decisions, we created a high-fidelity prototype and conducted A/B testing on 7 users. We compared two versions of our MGoBlue.com designs, with minor differences in information location, filters strategy, and iconography.
Key research insights:
38% faster to find tickets in Version B with an overall 100% task completion rate
66% of Version A interviewees disliked the event schedule match up hierarchy
100% of users preferred the ticket hover dropdown in Version B
FINAL DESIGN
From user pain points to a final high-fidelity solution.
The A/B testing provided insights on user preferences, helping us make design decisions that heavily favored version B. Key improvements include:
Simplified navigation
Users struggled with cluttered navigation, often missing the tickets section and getting lost in overwhelming dropdown menus. To reduce information overload and provided clearer pathways to ticket purchasing, we prioritized tickets in the main navigation, streamlined dropdown menus into two columns with quick-link buttons, and created a separate navigation for login, ticket schedule, and search.
Before
After
Reorganized sport-specific pages
Users found the sport-specific pages overwhelming, with disorganized and repeated information. To streamline the pages and highlight key details, we implemented a card-based layout for ticket options and removed redundant elements.
Before
After
Enhanced filtering
Limited filtering options made it difficult for users to find specific events or tickets. To ease the process of finding and comparing events, we installed clear filtering options for sports, location, and time.
Before
After
Final Design Prototype
View Prototype
Reflection
Final thoughts
Partnering directly with Michigan Athletics on this redesign was key. Their deep understanding of their customer base and platform details helped us create a solution tailored to their needs. 

While maintaining the strong Michigan Athletics brand identity was crucial, my biggest takeaway was learning how subtle tweaks to information hierarchy – like repositioning the ticket schedule quick link – could significantly improve the user experience.
Next steps

Prioritize information architecture changes

The next critical step for Michigan Athletics is refining the navigation. Our research shows that simplifying the site structure, particularly by eliminating redundant links and optimizing quick link hierarchy, will dramatically improve the ticket purchasing journey and reduce cognitive load.

Use delivered prototype as guidance

The delivered prototype should serve as the strategic foundation rather than a rigid template. While developers don’t have to adhere to the design 1:1, we recommend maintaining the core information architecture and layout principles, as these elements were extensively tested and proven to enhance user experience.

Send me a message 
and let's connect!

© 2024 Logan Hanekamp. All Rights Reserved.
crossmenuchevron-downarrow-uparrow-leftarrow-right