Project overviewProduct ShowcaseUser researchSynthesisDefineIdeateWireframesFINALDESIGN SYSTEMreflection

Golf Guru

An app boosting mental strength through audio training

Product Design
Jun 2022
Start-Up

OVERVIEW

I was the UX/UI Designer for Golf Guru, a Golf App to boost mental strengthening and performance for Golf Guru.

I designed audio features to curate experiences that facilitate growth for golf players. I also designed a Rewards feature to generate monetary value for the app, and worked alongside with the stakeholder
Jump to Solution >

FEATURES

I redesigned audio features that help users find specific recordings to strengthen their skills.
I designed a personalized feedback feature where users can reflect on their improvements after listening to a recording.
I designed a rewards system to incentivize user experience while boosting revenue for the start-up.

PROCESS

I followed through the human centered approach to establish empathy with users.

This project started off with doing initial research, and conducted many A/B tests for our client to assure on certain design choices.

This process is not linear, and we revisited a lot of steps in our process to ensure the authenticity of the users

RESEARCH

Competitive Analysis

Since I was unfamiliar with the the golf scene, I started with conducting competitive analysis to analyze concurrent apps that serve similar goals.

We found 5 different apps that served similar goals as Golf Guru, but they all different strengths and weaknesses
View Full Analysis >

Onboarding

Usually shows tutorial and personalizes audios based on pre-screening questions

Audio Features

Arranged in Modules and Easy Filters for different skill sets

Strengths

Emphasis on trust, progress bars and reviews for accountability

Weaknesses

Lack of directions, user experience, and personalization
I narrowed down important key insights that could help guide our team to reach the user centered goals of personalization, intuitiveness, and accountability

SYNTHESIS

There were so many questions at the start. My team and I, including developers and project manager, all wrote down HMW Questions to ensure that feasibility, concerns, and insights should be addressed in the design process.
How Might We ...
View Full Analysis >

HMW

Make the Audio Feature Engaging?

HMW

Encourage Good Mental through Confirmation

HMW

Personalize Experiences to new & old users?

HMW

Highlight Audio Feature as being a focal point?

HMW

Reassure that this app is actually useful?

HMW

Recover from mistakes in different trials?
From the massive collaboration with my team, I collected and categorized HMW Questions to narrow down specific focus goals for redesigning the Audio Feature.

DEFINE

After gathering research about existing apps, I defined a problem statement to frame our focus for the rest of the process

"How do we reimagine Golf Guru's audio feature to provide an intuitive and motivational/personalized user experience, while also strengthening the user's mental game and sense of improvement ?"

IDEATE

Sketches

After defining the problem, I sketched out possible solutions for the audio page, onboarding process, and the rewards page.

Audio Feature

I contributed to reimagining the layout of the Audio page, as it was very unfinished and clunky. My client loved the idea of personalizing the audio pages to target specific strengths and weaknesses.

Onboarding Process

We also created preliminary sketches for the onboarding process, focusing on personalization on their routinely goals.

Rewards Page

I reimagined a rewards page with ways to claim gifts based on share referrals from users.

In order to gain profit, there was a membership based feature where my client wanted to include a rewards page to incentivize players, while promoting the app's growth.

WIREFRAMES

Mid-Fidelity

Due to time constraints, I needed to give the developers an initial structure to bring static designs into a functioning prototype fairly quickly.

Audio Feature

Onboarding

Personalization

A/B Test

We wanted to conduct A/B tests to test our preliminary high fidelity designs, and tested on design systems, layouts, and usability

Total Respondents: 58
Light: 21

Light Mode vs Dark Mode

Dark: 37
Original: 28

Original Layout vs Revised Layout

Revised: 30
Full: 14

Full Transparency vs Partial Transparency

Revised: 44

High-Fidelity Wireframes

I created flow charts using our wireframes to give a sense of how the users would interact with the pages.

This also allows us to see user errors when we conduct usability tests afterwards.

Audio Flow Chart

Reflection Flow Chart

Reward System Flow Chart

Usability-Test

I conducted usability tests to see how users would perform on the high fidelity prototypes. From here, we were able to analyze specific pain points, and addressed them in our final designs

ProgressionCheck

There were ambiguity with existing completion indicators. Users would tap on the circle thinking they could navigate to next page, and were unsure which courses they have started or completed. So, we made a progress bar to show completion instead

Icon Explanations

There was confusion with meanings of icons where users couldn’t immediately understand symbolism of existing icons. Users tried to tap to learn more. So, we designed icon explanations to provide them with more info about their targeted skill

Dynamic Titles

“What if the Titles are too Long?”, as one of our Software Developers mentioned. We addressed this concern by having the titles be cut near the margins, but would loop to read through the entire title

UI Update

We iterated on our client’s previous designs based on our usability test feedback. There are changes to the UI to account for the new design system and reducing user errors.

DEMO

Final Design

Our Client originally had a non-functioning low-fidelity prototype. What changed was how there was a lot more empathy and research.

The new design includes a very distinguishable design system that is visually pleasing, and intuitive for users to learn and listen to audios on their own.

Clean and Green

With an updated design system and changes made according to usability test feedback, users are now able to easily access and track the progress of their course sessions.

Personalized Reflections

There are now individualized course reflections to be more personalized, where users have the freedom to skip, continue, and reflect after finishing their courses.

Everyone loves Rewards

The newly implemented rewards page briefly introduces users to its purpose while also providing an easy way to access and share their personal code and redeem their gifts.

DESIGN SYSTEM

Branding

Rebranding the Design system was crucial to help make the application more consistent.

Most components and variants were worked and discussed with the client. Any components were composed of the following typography, colors, and icons.

Reflection

This 12-week project is CodeLab's Exclusive Industry Client Team, where only a small number of people is able to work with a real-life stakeholder and company. Through this, I learned a lot about how to apply design thinking into a business perspective- how do we generate revenue for this start up company?

Working with not only a designer, but in a team of Software Developers and Project Managers was an incredible learning experience for me. Together, we were able to communicate feasibility issues and individual progresses, replicating a real industry setting.

Our stakeholder instructed us to create a Rewards Page with only a week of deadline. For my next steps, I would like to spend more time conducting an adequate amount of usability test to validate the designs more. If given more time, I also would like to create a better onboarding process for the users to allow an easier understanding of the app.

Overall, I am very proud of my contributions to the team, and how we all successfully communicated clearly at this industry project with Golf guru

Check out my other work

Kapi

2023

Welcoming underrepresented communities in the gaming sphere.

Messenger Redesign

2022

Reimagining Meta's Messenger App to centralize focus on Marketplace, Video Calls, & Chats.

Clues Dot Life (Coming Soon)

2023

Designing & Developing a mental health resource platform for my client.