Case Study
UX/UI
FICTIONAL PROJECT
WATERPROOF SMART WATCH
WEBSITE DESIGN
PROBLEM STATEMENT
Current market lacks a waterproof watch that can accurately track and monitor fitness data for swimming or any other water sports, they can be a stylish accessory that can be worn every day. This results in a shortage on the market of a device that can provide reliable and consistent tracking performance for this type of physical activity.
THE GOAL
The main goal with the AquaFit watch is to create a waterproof wearable timepiece that combines advanced tracking technology with a stylish design, providing an all-in-one solution for fitness enthusiasts.
THE AUDIENCE
Whether you're a competitive swimmer, triathlete, or simply someone who loves being active outdoors, the AquaFit device is designed just for you.
MY ROLE
This is a fictitious Solo Project.
My role included choosing the design strategy with user-friendly interface based on the results of the user experience research methods. After creating lo-fidelity and hi-fidelity wireframes, the usability testing was conducted and the improvements were done.
TOOLS USED
-
FIGMA
-
PHOTOSHOP
-
GOOGLE FORMS
... finding a product’s why, what, and how
DESIGN PROCESS
1. DISCOVER
-
User research
-
Design strategy
-
Key insights
2. DEFINE
-
User personas
-
Empathy mapping
-
Journey map
3.IDIATE
-
User flow
-
Information
architecture
4. DESIGN
-
Usability testing
-
Getting feedback
-
Improvements
5. TEST
-
Wireframes
-
Hi-Fi design
-
Visual design
design process
1. DISCOVER PHASE
User research
I conducted an online survey using Google Forms to find out what the potential users might want. Quantitative information that was gathered allowed me to gain reliable and objective insights.
Insights & Pain Points
Key insights
Gathered information shows that most responders are physically active people who prefer wearing wearable device very often. They prefer bying it online rather than in store. The most important features in their opinion are battery life, GPS/ tracking, and waterproofness. According to survey, the potential customers’ frustrations could be a small screen size of the wearable device, low battery life, and water unresistance . Also, responders expect the smart watch to be both a fitness gadget, and a stylish accessory.
design process
2. DEFINE PHASE
User personas
PERSONALITY
-
Extrovert
-
Active
-
Goal-oriented
-
Workaholik
USER STORY
Jaya is a 28 year old pharmacist., who also collaborates with services and programs that are designed to promote health and well-being. She is physically active who likes water sports, and enjoys going to the swimming pool few times a week. Jaya likes travelling to Hawaii for snorkeling, and other water activities, which is one of her biggest passions.
FRUSTRATIONS
-
Difficulties with reading a small text on the watch
-
Doesn’t like that the battery is getting low very quickly
-
Fear that the wearable device won’t be water resistant enough
GOALS
-
Receiving important notifications as she can’t use her phone during working hours
-
Tracking heart rate and blood oxygen during swimming practices
-
Keeping track of the time and dive stats
Jaja Parker
Pharmacist
Empathy map
Empathy map
THINK
-
Reasonable price for a smart watch
-
Buying online or offline
-
Can I trust this company
FEEL
-
Pleasure about having a new device
-
Unsure that the interface will be clear
-
Fear that a smart watch will stop working in depth while swimming
SAY
-
Sharing the experience of
using a smart watch with friends
-
Features work very well
-
Customer support of the online
store is very helpful
DO
-
Use smart watches very often
-
Check smart watch features to monitor their health
-
Update watch's apps through a phone
THINK
-
Smart watch seems attractive
-
Unsure of the sizing of the device
-
Can I trust this company
-
Wondering what is a return policy
-
Wondering if there is a best alternative
FEEL
-
It was a great purchase
-
Fear that the GPS will not always work properly
-
Enjoying how it looks
-
Curious what other features will come with an update
SAY
-
Smart watch has a nice design
-
Sharing the experience of using a smart watch with friends
-
Great fitness tracking
DO
-
I use health apps very often
-
I complement my clothing with the watch
-
Update watch's apps through a phone
Empathy map
Product marketing manager
PERSONALITY
-
Passionate
-
Highly competitive
-
Fashionable
-
Original
Connie Rush
USER STORY
Connie has a job in a marketing agency, his job involves a lot of interaction with the clients. Therefore he requires to take care of the way he looks. His favoutite accessory is a smart watch, he wears it every day in order to check important notifications, smart watch allows him to be up to date. He likes setting his own custom running workouts for achieving better results.
FRUSTRATIONS
-
Doesn’t like that the battery is getting low very quickly
-
Offline functionality
-
Fear that the GPS will not be always working properly
GOALS
-
Receiving email notifications and messages
-
Complementing the style
-
Ability to set workouts with own pace, time and heart-rate zone
Customer journey map
Understanding the nature of customers’ behavior is a key factor while going through the accomplishing a goal. It reveals opportunities to address customers’ pain points, finding the alleviate solutions, and creating a better experience for users.
design process
3. IDIATE PHASE
User flow
This phase reflects the logical path of the user exploration of a website. The diagram maps out the user's entire experience, from the initial access point to the last interaction, detailing each touchpoint along the way.
Information architecture
Information architecture is the process by which content is organized and made readily available to users. It focuses on organizing and structuring content to make it easily accessible, focusing on creating a positive and meaningful user experience through intuitive interfaces and interactions.
design process
4. DESIGN PHASE
Wireframes
In the early stages of the design process, wireframes helps defining the structure and layout of the design. In this state I focused on an arrangement of elements like headers, footers, and content areas. It helped me to visualize the user flow and how users will navigate through the design.
Colours & Typography
The next step was choosing the right colours and typography that will help to develop a positive brand identity.
High-Fidelity wireframes
After establishing a style guide and design system, I started working on high-fidelity wireframes. It was the most time-consuming part but it is a valuable step to ensure that the final design closely aligns with the project's goals and user expectations.
design process
5. TESTING PHASE
In this phase, I have created a prototype in Figma tool. This prototype helped me conducting user interviews.
5 Participants were able to test a website and share their thoughts. The results helped me to uncover pain points and find solutions how to improve the overall user experience. According to the survey results analysis, some of the changes have been successfully made.
In a new version of the website “Filter” options were added to the Product Page. The new filters include possibility filtering by colour, screen size, and price
Different payment methods
were added to the Check out Page
2. Adding
more payment methods
3. Enabling the “Guest mode”
during check-out with no registration
A Guest customer option was added during check-out that will allow users to skip the creation of an account or log in to an existing one
... see how it looks
FINAL DESIGN
Conclusion
AquaFit is my very first UX/UI Project that was focused on learning the main Figma tool features and design principles. In the beginning of AquaFit case study, I was provided with Mentor's support and guidance which played a crucial role in my learning journey. It helped me successfully mastering the tool interface, components, and collaboration features. Looking ahead, the skills acquired in Figma are not only an asset to my current case study but will undoubtedly be a cornerstone for the future UX/UI design projects.
THANKS
for watching