Skip to content

UI Evolution

Jutipong Puntuleng edited this page Apr 7, 2026 · 7 revisions

Release 1

Simulation page

Wireframe 1

Proposed to stakeholder based on the provided statement of work.

iteration1

Stakeholder feedback:

  • Remove task bar - it's unlikely to be used, and dispatchers will instead target tasks directly from stations on the map.
  • Generally, keep as much of the map as uncovered as possible.
  • A resources bar makes sense - dispatchers keep an eye on those at all time, particularly to see the tasks in their queue. Everything else is contextual (and doesn't need a "bar").
  • Originally expectation was for resource bar to be on the bottom, but its placement on the right makes sense.
  • The left of the screen should have scenario information, and time (and other) controls.
  • On the left, also put selected-item details (instead of on the bottom).

Wireframe 2

iteration2

Release 2

HQ Widget

Wireframe 1

r2-i1-1 r2-i1-2 r2-i1-3

Stakeholder feedback:

  • Dispatchers don't care to see details of vehicles at HQ in the vehicle bar - only vehicles that are in use.
  • Dispatchers might care to see how many vehicles are idle at HQ.
  • Dispatchers might care to know about drivers whose shifts are starting soon.

Wireframe 2

r2-i2

All Routes Toggle

Wireframe 1

Initial UI without a global route toggle.

r2-i3-1 r2-i3-2

Wireframe 2

Introduced a global route visibility toggle. Proposed to stakeholders; no feedback was raised and the design was accepted as-is.

r2-i4-1 r2-i4-2 r2-i4-3

Release 3

Simulation Page

Wireframe 1

Initial UI without a metric report.

Simulation Page

Wireframe 2

Introduced a metric report to provide detailed simulation insights for users.

Stakeholder feedback:

  • Removed the “Update” column, as it did not provide significant information.
  • Add a simulation progress percentage so dispatchers can track progress and better interpret metrics before resuming.
mockup4 1

Clone this wiki locally