Bagisto Delivery Boy App & Web Portal
A comprehensive end-to-end logistics platform engineered for both web dispatchers and mobile delivery partners. Features real-time order dispatching, web warehouse item collection, turn-by-turn mobile GPS navigation, OTP customer handoffs, and COD payment settlements.
Organization
Webkul Software
Role
Lead UI/UX Designer
Duration
5 Weeks
Core Focus
- Web Dispatcher Portal
- Mobile Driver UX
- OTP & COD Verification
Information Architecture
Dual sitemap connecting central web admin dispatchers with mobile field delivery partners.
Design Process
My process is a blend of creative exploration and structured problem-solving, ensuring every pixel serves a purpose.
Understand the Problem
Align on field logistics bottlenecks, dispatcher goals, outdoor mobile constraints, and delivery SLA metrics.
Research
Understand delivery drivers and web dispatchers through ride-along research, interviews, and fleet shadowing.
Define
Clearly define driver & dispatcher personas, OTP hand-off journeys, and route navigation success criteria.
Ideate
Brainstorm creative solutions, real-time map tracking user flows, and high-contrast outdoor UI sitemaps.
Wireframe
Create low-fidelity layouts for single-hand mobile driver actions and multi-order dispatcher dashboards.
Prototype
Build high-fidelity web and mobile interactive designs to simulate real-time parcel handoff and COD collection.
Test & Iterate
Validate with active field drivers under direct sunlight and high-glare conditions, refining tap target sizes.
Handoff
Prepare developer-ready web & mobile design specs, documentation, and logistics design system components.
User Personas
Target dispatcher and field delivery partner profiles shaping the Delivery Boy platform UX.
Vikram Singh
Full-Time Delivery Executive
Key Pain Points
- Difficulty reading screen details under bright direct sunlight while driving.
- Accidental order rejections due to tiny tap targets on motorcycle mount setups.
- Delays caused by manual address searching without integrated turn-by-turn navigation.
UX Design Solution
A high-contrast outdoor mobile app featuring a prominent swipe-to-accept bar, 56px touch targets, and single-tap GPS navigation.
Rajesh Sharma
Warehouse Logistics Dispatcher
Key Pain Points
- Lacking real-time visibility over field driver locations and active delivery statuses.
- Manual phone calls required to handle customer address changes or unavailable recipients.
UX Design Solution
A web dispatcher dashboard providing real-time GPS fleet tracking, instant driver messaging, and automated item collection checklists.
Market Positioning & Key Metrics
Logistics platforms often overcomplicate interfaces. This platform balances powerful web administration controls with lightweight, single-tap mobile execution.
Key Strategic Differentiator
“Unified web & mobile ecosystem featuring high-contrast outdoor UI and instant OTP verification.”
98%
Acceptance Rate
+24%
Delivery Speed
High
Tap Accuracy
4.9 / 5
Driver Rating
Design System Foundations
A unified web and mobile visual design system built for high-contrast outdoor readability and efficient warehouse operations.
Color System
Amber Signal
#F59E0B
Dark Canvas
#09090B
Card Slate
#18181B
Bright White
#FFFFFF
Typography
Button System
Iconography
Domain iconography matrix designed for high-density navigation, action triggers, and metadata badges.
Home Feed
Orders
Driver Profile
GPS Tracking
Payouts
Call Customer
In-App Chat
Notifications
Shift Schedule
Delivery Time
Parcel Box
Processing
Delivered
Filter Orders
Sort Distance
Language
Logout
Driver Rating
User Account
Upload Proof
View Details
Cancel
Delete
Send Route
Email Support
Back
ForwardWeb Interface
Centralized web control dashboard enabling logistics managers to monitor active orders, assign drivers, verify item collection, and settle COD payments.
Logistics Fleet & Dispatcher Dashboard
Real-time dispatch control center displaying active delivery volume, driver availability maps, and pending order allocations.
Active Delivery Orders Management
Comprehensive order tracking table with status filters, courier assignment dropdowns, and address validation.
Warehouse Item Collection Checklist
Itemized warehouse pick list ensuring zero missed items prior to driver dispatch.
Customer Address & Location Detail View
Granular delivery address inspector with map previews, delivery instructions, and customer contact triggers.
Customer Hand-off & OTP Verification
Secure delivery hand-off interface with real-time OTP confirmation and proof-of-delivery logging.
Cash on Delivery (COD) Payment Collector
Financial reconciliation table tracking daily cash collected by drivers and automated bank deposit settlements.
Dispatcher & Driver Live Messaging Hub
Instant two-way communication channel between warehouse dispatchers and mobile drivers on the road.
Logistics Portal Sign-In
Secure authentication gateway for logistics administrators and warehouse staff.
Mobile Application Interface Screens
High-fidelity mobile app interfaces engineered for responsive touch controls, micro-interactions, and accessible visual hierarchy.
Mobile Sign-In
Driver Duty Dashboard
Active Delivery Orders
Warehouse Item Collector
Customer Address Info
Mark Location Reached
OTP Handoff Verification
Order Delivered Status
Dispatcher & Customer Chat
Push Notifications Hub
Unreachable Customer Report
Driver Profile & Earnings