Descent X50i
Garmin was developing a dive computer for professional divers.
As the Lead UI designer, I created an experience that supports divers across all 3 dive phases. I built a modular system with legibility, quick access and underwater usability.
In results, I delivered a seamless, customisable interface with real-time clarity and reliability.
My Role
My Role
Lead UI Designer
Lead UI Designer
Duration
Duration
6 months, 2024
6 months, 2024
Product Team
Product Team
1 Lead UX Designer
2 Product Managers
1 Lead UX Designer
2 Product Managers
Deliverables
Deliverables
UI/UX Kick-Off
UI Flow & Architecture
UI Design
UI/UX Kick-Off
UI Flow & Architecture
//My Challenge
//My Challenge
How can I design interface flow
that is trusted by professional divers?
How can I design interface flow that is trusted by professional divers?
// How Did I Start?
// How Did I Start?
Immersing into the
Dive Domain
Immersing into the Dive Domain
Immersing into the Dive Domain
Before designing, I needed a stronger foundation in the dive domain. Hence, I set up meetings with key stakeholders including PMs, SWs and UX to set alignment for both deliverables, timeline and to identify top user challenges on this project.
Before designing, I aligned with PMs, SW, and UX leads to clarify deliverables, timeline and key user challenges to build a stronger foundation in the dive domain.
Interview Sessions
Interviews
Interview Sessions
Hosted know-how interviews and training sessions by inviting Garmin dive experts.
Hosted know-how interviews and training sessions by inviting Garmin dive experts.
Know-how interviews and training sessions
Competitor Study
Competitor Study
Competitor Study
Competitor Study
Studied UX and UI dive workflows through conducting competitor analysis.
Studied UX and UI dive workflows through conducting competitor analysis.
Studied UX and UI dive workflows
Legibility Test
Legibility Test
Legibility Test
Established typography and colour standards to ensure underwater legibility.
Established typography and colour standards to ensure underwater legibility.
Underwater legibility with typography & colours
// Understanding the Divers
// Understanding the Divers
What Divers Need in a Dive Computer?
What Divers Need in a Dive Computer?
With the complexity of technical and data-heavy diving experience, professional divers need a clearer, faster way to access, understand and act on critical dive information across all phases.
With the complexity of technical and data-heavy diving experience, professional divers need a clearer, faster way to access, understand and act on critical dive information across all phases.
I often feel disconnected using dive computers, each phase feels isolated. There’s no freedom to choose data that matters to me, and the dive log data just feels like a bunch of numbers to me.
I often feel disconnected using dive computers, each phase feels isolated. There’s no freedom to choose data that matters to me, and the dive log data just feels like a bunch of numbers to me.
I often feel disconnected using dive computers. There’s no freedom to choose data that matters to me, and dive log just feels like a bunch of numbers.
- Technical/Professional Diver
- Technical/Professional Diver
// User Journey Mapping
// User Journey Mapping
Understanding the
Divers
Understanding the Divers
Understanding the Divers
Understanding the Divers
We observed that the divers placed strong emphasis on separating each dive phases during the dive course training.
This led us to map out the diver’s experience across pre-dive, in-dive and post-dive phases to better understand their behaviours, emotions and decision points at each stage.
We observed that divers placed strong emphasis on separating each dive phases.
This led us to map out the experience across pre-dive, in-dive and post-dive phases to better understand their behaviours, emotions and decision points at each stage.
// Narrowing Down Goals
// Narrowing Down Goals
How might we…
How might we…
HMW #1
HMW #1
HMW #1
…design a seamless and guided dive experience from start to finish?
…design a seamless and guided dive experience from start to finish?
…design a seamless and guided dive experience from start to finish?
…design a seamless and guided dive experience from start to finish?
Strategy #1
Strategy #1
Strategy #1
Structure around the dive rhythm
Structure around the dive rhythm
Structure around the dive rhythm
Structure around the dive rhythm
To reduce friction and build diver confidence
To reduce friction and build diver confidence
To reduce friction and build diver confidence
Reduce friction and build confidence
HMW #2
HMW #2
HMW #2
…present clear, legible and actionable complex dive data?
…present clear, legible and actionable complex dive data?
…present clear, legible and actionable complex dive data?
…present clear, legible and actionable complex dive data?
Strategy #2
Strategy #2
Strategy #2
Expand customization while keeping clarity
Expand customization while keeping clarity
Expand customization while keeping clarity
Expand customization while keeping clarity
Create modular screens that support diverse dive needs
Create modular screens that support diverse dive needs
Create modular screens that support diverse dive needs
Modular screens to support diverse needs
HMW #3
HMW #3
HMW #3
…organise post-dive info that is revisitable and learn from?
…organise post-dive info that is revisitable and learn from?
…organise post-dive info that is revisitable and learn from?
…organise post-dive info that is revisitable and learn from?
Strategy #3
Strategy #3
Strategy #3
Turn data into stories that support reflection
Turn data into stories that support reflection
Turn data into stories that support reflection
Turn data into stories that support reflection
Structured summaries, events, and recovery data
Structured summaries, events, and recovery data
Structured summaries, events, and recovery data
Structured summaries, events data
// Design Showcase
// Design Showcase
Designing a seamless dive experience
Designing a seamless dive experience
To reduce cognitive frictions and increase user confidence, the UX & UI architecture is structured around the natural rhythm of a dive: Before, During & After.
To reduce cognitive frictions and increase user confidence, the UX & UI architecture is structured around the natural rhythm of a dive: Before, During & After.
Pre-Dive
Pre-Dive
In-Dive
In-Dive
Post-Dive
Post-Dive
Making complex data clear, legible & actionable
Making complex data clear, legible & actionable
Leveraging on existing Descent watch UX, the data screens are designed to be clear, flexible and legible, while expanding customisation to support different dive needs and real-time decisions.
Leveraging on existing Descent watch UX, the data screens are designed to be clear, flexible and legible, while expanding customisation to support different dive needs and real-time decisions.
#In-Dive Phase
Data Screen Layout
Data Screen Layout
Primary Zone
Displays critical metrics that remain fixed and always visible
Primary Zone
Displays critical metrics that remain fixed and always visible
Scrollable Zone
Allows divers to swipe through additional data without cluttering the main view
Scrollable Zone
Allows divers to swipe through additional data without cluttering the main view
#In-Dive Phase
Modular, Customisable & Editable
Modular, Customisable & Editable
Editing data
Add, reorder, or switch data fields based on diver preference
Editing data
Add, reorder, or switch data fields based on diver preference
Predefined templates
Guided starting points (e.g. Compass, Stopwatch) that can be fully customised
Predefined templates
Guided starting points (e.g. Compass, Stopwatch) that can be fully customised
#In-Dive Phase
Real-Time Dynamic Depth
Real-Time Dynamic Depth
Integrated Live Chart
Displays a real-time visual overview of depth, time, gas switches, ascent speed and deco ceilings in a continuous view to support decisions underwater
Integrated Live Chart
Displays a real-time visual overview of depth, time, gas switches, ascent speed and deco ceilings in a continuous view to support decisions underwater
Ascent Planning Aids
Features markers like @+5, Δ+5, and future stops to help divers plan ahead during ascent
Ascent Planning Aids
Features markers like @+5, Δ+5, and future stops to help divers plan ahead during ascent
Organising post-dive info into a story
Organising post-dive info into a story
The post-dive experience was designed to do more than display numbers. It should help divers revisit, reflect, and learn from each dive. From summaries to timestamped events and recovery data, every detail is structured to tell a clear story of what happened underwater.
The post-dive experience should help divers revisit, reflect and learn from each dive. Every data needs to be structured to tell a clear story of what happened underwater.
#Post Dive
Post Dive Summary
Post Dive Summary
After surfacing, divers receive a quick visual snapshot of their dive, covering stats, alerts and overall performance.
After surfacing, divers receive a quick visual snapshot of their dive, covering stats, alerts and overall performance.
Overview Page
Visual graphs showing dive time, depth, temperature
Overview Page
Visual graphs showing dive time, depth, temperature
Event List
Timestamps log of notable dive events, with filters and linked to the graph for easy review
Event List
Timestamps log of notable dive events, with filters and linked to the graph for easy review
#And More
#And More
Other Features
Apnea
Divers Dashboard
Deco Alert
Dive Alert
inReach
Dive Log
Last Dive
Surface Interval
Apnea
Divers Dashboard
Deco Alert
Dive Alert
inReach
Dive Log
Last Dive
Surface Interval
Apnea
Divers Dashboard
Deco Alert
Dive Alert
inReach
Dive Log
Last Dive
Surface Interval
Apnea
Divers Dashboard
Deco Alert
Dive Alert
inReach
Dive Log
Last Dive
Surface Interval
Apnea
Divers Dashboard
Deco Alert
Dive Alert
inReach
Dive Log
Last Dive
Surface Interval
Apnea
Divers Dashboard
Deco Alert
Dive Alert
inReach
Dive Log
Last Dive
Surface Interval
Apnea
Divers Dashboard
Deco Alert
Dive Alert
inReach
Dive Log
Last Dive
Surface Interval
Apnea
Divers Dashboard
Deco Alert
Dive Alert
inReach
Dive Log
Last Dive
Surface Interval
// Modular & Scalable System
// Modular & Scalable System
Building a Modular Design System
Building a Modular Design System
To ensure consistency and scalability, I developed a modular UI system in Figma, covering each key components across the product.
To ensure consistency and scalability, I developed a modular UI system in Figma.
This system helped:
Streamlined developer handoff
Ensured visual and behavioural consistency across all dive phases
Created a scalable foundation for future Garmin dive platforms
This system helped:
Streamlined developer handoff
Ensured visual and behavioural consistency across all dive phases
Created a scalable foundation for future Garmin dive platforms
This system helped:
Streamlined developer handoff
Ensured visual and behavioural consistency across all dive phases
Created a scalable foundation for future Garmin dive platforms
This system helped:
Streamlined developer handoff
Ensured visual and behavioural consistency
Created a scalable foundation for future Garmin dive lineups
//User Feedbacks
//User Feedbacks
Validating Clarity, Usability & Decision Support
Validating Clarity, Usability & Decision Support
We collaborated with Roihan Han, a Malaysian Garmin dive KOL and technical instructor, to validate the X50i in real dive conditions.
We collaborated with Roihan Han, a Malaysian Garmin dive KOL and technical instructor, to validate the X50i in real dive conditions.
His feedback confirmed several key UX wins:
Critical data is glanceable & readable underwater
Navigation feels intuitive across pre, during and post dive phases
Higher data density works well showing up to 6 fields per screen
Real-time ascent guidance helps with faster, more confident decisions
Post-dive summaries are clear and useful for both self-review and student training
His feedback confirmed several key UX wins:
Critical data is glanceable & readable
Navigation feels intuitive across dive phases
Higher data density works well
Real-time ascent guidance helps faster and confident decisions
Post-dive summaries are clear and useful
//Takeaway & Lesson Learned
//Takeaway & Lesson Learned
Think Like a Diver
Think Like a Diver
This project challenged me to think like a diver, not just a designer. To build an interface that supports diver underwater, I had to think beyond screens and design an experience that aligns with the diver’s journey, from preparation to reflection.
This project challenged me to think like a diver, not just a designer.
To build an interface that supports diver underwater, I had to think beyond screens and design an experience that aligns with the diver’s journey, from preparation to reflection.
PORTFOLIO
PORTFOLIO
PORTFOLIO
CHECK OUT SOME MORE
CHECK OUT SOME MORE
Connect IQ Monetisation
Connect IQ Monetisation
Connect IQ Monetisation
Strategy Plan
Market Research
Price Plan
Execution
Connect IQ Monetisation
Connect IQ Monetisation
Connect IQ Monetisation
Strategy Plan
Market Research
Price Plan
Execution
Connect IQ Monetisation
Connect IQ Monetisation
Connect IQ Monetisation
Strategy Plan
Market Research
Price Plan
Execution
CIQ Monetisation
CIQ Monetisation
CIQ Monetisation
Walkr Asteriod System
Walkr Asteriod System
Walkr Asteriod System
User Interview
UI Design
Strategy Planning
Walkr Asteriod System
Walkr Asteriod System
Walkr Asteriod System
User Interview
UI Design
Strategy Planning
Walkr Asteriod System
Walkr Asteriod System
Walkr Asteriod System
User Interview
UI Design
Strategy Planning