Maintenance Monitoring System — Mobile App UI/UX
Mobile UI/UX for an enterprise maintenance monitoring system—schedule inspections, complete audit checklists, attach site photos, and submit signed reports from the field.
- Industry
- Infrastructure / Maintenance
- Role
- UI/UX Designer
- Tools
- Figma
- Duration
- 6 weeks
Maintenance Monitoring System is a mobile app UI/UX design for teams who inspect, check, and document maintenance work across Hong Kong districts—not from a central office dashboard alone.
I designed the full experience for field inspectors and site supervisors: a home view of upcoming inspections and checks, a calendar for planning, structured record detail with photos and reports, digital audit forms with sign-off, and map context for location-based work. The goal was one app that carries an assignment from schedule → site visit → compliant submission.
Problems in the field
Maintenance operations ran on fragmented tools—paper checklists, ad hoc photos, and spreadsheets that never matched what happened on site. Supervisors could not see what was due today; inspectors re-keyed the same location and work-type data on every form.
Audit questions lived in PDFs or email threads, so compliance answers were inconsistent and hard to trace. When leadership asked for proof, teams spent hours reconstructing records instead of pulling a single signed submission tied to an inspection ID.
No single schedule view
Inspectors and checkers missed or duplicated visits because upcoming work was scattered across calls, messages, and desktop systems.
Weak audit trail
Yes/no compliance checks and photos were not bound to one record—raising risk for reviews and regulatory follow-up.
Slow reporting loop
Site data reached management late, so corrective action on failed checks lagged behind real field conditions.
Process and design approach
I mapped the end-to-end flow with product and operations stakeholders, then designed mobile screens around how inspectors actually move through a day: open the app, see what is due, travel to site, complete the checklist, attach evidence, sign, and sync.
Dashboard first
Home surfaces Upcoming Inspections and Upcoming Checking with location thumbnails, dates, and work types—so the next job is obvious without digging into menus.
Calendar + task list
Month view with marked days and a scrollable list (inspection, site check, surprise check) ties planning to execution with IDs and districts such as Causeway Bay.
Record detail & audit form
Information, Photos, and Report tabs on each record; audit screen uses large Yes/No toggles for safety and SOP questions, ending in a clear Sign & Submit action.
Map and records nav
Map view for geo context on active zones; bottom navigation (Home, Calendar, Checking, Inspections, Records) keeps core modules one tap away.
The design gives operations a shared language: every inspection carries a reference ID, location code, district, and work type before anyone attaches photos or answers audit items. Supervisors scan status from the dashboard; auditors open the same record inspectors filed on site.
Structured forms replace free-text guesswork—compliance answers are consistent, timestamped, and tied to sign-off. That cuts back-office reconciliation and makes failed checks visible while teams are still in the field.
The Figma prototype delivers a coherent maintenance monitoring story: schedule, execute, document, audit, submit. Handoff-ready frames cover iOS patterns (status bar, home indicator, tab bar) and a teal-accented system readable outdoors and in vehicle lighting.
The project demonstrates enterprise mobile UI/UX beyond consumer apps—complex data, role-based tasks, and compliance UX suitable for Hong Kong infrastructure and public-sector-style maintenance programs.
Challenges and learnings
The hardest balance was density versus clarity: inspectors need many data fields (location code, district, work type, inspection ID) without a form that feels like desktop software squeezed onto a phone. I used progressive disclosure—summary cards on home and calendar, full detail only when a record is opened.
Audit UX was another constraint: yes/no must be unambiguous with gloves and glare, so toggles are large and high-contrast. If I extended the project, I would prototype offline sync states and supervisor review flows—the next layer for fully rugged field deployment.