
Internal staff platform for a vehicle service centre and a vehicle warehouse: gate check-in and check-out, a 20,000-row movement log, customer and vehicle registry, roles and permissions, notification centre and exportable reports in Arabic and English
Zotic runs two very different vehicle sites: a service centre where reception registers customers and their cars before every visit, and a warehouse where a gate operator has to move hundreds of vehicles in and out as fast as possible.
Both were logging arrivals and departures in notebooks and WhatsApp groups.
Nobody could answer how many vehicles were on site right now, when a specific car left, or who recorded it.
The same customer existed three times with three spellings.
Staff moved between sites, but access rules lived in people's heads.
Managers wanted one movement log they could search, filter and export, one place to send notifications, and one administration for staff, roles and locations, without forcing the warehouse gate to use the slower service-centre workflow.
The whole system had to be Arabic-first with a proper English mode, work on a phone at the gate, and be operable by keyboard alone.
Public landing page (Arabic)
We built the platform on Angular 22 with a Material 3 theme generated from the Zotic brand colours and the Tajawal and Inter typefaces bundled locally.
The service centre and the warehouse are modelled as two locations with their own dashboards, movement logs, check-in and check-out screens, customers and vehicles, while a super admin sees a combined overview across both.
Check-in and check-out validate the vehicle state and reject impossible moves such as checking out a car that never arrived.
Every movement lands in a log that stays fast at 20,000 rows on the demo day with search, filters, sorting, paging and a detail drawer.
The customer and vehicle registry links each plate to its owner and full history.
A notification centre carries badges, mark-as-read and deep links, and site managers can send notifications to staff.
Administration covers users, roles with a permission matrix, and locations, and changes apply to the affected staff immediately.
Reports aggregate movements by day and location with CSV export and print layouts.
Settings control language, density, timezone, the demo day and the dataset profile, including a large-warehouse performance profile and a full reset.
The app renders Arabic RTL and English LTR, scales from desktop down to 360-pixel phones, and every action can be completed with the keyboard.
Authentication and role checks are simulated in the browser for the demo and the .NET API boundary is documented for the production backend.
Two operationally separate locations, a service centre and a warehouse, under one administration, staff directory, roles and notification centre
Gate check-in and check-out workflow with state validation and rejection of impossible movements
Movement log that stays responsive at 20,000+ rows with search, filters, sorting, paging and a detail drawer
Customer and vehicle registry linking every plate to its owner, location and full movement history
Per-location dashboards with entries today, exits today, vehicles present now and movements by hour, plus a combined super-admin overview
Six roles and personas from super admin to gate operator and read-only auditor, with a permission matrix editable at runtime
Notification centre with badges, mark-as-read, deep links and manager-sent notifications
Reports by day and location with CSV export and print layouts
Settings for language, density, timezone, demo day and dataset profile, including a large-warehouse performance scenario and full reset
Arabic RTL and English LTR, responsive from desktop to 360-pixel phones, fully keyboard-operable
Material 3 theme generated from the Zotic brand palette with Tajawal and Inter bundled locally
46 unit tests and 24 real-browser Playwright tests covering screens, responsiveness and keyboard operation
Want to help build the next one? See open engineering, design, and sales roles →