Design a complete 26-page web and mobile operations platform called "10 Cent Tom Operations" for a Gold Coast disability social enterprise and container recycling charity. Reference brand: 10centtom.com.au — warm, green, community-driven, charity feel. Two portals: Admin (desktop 1440px, left sidebar) and Employee (mobile 390px, bottom tab bar).
Design System: Primary green #2E7D32, action green #4CAF50, light green bg #E8F5E9, amber #F9A825, red alert #E53935, off-white bg #F5F5F5. Font: Nunito or DM Sans, rounded, friendly. Admin sidebar items: Dashboard, Routes, Clients, Payroll, Leads, Employees, Scheduling, Reports, Voice Calls, Notifications, Settings. Employee tabs: My Route, Clock In/Out, My Hours, My Points, Profile. Status badges: Draft=grey, Published=blue, In Progress=green, Completed=dark green, Flagged=amber, Rejected=red. Service tier badges: Blue, Double Blue, Silver, Gold, Platinum.
P-01 Login: Centered card, coin logo, email + password, green login button, forgot password link, role-based redirect (Admin→Dashboard, Employee→My Route), error state.
P-02 Forgot/Reset Password: Request reset via email, reset form with password strength indicator, success confirmation, back to login.
P-03 Admin Dashboard: Metric cards (bins today, bins this week, active drivers, waste flags). Live driver progress panel. General waste alert panel. Contract renewal amber banner. New leads count. Points leaderboard top 3. Inbound calls panel. Exception flags. Quick actions: Publish Routes, Approve Hours, View Leads.
P-04 Route Manager — Shift List: Date picker, Auto-Generate Week button, Bulk Publish button. Shift cards showing name, day, type, driver, stop count, status badge. Edit/Publish/View actions.
P-05 Route Manager — Route Builder: Drag-and-drop stop list (stop number, client, address, bin count). Add stop search, driver assignment, multi-trip depot-return toggle, shift type selector, Publish and Print PDF buttons.
P-06 Route Manager — History: Filter by date, driver, shift type. Table with completion rate, waste flags per route. Row expand for stop-by-stop detail. Export CSV.
P-07 Client List: Search and filters. Table: name, suburb, collection day, tier badge, contract expiry, payment status, active/inactive. Amber row for renewals due, red for non-payers. Bulk deactivate. Export CSV.
P-08 Client Detail: Profile card (name, address, bins, tier). Contract dates + renewal countdown + manual reminder buttons (60-day, 30-day). Payment status. Communication history timeline. Pickup history table. Generate Annual Impact Report PDF button.
P-09 Payroll — Hours Review: Week picker. Employee × day table with hours. Amber cells for threshold breaches (standard >5hrs, full day >9hrs, double-Friday >15hrs). Red for missing clock-outs. Approve, Reject, Edit per row. Approve All button. Audit trail panel.
P-10 Payroll — Xero Push: Last push status card. Push to Xero button. Error log with retry. Push history table with per-employee breakdown.
P-11 Lead Manager: Kanban pipeline (New, Contacted, Converted, Lost). Lead cards with drag between stages. Slide-in detail panel with admin notes, automated sequence status, Convert to Client button. List view toggle.
P-12 Employee & Volunteer Manager: Two tabs (Employees / Volunteers). Table with name, role, status, points, Star Employee badge. Add forms for each type. Side panel with notes split into Financial tab (admin only) and General tab (both).
P-13 Scheduling: Weekly calendar, drivers as rows, Mon–Fri columns. Colour-coded shift blocks. Click to create, drag to reassign. Conflict warning if double-booked. Driver availability indicators.
P-14 Reports: Tabs for Daily, Weekly, Monthly, Driver Performance, Route Efficiency, Annual Impact, Grant Export, Payroll. Each with date filters, summary cards, data table or chart, export button.
P-15 Voice Agent (Addon): Inbound call log — priority pinned top, classification badges, transcript snippets, acknowledgment status. Outbound log with outcomes. Filters and search.
P-16 Staging & Go-Live (Internal): Server status, deployment checklist, integration test results, UAT feedback form, open issues list, go-live readiness checklist, sign-off button.
P-17 My Route (Employee Mobile): Shift header + progress bar. Numbered stop cards (client, address, bin count). Tap to complete → inline form (bins/bags count, general waste YES/NO toggle, notes). Completed stops collapse with green checkmark. Real-time update banner. Print run sheet button.
P-18 Sign In / Sign Out (Mobile): Large Clock In/Out button with live elapsed time counter. Today's hours summary. Week history with approval status badges per day.
P-19 My Hours (Mobile): Weekly daily breakdown with approval badges. Tap flagged entry to see admin note. Previous weeks via scroll.
P-20 My Payroll (Mobile): Pay period selector. Hours logged, approved, pending summary card. Week-by-week breakdown. Own data only. Export button.
P-21 My Points & Leaderboard (Mobile): Points hero card with monthly total and Star Employee badge. Per-run points history. Monthly bar chart. Team leaderboard (if admin enabled) — rank, name, points, current user highlighted.
P-22 My Profile (Mobile): View-only personal info. Change password form. General notes tab only (Financial hidden). Notification preference toggles.
P-23 My Notifications (Mobile): Notification list with icons, timestamps, unread dots. Tap to navigate. Mark as read / mark all read. Unread count on tab bar.
P-24 Admin Notifications: Same as P-23 but admin alert types — route exceptions, missing clock-outs, renewals, new leads, Xero push results. Category filter tabs.
P-25 Account Settings (Shared): Edit profile, change password with strength bar, role badge read-only, notification preference toggles.
P-26 Platform Settings (Admin only): Collapsible sections — company profile, integrations (Xero, Messenger, GHL, Email/SMS each with status + re-auth), notification email templates, voice agent settings, gamification (points per stop, Star Employee threshold, leaderboard toggle), payroll thresholds, timesheet approval roles, annual report trigger month.
All 26 screens must share one consistent design system. Admin screens desktop 1440px. Employee screens P-17 to P-23 mobile 390px. Export ready for Figma.
Login
Comments (0)
No comments yet. Be the first!
Sign in to leave a comment
My RouteRT-0427
Thu, 5 Jun 2026
12 stops
Active
Elapsed03:34:01
Stops Completed7/12
2/6 stops done
1
42 Marine Parade, Southport QLD 4215
Pickup07:30 – 08:00
Completed07:42 AM
ContactMargaret Chen
InstructionsRing doorbell twice, wait for gate to open
Items
10c Containers240
Glass Bottles85
Bins are behind the side gate. Key code: 4821
2
18 Kurrawa Drive, Broadbeach QLD 4218
Pickup08:15 – 08:45
Completed08:28 AM
ContactBroadbeach Community Centre
InstructionsEnter via rear loading dock on Victoria Ave
Items
10c Containers310
Aluminium Cans120
Plastic Bottles65
3
7 Tallebudgera Creek Rd, Burleigh Heads QLD 4220
Delivery09:15 – 09:45
ContactTom Harrison
InstructionsPark in visitor bay, reception will direct you
Items
Collection Bags (pack of 50)2
New client — confirm bin placement with owner
4
22 Palm Beach Ave, Palm Beach QLD 4221
Pickup10:00 – 10:30
ContactBetty Wilson
InstructionsBins kept in carport, look for the yellow lid
Items
10c Containers195
Glass Bottles42
Resident has mobility issues — offer to bring bins to kerb
5
89 Gold Coast Hwy, Tugun QLD 4224
Delivery10:50 – 11:20
ContactTugun Recycling Hub
InstructionsDeliver to warehouse door B, see shift supervisor
Items
Large Wheelie Bins3
Collection Bags (pack of 50)1
Safety Gloves (box of 100)1
6
14 Duranbah Road, Coolangatta QLD 4225
Pickup11:40 – 12:10
ContactCoolangatta Surf Club
InstructionsUse service lane behind the club, bins near kitchen exit
No comments yet. Be the first!