top of page

ARfit

Case Study

Project Overview

About Project

AR goggle designed specifically for cyclists. This cutting-edge technology aims to enhance safety by providing real-time navigation and critical metrics, allowing cyclists to keep their focus on the road and surroundings

Challenge

Cycling is an activity that can expose you to many risks despite the obvious health benefits. An unexpected injury can happen in just a split second, caused by various factors. One of the ways to reduce the dangers associated with cycling is by using an AR goggle. With this technology, cyclists can navigate their routes easily without having to look down at their phones. Additionally, the goggles can display core metrics such as distance covered and speed, thereby enabling riders to track their progress.

Solution

  • Design smart AR product for ARfit

  • Design mobile app for ARfit

  • Develop a branding for ARfit

Project Scope

Mobile App, Branding, Product design

Role

Research, Visual Design, UI design, User Testing

Team

Self directed, with feedbacks from mentor and peers

Ideate

User Persona

With the data gathered from Primary research and secondary research, I was able to create a user persona to ideate the overall target

Strategy

Along with user persona, I created a Point of view statement to ideate a goal and How might we questions to ideate in order to reach the solution to a problem.​

Project Goal

With How Might We questions, I was able to define goals for the project which it will also be a guide to the project.

Product Roadmap

By setting a goal, I was able to create product roadmap initializing features into categories into 4 from “must have” to “can come in later” to resolve the problem and potentially lead to a solution.

Site map

With the help of product roadmap, I was able to visualize primary features’ relationship between content along and arrange the hierarchy.

Research

Research Plan

To Begin the project, It is very important to research competitors, trends, market and any backgrounds referring to the field. This research will provide me support me to understand the market and emphasize the users. To stay on track and to guide me to reach research goal, I created a research plan

Research Goals

  • Learn about current / upcoming AR technologies

  • Understand market trend in AR field

  • Identify cyclists frustrations when cycling

  • Identify risks when cycling 

  • Identify future competitors

Secondary Research

Market Research

To develop a successful marketing strategy, it is essential to conduct thorough market research to gain a comprehensive understanding of the market landscape and identify key trends and target audiences. By analyzing market data, we can develop provisional personas that represent the needs, behaviors, and preferences of our target audience.​

Cyclist  Injuries

  • Motorist failing to yield the right of way to the cyclist: This accounts for 29% of all cyclist-motor vehicle crashes.

  • Cyclist riding on the wrong side of the road: This accounts for 15% of all cyclist-motor vehicle crashes.

  • Motorist overtaking the cyclist: This accounts for 12% of all cyclist-motor vehicle crashes.

  • Motorist turning left in front of the cyclist: This accounts for 10% of all cyclist-motor vehicle crashes.

  • Cyclist riding in the motorist's blind spot: This accounts for 9% of all cyclist-motor vehicle crashes.

 AR Market Trend

  • AR is being used in the gaming industry, with the global AR gaming market expected to reach $284.9 billion by 202

  • AR is increasingly being used in education and training, with the market for AR in education expected to grow at a CAGR of 55.4% between 2019 and 2024.

  • AR is also being used in healthcare, with applications including surgical navigation, medical training, and patient education.

  • Augmented reality is being increasingly adopted by businesses of all sizes as it offers a unique and engaging way to interact with customers.

  • AR is also being used in e-commerce to provide customers with a more immersive shopping experience

  • With the rise of AR-enabled smartphones and tablets, AR is becoming more accessible to consumers than ever before

Competitive Research

As I began my competitive analysis, I sought out both direct and indirect competitors in the smart AR glasses technology space. Through researching and analyzing their websites and products, I was able to gain valuable insights into their HUD design, as well as identify their strengths and weaknesses in the market. This provided me with a better understanding of the current landscape and the unique challenges that our product will face. By conducting this thorough analysis, I was able to gather important information that could inform the development of our own smart AR glasses technology and help us to better position ourselves in the market.

Direct

Indirect

Provisional Persona

By creating provisional personas that represent the needs, behaviors, and preferences of our target audience, I can develop a strategy that effectively targets and engages our ideal customers.

Primary Research

User Interview

A total of 5 participants, all of whom are passionate about cycling, actively participated in the interview process. These interviews proved invaluable as they provided deep insights into the participants' experiences, pain points, and specific needs while cycling.

Empathy Map

