This project is focused on designing the Fitbit watch app for a confidential company based in Silicon Valley. With major customers in UAE with operations across 10+ cities in UAE. 73% of UAE businesses/industries uses mobile app for supervising and managing employees. This case study is about, how might we use the smartwatch app in the workers, remote employees, and will discuss how companies can use this for employee's health and safety at the workplace.
Project Duration1 month
Target Users10K+ users
PlatformFitbit OS
RoleProduct Designer
DeliverablesResearch, Strategy, Design
Problem statement
Health and safety at workplace and provide flexible way for daily activities at workplace
In UAE Summer is very hot and sunny, with temperatures ranging from 38 °C to 42 °C (101 °F to 108 °F) between May and September, as construction and industrial workers are not permitted to work during the hottest hours of the day during the summer because of Health and safety at the workplace. Our team come up with an idea to monitor workers/employee's heart rate using a smartwatch not just heart rate also daily office activities like approve or reject requests, and mark attendance, etc. As Fitbit Watch amplifies simplicity and eliminates the smallest little daily frictions. This device gives a great opportunity to streamline UX.
Target audience
Workers (remote/factory)Age: 24-45
Field EmployeesAge: 24-45
ManagementDecision makers
HR PersonnelPolicy enforcers
LeadershipStrategic oversight
Goals
Health and safety
Make people feel as their heart rate is being monitored and tracked, and get notified to the managers or family in case of emergency
Provide flexible way for daily activities
Help people to have flexibility on marking attendance, approve requests and get notifications etc using a smartwatch.
Employee satisfaction
Increase the percentage of positive employee feedback from 65% to 80%. Attainable: From 45% in 2019 to 80% in 2020. Relevant: To make the majority of the employees live the values of the organization.
Support efficiency
Ensure contact rate to customer support related to this module and overall app doesn't increase by XX% within 6 months of launching this feature.
Process
1. DiscoveryDefine user needs
2. AnalysisAnalyze gathered data
3. IdeationSketches and prototypes
4. TestImprove design and accessibility
Research approach
Though I audited other smartwatch apps, and most of them were focused on sports. To gain a competitive advantage, we choose the Fitbit watch due to its popularity amongst other watches. I look for available SDK for app implementation, Identify limits and capabilities of the hardware along with additional contexts such as cost and durability also help us to decide whether or not we should invest in building the app for Fitbit. Our goal was to leverage learnings from small devices and expand services across all devices.
Surveys
We rolled out surveys across 10 different customer organizations to understand how often workers operate in remote areas and whether they monitor vital signs like heart rate and blood pressure during extreme weather conditions. We wanted to learn about their current health monitoring habits, especially when working in hot and sunny conditions. The insights from these surveys helped us validate our hypothesis about workplace health monitoring needs and identify key pain points to address in our solution.
Design approach
We followed the hypothesis-driven designer canvas to validate our assumptions about workplace health monitoring. This approach helped us test whether our design hypotheses were true and if our solution would meet user needs effectively.
After validating our hypothesis, we needed to decide on the ideal direction - whether to go with minimal context or a more powerful, feature-rich approach. Through initial discovery and client interviews, we explored different paths for the product.
During ideation, I wanted to ensure we designed an app that would work for both frontline workers needing health monitoring and leadership requiring oversight capabilities. After several stakeholder meetings, I realized there was sufficient overlap to create a unified solution that would serve all user groups effectively.
User flows & Sitemaps
I had gotten a fair understanding to start with user flows. User flow allowed me to see the complete app experience at a holistic level. Furthermore, sitemap helped me make a checklist of all the pages to be designed.
Wireframes
Created low-fidelity wireframes to map out the information architecture and identify missing components for small screen devices. These wireframes helped us conduct cognitive walkthrough tests with stakeholders and iterate on the design before moving into high-fidelity mockups. The focus was on ensuring optimal readability and touch targets for the Fitbit's compact display.
Iconography
For small device interfaces, I chose filled icons with consistent visual weight to ensure clarity at small sizes. Each icon was designed on a 24x24 pixel grid with 2px strokes, maintaining uniform thickness across the entire icon set. This pixel-perfect approach ensured icons remained crisp and recognizable on the Fitbit's display, while the foundational grid framework helped maintain consistency throughout the design system.
Key screens
The interface design prioritized ease of use on the small screen format through heavily rounded corners, vibrant gradients, and large touch-friendly icons. Working closely with engineers, I contributed to the front-end development using Fitbit's SVG-based SDK, creating reusable components that matched our design specifications. This hands-on approach helped bridge the gap between design intent and technical implementation.
Accessibility
Accessibility was integral to our design process. We revised the entire color scheme to ensure WCAG 2.0 compliance, achieving at least AA level standards with a 4.5:1 contrast ratio for all typography and iconography. This was particularly crucial for outdoor workers who might view the device in bright sunlight, ensuring the interface remained legible in various lighting conditions.
Touch targets and layout
Balancing generous touch targets with compact layouts was crucial for the small device interface. We standardized all interactive elements to maintain consistent touch areas, ensuring reliable interaction even when workers wore gloves or had sweaty hands. This systematic approach to touch targets significantly improved the app's usability in challenging work environments.
Interactive prototype
Created a fully interactive prototype to demonstrate the complete user flow, from health monitoring to daily task management. This prototype helped stakeholders visualize the end-to-end experience and provided valuable feedback before development.
Motion design
Thoughtful micro-interactions enhanced the user experience without compromising device performance. We implemented subtle animations for button presses and SVG icon transitions, providing immediate feedback while respecting the hardware limitations. These carefully crafted animations made the interface feel more responsive and intuitive.
The final implementation in the production app:
Usability testing
We distributed Fitbit watches to several partner companies for real-world testing. Working with our customer support team, we conducted 6 moderated usability testing sessions with actual workers and managers. While the CS team facilitated the sessions, I observed user behaviors, pain points, and overall experience patterns.
Test findings were compiled using Google's rainbow spreadsheet methodology. We began by documenting participant demographics with color-coded categories:
Before each session, I prepared a list of predetermined observations to track. During testing, I documented which behaviors occurred and prioritized findings based on frequency and impact for the next design iteration.
Key learnings
Technical constraints shape design
Designing for small devices requires significant compromises. We discovered SVG limitations, custom font rendering issues, and screen refresh constraints that forced us to simplify our initial concepts while maintaining core functionality.
Focus on essential workflows
Not every user journey needs extensive documentation. We learned to prioritize mapping critical paths over creating exhaustive frameworks, allowing us to move faster and test ideas with real users.
Informed assumptions accelerate progress
While we didn't have complete visibility into all business goals, making educated assumptions based on user research and stakeholder input helped us maintain momentum and deliver a functional solution within our tight timeline.
This app is currently available for internal enterprise clients only.
Contact Me
I'm currently looking to join a cross-functional team that values improving people's lives through accessible design. or have a project in mind? Let's connect.