Timeline

Project Duration — 12 Weeks of Iterative Design

The project spanned twelve weeks, from early August to late October, following a structured workflow that combined research, design, and continuous collaboration with Urbix Hub.

Phase 1 — Defining Scope & Research Foundations

It began with defining the project scope and selecting the Driver Well-being App brief, followed by intensive research on gamification frameworks and competitor benchmarking to establish a clear direction.

Phase 2 — Wireframing & Collaboration

Midway through the project, a set of low-fidelity wireframes was created and shared with Urbix Hub for feedback. Regular meetings ensured the design aligned with both user needs and Urbix Hub’s goals.

Phase 3 — High-Fidelity Design & Component Library

After incorporating review feedback, a complete component library and high-fidelity prototype were developed, fully aligned with Urbix Hub’s brand guideline and visual identity.

Phase 4 — Final Documentation & Delivery

The final stage focused on compiling a detailed UI/UX Strategy Document and preparing all deliverables, which were officially presented to Urbix Hub in late October.

Research

Before developing the design, I conducted research to understand the target users — professional commercial drivers — and the challenges they face in daily operations.

According to Urbix Hub’s Commercial Driver User Profile, most users are male drivers aged between 35 and 55, often experiencing fatigue, stress, and a sense of being constantly monitored by traditional telematics systems.

My research focused on three main aspects:

1. User Needs & Pain Points — fatigue, monotony, lack of recognition, and mistrust toward monitoring tools.

2. Gamification Frameworks — applying Yu-kai Chou’s Octalysis Framework to connect motivational drives (achievement, relatedness, and autonomy) to app features.

3. Competitor Benchmarking — reviewing apps such as DriveHero, Brightmile, and Safe2Save to identify best practices for reward systems and safe-driving feedback.

These findings directly informed the user flow and feature prioritization of Cash OTG, ensuring that every gamified element supports genuine well-being rather than superficial engagement.

User Flow

This user flow illustrates the interaction logic and feature structure of the Cash OTG app across two design iterations, showing how functionality evolved from the first prototype to a refined version.

Establishing Core Features

The blue sections represent the first version, which built the foundation of the app: onboarding, basic setup, hydration tracking, and ranking views. This version defined the essential driver experience and established navigation logic for key functions.

Expanding Engagement & Functionality

The orange sections belong to the second version, introducing new modules such as the dashboard view, stretching activities, monthly challenges, and reward redemption. These additions enriched engagement and encouraged consistent interaction through gamified incentives.

User Flow 2.0

The grey sections, also originating from the V1.0, were modified or replaced during the second iteration.They reflect ongoing design refinement, user feedback implementation, and improved interaction logic to streamline usability.

User flow diagram:

Wireframe

From Flow to Structure

Building on the initial user flow, I created a series of low-fidelity wireframes in Figma to visualize the structure of each key feature within Cash OTG — including onboarding, hydration reminders, safe-driving score tracking, and the team leaderboard. These early sketches defined how core functions connect across the app.

Focus

At this stage, the focus was on layout clarity, accessibility, and ease of navigation, ensuring every interface element could be easily understood and operated by commercial drivers with different levels of digital literacy. Large buttons, clear labels, and linear task flows were prioritized to minimize friction during in-vehicle use.

Refining Structure

After presenting the wireframes to Urbix Hub’s design team and classmates, I incorporated their feedback to improve information hierarchy, enlarge key touch targets, and simplify navigation paths. This iteration process helped validate usability and reinforced the driver-centered design goals.

Foundation for High-Fidelity Design

These refined wireframes formed the structural foundation for the upcoming high-fidelity prototype, aligning information architecture and interaction flow before integrating the brand’s visual identity and style system.

Wireframe V1 and V2:

High-Fidelity Design & Visual System

From Wireframe to Visual System

After finalizing the low-fidelity wireframes, I developed the high-fidelity prototype of Cash OTG, transforming the structural layout into a cohesive visual system that reflects Urbix Hub’s brand identity.

Each screen was designed to balance clarity, motivation, and professionalism, ensuring usability both on and off the road.

Collaboration with Urbix Hub: Refining the Brand Direction

