Darter is a trusted, specialized B2B route optimization platform managing the complex transport for partner companies, ensuring radical efficiency in life-critical scheduling. Our professional drivers must communicate their real-time availability status when they are between scheduled trips. This signal is crucial: it instantly integrates the driver into Darter's powerful engine, guaranteeing they are matched with highly optimized on-demand assignments, directly upholding Darter's mission of peak efficiency.
Problem
The current system, which may rely on background checks, logging in/out, or automatic assignment logic, presents several Problem:
Lack of Driver Control
Drivers currently lack a simple, explicit, and visible way to signal their immediate readiness (or unavailability) to accept trips. This leads to confusion and frustration.
Ambiguity
Drivers are often assigned trips when genuinely unavailable, leading to systemic inefficiency and customer dissatisfaction. High Rejection Rates, Longer wait times
Psychological Frictions
The ambiguity of availability creates a stressful experience for drivers, who feel they must constantly monitor the app. for ignoring trips they couldn't possibly accept.
Desk Research
The Evidence
To conquer our UI/UX obstacles, we conducted focused desk research to establish the fundamental truths necessary for the design. This evidence will directly inform the solution.
Principles
The research confirms that an instantaneous toggle is the correct interaction pattern. To eliminate all ambiguity
Clarity
Our analysis of high-visibility mobile interfaces confirmed 3 placement prioritizing maximum accessibility: Top Bar, Bottom Bar, or Floating Action Button
Interaction
The interaction must be both effortless and safe: Tap Area Size, Immediate Feedback, Strategic Friction (To prevent accidental action)
Design Exploration: Control Placement
Explore where on the Driver App Home Page this control should live. It's need to be accessible and visible on all the possible cases.
Placement Exploration
Idea: Navigation Overhoul
The current navigation isn’t intuitive, with icons that don’t clearly represent their functions, leading to confusion and slower decision-making. A redesigned, more descriptive navigation can greatly improve clarity, usability, and overall task efficiency.
Navigation improvement process
Design Exploration: Utilizing Color
I will strategically utilize color to define every state of the availability switch, transforming it from a simple indicator into a high-confidence communication tool. This approach ensures instant clarity and minimal cognitive load for the Drivers
Exploration: Utilizing color
Interaction Exploration
Create every state and build a fully interactive prototype that mirrors real user flows. This helps validate assumptions early, uncover usability gaps, and gather meaningful feedback from both the team and users before moving into refinement.
Option 1
Option 2
Option 3
Move Forward with Option 3
After discussing the options and gathering feedback, the team decided to move forward with Option 3. It stood out because the placement stays out of the way, the interaction is clear, and drivers can recognize the status instantly at a glance. It’s the option that keeps everything clean, readable, and practical in real use.
Opyion 3
Idea: How to make the CTA literally "Call"
I wanted the main action—calling the driver—to feel unmistakably clear without disrupting the rest of the interface. So I explored a subtle but attention-grabbing approach: an animated gradient. I built a Lottie version to test the motion and integrated it into a new prototype. The result is a button that naturally draws the eye, signals its importance, and still stays harmonious with all other components.
CTA Enhancement
Final Touch: End to End Interaction
In the final prototype, I mapped out the complete flow of a driver going online and then returning offline. I wanted the transitions to feel smooth and predictable, so the team could clearly see how each state changes in real time. This walkthrough gives a simple, end-to-end view of how the interaction will look and feel once implemented.
Final Interaction
Result
The new design successfully transformed the availability control into a high-confidence tool, delivering two key impacts:
Eliminating Ambiguity
The enhanced dedicated toggle (providing a simple, explicit control) combined with strict Color and instant feedback ensures the Clarity of Driver status.
For Driver: Full confidence and control over their status with instant clarity at a glance. This eliminates the frustration of being assigned trips when genuinely unavailable..
For Business: A critical reduction in systemic inefficiency, minimizing trip rejections and providing high-fidelity data that leads to more reliable, faster service times.
Fostering Driver Trust
The design provides clarity on driverstatus (Online/Offline) and optimal placement for accessibility without clutter. Crucially, the interaction requires a intentional tap (supported by distinct haptic/visual feedback) to effectively prevent unintentional status changes.
For Driver: Eliminates the need for constant monitoring; drivers feel psychologically freed when Offline. The deliberate tap ensures they trust the system and reduces accidental trip assignments.
For Business: Better driver retention and a more focused workforce, as the system minimizes frustration caused by unexpected assignments.
I optimized driver availability control. This intuitive, user-centric design boosts efficiency, enhances clarity, and enables better, faster service delivery.