UC Davis Recreation App Redesign

A vital technological tool for UC Davis students seeking campus involvement

🦾 Introduction

Project Details

Role

Product Design, User Research, Ideation/Synthesis

Timeline

2 day challenge - March 2023

Tools

Figma, Notion

Overview

Background

UC Davis Recreation App is the main app university students use to gain access to the ARC facility and help make reservations for all Campus Recreation programs. However, this app is too cluttered and makes it difficult for students to find relevant app features to use.

Problem Statement

Challenge

How might we redesign features of the UC Davis Campus Recreation app to increase user engagement and retention by providing a streamlined, intuitive user experience?

Solution

The redesigned UC Davis Rec App- an improved home screen personalized for each student’s involvements and an organized page to explore all of campus’ programs and facilities.

Interview Questions

Research Statistics

“The home screen is so crowded- I haven’t bothered looking at all the features it actually has.”
— Audrey T.

User Task

  • How often do you use the Rec app and what features of the app do you use the most?

  • What aspects of the app do you like/dislike?

  • What changes would you like to see in the app?

Key Quotes

  • 4 interviews & user tasks:

    • Interviewees: 4th and 5th year UCD students

    • Students use the app between 1-5 times per week

  • 9 App Store reviews

Users were given 2 tasks:

  1. Access the Member ID barcode

  2. Locate the ARC hours of operation on the current UCD Rec App

“I prefer to use my ID card to get into the ARC because the app takes too long to access the QR code!”
— Joan L.

🦾 User Research

Research Goals

The goal of my research was to identify the UC Davis Recreation app’s most used features, the key issues that app users face, and ways to improve the app. My target audience was all UC Davis students that utilize Davis’s recreational services. Due to the time constraint on this project, my research consisted of interviews, a user task, and a literature analysis of the app’s ratings/reviews listed on the Apple App Store.

“I typically go onto the UCD Rec website to get info about my intramural games because the app is too complicated”
— Michael T.

Findings

Based off of my interviews, observations from the user task, and findings from the app’s reviews, I listed out pain points among users. I performed affinity mapping  to organize these  pain points and synthesized 3 key insights.

  1. The homepage is overwhelming and difficult to locate relevant information.

  2. The Member ID Barcode is the most used feature of the app, but the act of logging in to use it is very inconvenient.

  3. Users want more accessible information on the programs they are involved in.

Updated Problem Definition: How might we redesign the Rec App’s Homepage to increase the app functions’ efficiency and accommodate for each UC Davis students’ specific needs?

🦾 Ideation

I focused on catering the app’s functions towards UC Davis students who utilize campus recreation resources/activities, including the ARC, IM sports, and recreation classes.

Time management is vital for these students given that they must balance their involvement with their academic load. These individuals depend on online resources to enable their involvement and maximize efficiency.

Current App Conditions:

  • The home page contains 20 icons that don’t clearly communicate the function they each serve. For instance, clicking the Hours icon also tells users the ARC contact information.

  • Many screens have lots of negative space, as seen in the Hours Tab.

  • Many tiles on the app, including the IM Sports tile, automatically connect users to the Campus Recreation website, rather than having a mobile app interface.

  • It requires 2 user actions to access the ARC’s hours of operation.

  • The app lacks a navigation bar, thus forcing the user to search through all of the tiles on the home screen

To address users’ frustrations with the cluttered design of the app, I decided to create a more personalized homepage with less overall icons and text. Sections are titled using “Your” and the home page only includes the programs the user is currently enrolled in.

During the initial user task, some students noted that they were unaware of the recreational programs listed on the app because they never fully explored the app. To promote greater student awareness and involvement on campus, I created a page dedicated to recreational programs and facilities.

I decided to design a navigation bar at the bottom of the screen to provide a roadmap of the app’s most important pages. This allows for easier exploration of the app’s features.

Home Page

Hours Tab

The app already contains a landing page with the app’s name. Thus, in my mid-fidelity screens, I removed the “UC Davis Campus Recreation” and the “Get Active. Stay Connected’ text at the top/bottom of each screen due to its redundancy and lack of functionality.

The text for the titles are larger in comparison to the current app. Thus, users can quickly locate specific categories, like ‘Member ID’ or ‘Your Teams.’

After reviewing my research insights, I narrowed down the focus of this app redesign to two main functions:

2. Programs & Facilities Page

This page allows users to search for specific activities, or easily browse through UC Davis’s programs and facilities.

Unlike the current app, facilities and programs are separated into categories.

The formatting resembles the home page’s sections, which increases consistency throughout the app.

Feedback

After completing my low-fi prototype, I received feedback on the Home Screen from 3 UC Davis students. Some key findings included:

  • They liked seeing ARC Hours at the top of the screen.

  • A profile photo of the user could be included

  • The app gives a more friendly vibe with the greeting at the top.

🦾 Solution

1. Home Page

The Home Page provides access to the user’s Member ID and relevant information for the programs they are involved in.

The user is greeted with their name at the top of the screen.

Important information like notifications and ARC hours are listed at the top of the page so users do not need to search the app to access them. By reducing the amount of icons on the screen, the new design reduces the cognitive load on users.

For example:

  1. Users depends on the Member ID in order to access the ARC when they forget their ID card. 

  2. Gym-goers like to quickly know information like the ARC hours of operation to educate their workout decisions. 

  3. Students who participate in Recreation programs currently must use the UC Davis Recreation website to access the program’s logistical information.

🦾 Key Revisions

🦾 UC Davis Rec App Redesign

Design System

In my final design, I maintained brand consistency by utilizing UC Davis’s official fonts and colors. The main background color is a lower opacity of Davis’s official navy blue color to break up the upper and lower sections and reduce the amount of negative space. The golden color is used as an accent color that indicates where users can interact with the app (arrows, notifications, information).

Home Page

  • Easily gain entry into the UC Davis ARC (gym) by viewing the QR code.

  • See notifications and the ARC hours of operation upon opening the application.

  • Access important information about the programs and sports you’re involved in.

  • Quickly find details about every program, including meeting location, time, roster, etc.

  • Find new programs/facilities to get involved with by scrolling through different categories.

  • Search for a specific program or facility using the search bar.

  • Register for different programs directly through the app.

  • Easily access each program’s website for more information.

Programs & Facilities Page

🦾 Reflection

Takeaways

  • Interface aesthetics play a huge role in increasing user retention-During my research with user tasks, many users were surprised by the other functions that the Recreation App provided. They all expressed disinterest in exploring the app due the home page’s cluttered layout.

Challenges

  • Given that this was my first app redesign, I found it more challenging to stay true to UC Davis Recreation’s mission while making stylistic changes to improve its usability. To understand the proper tone and mood for the app, I referred to the official website of UC Davis Recreation and researched their values and mission statement.

Next Steps

  • Conduct more rounds of user testing and surveys to further improve designs

  • Incorporate a Google Calendar function for users’ upcoming games/classes

  • Allow users to save their login information- this would reduce the time required to access one’s Member ID and promote more repetitive use of the app