The Urbix Hub's designer Bhuvanesh provided the brand guideline, I refined the visual direction through adjustments to color contrast, typographic hierarchy, and component spacing to enhance readability and in-drive usability.

My suggestions for improving the color palette, particularly balancing deep navy, vibrant teal, and accent magenta—were incorporated into Urbix Hub’s final brand system, creating a look that feels both professional and energetic, tailored to the mindset of commercial drivers.

The design system:

Interface Design

The high-fidelity prototype integrates all key modules, including:

• Dashboard — a performance overview with progress indicators and daily summaries.

• Hydration Reminder — quick-access cards for healthy habits.

• Driving Score Tracker — clear visualization of performance metrics.

• Leaderboard & Rewards Section — structured layouts for recognition and incentives.
  Every screen follows a consistent design language, using bold typography, clear data visualization, and minimal distractions to maintain focus and usability.

The interface (Dashboard / Score / Leaderboard / Rewards / Badges/ Wallet):

Gamification Design

During this stage, I also designed two sets of digital badges as part of the app’s gamification system, rewarding milestones in safe driving and health maintenance.

These badges were crafted to represent progress and mastery—aligning with Urbix Hub’s philosophy of positive reinforcement over competition, encouraging users to see improvement as empowerment rather than rivalry.

Testing & Feedback

User testing session focused on evaluating clarity, interaction flow, and usability during in-drive operation — ensuring that the interface remained intuitive and distraction-free.

One key suggestion was related to the hydration logging interaction: instead of tapping on the water-drop icon to record drinking activity, users recommended replacing it with a clearer “add” button to avoid accidental taps and make the action more explicit.

Outcome & Reflection

Project Deliverables

The Cash OTG project concluded with the delivery of a comprehensive UI/UX strategy document, a high-fidelity interactive prototype, and a full design asset package prepared for Urbix Hub’s development team.
These materials provided a ready-to-develop foundation and clear design specifications for implementation.

Design Impact

• Demonstrated the synergy between gamification and well-being features
  Showed how positive reinforcement can effectively motivate professional drivers without adding cognitive load.

• Validated the power of subtle behavioral cues
  Small design elements such as progress rings, achievement badges, and reward prompts proved to increase engagement and satisfaction.

• Maintained simplicity and clarity
  Reinforced that effective gamification doesn’t require complexity — usability and focus remain central to motivation.

Collaboration with Industry

Throughout this project, I worked closely with Urbix Hub leadership and their in-house designer, conducted preliminary research and had multiple discussions on how to implement gamification with well-being features without disturbing drivers. The team is very satisfied on the design deliveries and impressed on the clarity, practicality, and adaptability of my design, and several elements—such as the dashboard layout and final color palette—were officially adopted into Urbix Hub’s internal design system.

Reflection

This project was a valuable opportunity for me to grow as a Lead UX designer on an industry collaboration.
It strengthened my understanding of behavioral design principles, design system thinking, and cross-functional communication.

Working directly with Urbix Hub’s team taught me how to explain design rationale clearly, receive and apply feedback effectively, and balance creativity with real-world business goals.

It marked an important step in improving both my professional design skills and collaboration confidence.

Next step

Urbix Hub’s Roadmap

With the design phase completed, Urbix Hub plans to move the Cash OTG prototype into development, integrating it with the company’s existing fleet training and telematics ecosystem.

In the next stage, Urbix Hub will conduct pilot testing with selected fleet partners in the EU to evaluate the app’s impact on driver engagement, safety scores, and overall well-being. The results will guide refinements to gamification balance, notification timing, and dashboard personalization in future updates.

Designer’s Vision

From my perspective as the designer, there are opportunities to further explore adaptive motivation systems—allowing the app to dynamically adjust challenges, prompts, and feedback based on driving behavior and fatigue levels.

Future Outlook

In future iterations, I would focus on expanding Cash OTG beyond the mobile app through cross-platform integration—such as smartwatch syncing or in-vehicle display compatibility—to make well-being support more accessible during real driving conditions.

Additionally, enhancing the well-being module with features like mood tracking, rest optimization, and micro-break suggestions could evolve the product into a comprehensive driver wellness ecosystem.