Interview Findings

  • At night, limited source of light can pose a safety risk and make it difficult to navigate the road.

  • When sharing road with pedestrians, encountering young kids can be frustrating and pose a safety risk.

  • Cyclists who have a goal to achieve, checking their metrics consistently is important to track their progress and improve their performance.

  • For cyclists who prioritize consistency in their riding, maintaining a steady cadence or speed is crucial to avoid accidents and enhance their cycling experience.

  • Cyclists who value safety while riding, being able to receive notifications and alert others of their presence is essential to prevent accidents and ensure a safe ride.

Cyclist Needs

  • Providing live, real-time measurements of a cyclist's performance and metrics.

  • Receiving directions in advance, allowing cyclists to plan their route and make necessary adjustments.

  • Receiving notifications to prevent potential accidents.

  • Improving visibility during nighttime cycling to ensure the safety of the rider.

Define

Task Flow

Scenario

In order to use smart AR goggles, a widget loadout must be set up.

Task 1: Set up a loadout on the App.

User Flow

Scenario

You have been set up your metric loadouts. Now its time to operate your smart AR goggle

Task 2: Operate the goggles

Wireframes

Before I started to digitize wireframes, I sketched some key pages that I identified in task flow and in user flow. With wireframe sketches i was able to develop into digitalized wireframes.

Branding & Logo

To begin the logo design process, I initiated by creating a mood board to establish the overall look and feel of the brand. This mood board served as a visual reference and inspiration for capturing the essence of the brand. While curating the mood board, I focused on incorporating keywords such as "engaging," "trustful," and "simplicity" to guide the aesthetic direction.

By creating a style guide based on the mood board/Reference boards and reflecting the brand's keywords, I established a comprehensive visual framework that guides future design decisions. Along with style guide, I also created UI component with using variants.

Style guide

Design

Priority Revisions

By utilizing the affinity map to analyze the feedback received, I was able to categorize it into two distinct categories based on the frequency and severity of the issues identified. This categorization allowed me to prioritize and address the most critical usability concerns first while still considering the less frequent and severe issues for potential improvements.

Less frequent and severe

Updates on userflow

APP

  • Speech to text feature

  • Preset build widget loadout

  • Notification on widget vs. setting

  • other 3rd party device for notifications

Updates on visuals

APP

  • Preset build widget loadout

  • Onboarding of the goggles

Goggles

  • Audio

  • Mic

More frequent and severe

Updates on userflow

App

  • Separate linked device and connect new device

  • Consistency on operating (slide vs scroll)

  • Add unit measurement

  • Goggle tap setting

  • Able to set tap manually by users preference

Goggles

  • Tap to clear all the HUD

  • Tap to switch loadouts

  • Double tap to clear notifications​

Updates on visuals

App

  • Add todays date is

  • Remove duplicated text on button

  • Add abbreviation

  • Goggle tap setting

Before

After

Click here to access app prototype

Responsive UI design

User Testing

Usability Testing

After implementing the style guide and translating the wireframes into mid-fidelity designs, I engaged a group of 5 participants who shared a common interest in cycling as a hobby. These participants were selected to represent the target audience and provide valuable insights from the perspective of potential users.

Test Objective

  • Test if users are able to accomplish the given tasks

  • Identify that generate difficulties and confusion when users are navigating through the website and completing a task

  • Generate findings from testing results to iterations for the next round

Tasks to complete

Task 1: Set up a loadout on the App

Scenario: In order to use smart AR goggles, a widget loadout must be set up.


Task 2: Operate the Smart AR goggles

Scenario: You have been set up your metric loadouts. Now its time to operate your smart AR goggle

Affinity Map

Based on the test results obtained from the usability testing, I employed an affinity mapping technique to organize and make sense of the feedback and notes provided by the participants. The affinity map facilitated the grouping and categorization of the various observations and insights collected during the testing sessions.

Final Thought

Take away

This project exemplified my adaptability, resilience, and commitment to continuous learning. An end-to-end application project was a transformative journey for me, as I ventured into unfamiliar territory and started with a blank slate. Despite moments of hesitation and uncertainty, the valuable feedback and support from my peers and mentor propelled me forward. Their guidance and constructive criticism allowed me to overcome challenges and ultimately achieve a final design and app.

Next Step

Because this project started from the scratch I want to see the product evolve into better design along with more features with simple tap to the goggles.

bottom of page