TopTee
2023
TopTee
A platform distinctively designed for junior golfers and college coaches to communicate, connect, and interact actively.
My Roles
Visual Lead
UI Lead
Tools
Figma
Adobe Suite
Categories
UX UI / Product Design
Why?
Problem Statement
Junior golfers face challenges in managing documents, updating resumes with scores, and researching universities due to tight training and tournament schedules. The need for a streamlined process to efficiently handle their sports and academic goals is evident.
How?
Design Process
Over 24 weeks, we conducted user-centered research to identify the challenges faced by junior golfers, understood the golf industry and NCAA regulations, benchmarked and analyzed competitors, developed and iterated concept designs, created info arch and a cohesive design system that blends professionalism with ease of use, and finalized an inclusive platform for junior golfers and coaches.
What?
End Product
TopTee revolutionizes college golf recruiting by helping young golfers build impactful resumes and connect with coaches. It simplifies tracking achievements and researching colleges, improving communication between players and coaches. Committed to promoting diversity and accessibility, TopTee aims to make golf more inclusive and accessible for all.
Website
Student
Coach
University
Our final design emphasizes simplicity and user-friendliness, making TopTee accessible to a global audience. By minimizing the learning curve, we aim to create an inclusive platform that welcomes participation from all backgrounds within the golf community.
Mobile
We designed the seamless, intuitive mobile UI with quick navigation and touch-friendly interactions, making key features easily accessible on smaller screens. It delivers the same inclusivity and accessibility as the web version, ensuring a consistent experience across all devices.
Secondary Research
Understanding industry / regulation
It was crucial to understand the regulations, especially NCAA, and timelines required by the league for junior players and university coaches to follow. This organization of information educated the team on the industry and helped us move forward with the information architecture.
Our competitors
Our competitive research into platforms like Junior Golf Hub, Junior Golf Scoreboard, and AJGA revealed they are popular among junior golfers for tracking scores and resumes. However, they lack a unified space for all essential information. To understand the market landscape, we conducted a thorough analysis to identify strengths, weaknesses, and opportunities for differentiation and improvement in our platform.
Interviews
10+
experts
- College Coaches
- Golf Club Heads
10+
golf players
- Junior Golf Players
"
It is important to see where you are through stroke gain data, so that player can understand what to improve.
- Golf Club Head
"
Sometimes, I don’t want to show my bad score that I got.
- Junior Golfer
"
Nice and precise on personal statement. Why they chose
our college, how can they contribute to our team?
- College Coach
Insights
Creating a comprehensive player profile to gain a holistic understanding of each player.
The significance of personalization and precision in communication and presentation.
Leveraging analytics and data-driven insights for self-improvement and making informed decisions.
User Needs
Seeking to develop a resume and personal statement that resonates powerfully with clear articulation.
Exploring swing videos from various angles or perspectives enhances analysis for a comprehensive understanding.
Relying on key statistics that can lead to data-driven improvement.
Concept
Website / Mobile
About
Personal Statement
Personal Info
Coaches Info
Point of Contact
Tournament
Tournament Info
Round Details
Score/Finish
Course rating
Statistc
Score, par, handicap
Driver, putt, tee
Fairways & green in regulations
Academic
Standard statistics
Scores / GPA
AP / advanced Courses
Extracurricular / awards
Resume
Automated Resume
Accessible Editing
Resume Templates
Video
Angles
Types
Clubs
Stance
Information Architecture
Onboarding
Saved
Message
Feed
Friend’s Post
Calendar
Tournaments
Recruiting Events
Tournaments
Recruiting Events
Post
About
Tournament
Statistics
Videos
Connection
Academics
Resume
Upcoming
Profile
Notification
Friends
Tournamnets
Recommendation
Low-Fi Wireframe
Mid-Fi to Hi-Fi Prototype
Hover for Comparison
User Testing Feedbacks
"
Clarity is key, I want to quickly understand their playing experience and strengths.
- Golf Club Head
"
I look for clear and detailed information. Metrics such as handicap index, tournament scores, and specific areas of focus provide valuable insights.
- Golf Coach
"
We need live updates and scores, so we can track their progress, allow us to dig deeper into our students' performance.
- Golf Coach
"
Scoring Average is more important than others and it makes sense if the stats are seasonal average.
- Golf Coach
User Tseting Findings
Based on the feedbacks related to statistics, we were able to find 5 core data. 1. Strokes Gained (SG); 2. Greens in Regulation (GIR); 3. Fairways in Regulation (FIR); 4. Putts per Round/Putting Avg; 5. Club Distance.
We recognized the need to visualize comparison data for potential players, allowing users to filter statistics by specific timeframes, tournaments, and skill categories.
Improvements
Enabled visualization and comparison of these core statistics for potential players
Added filters for data analysis based on specific timeframes, tournaments, and skill categories.
Integrated dynamic charts to allow real-time updates and easy comparison across multiple players.
Design System
2.25 X
X
72px
90px
20px
16px
16px
78px
Website
Columns: 90px
Margins: 72px
Gutter: 20px
Baseline: 4px
Mobile
Columns: 78px
Margins: 16px
Gutter: 16px
Baseline: 4px
Aa
Manrope
Page Title, Name
Website
Medium 36px
9rem
Medium 16px
4rem
Mobile
Medium 20px
5rem
Medium 16px
4rem
Aa
Inter
Paragraph, Button, List Item Titles, Important Text
Website
Medium 24px
6rem
Medium 20px
5rem
Medium 16px
4rem
Medium 14px
3.5rem
Medium 10px
2.5rem
Mobile
Medium 16px
4rem
Medium 14px
3.5rem
Medium 12px
3rem
Medium 10px
2.5rem
#FF3D00
Primary
90
80
70
60
50
40
30
20
10
05
Secondary
#FFFFFF
Secondary
#000000
80
60
40
20
10
05
#3365FD
Secondary
80
60
40
20
10
05
Information
#FFFFFF
Success
#107E3E
Warning
#E9730C
Error
#BB0000
Takeaways
Great design is built on great research.
Through this project, I learned that in the world of design, research is the foundation that supports every successful endeavor. The insights gained from our research into the needs, preferences, and behaviors of junior golfers and college coaches enabled us to create solutions that were not only aesthetically pleasing but also highly functional and user-centric.
Hi! This is the bottom.
© Josh Lu 2024
v2.0.0
Aug '24