How Settings is organised (the legend)

An info modal behind the ⓘ on the Settings title that explains the category → tab → section → subsection vocabulary with little replicas of the real UI.

What it is

A visual legend describing each of the five categories, what lives in it and why, plus faithful mock-ups of a section heading (dark numbered box) and a subsection heading (inverse lettered box) so the numbering people see on screen has a name.

Also called: settings map · settings help · what do the numbers mean · settings tour

See it
How Settings is organised (the legend)
Day rate
$500
Days figured
11
Crew size
3
Fuel & equipment
$300
Finished 2 days early — $1,400 back to the crew
The modal open, showing the five category cards and the numbered/lettered heading replicas with accent tags. SettingsGuideModal.tsx. Sample data — no customer information appears here.
How it works
  1. 1Clicking the ⓘ next to the Settings heading opens SettingsGuideModal.
  2. 2Each category renders its name, its tab list and a plain-English description of what belongs there.
  3. 3Miniature replicas with floating accent tags label each layer of the hierarchy.
Why we built it

The comment states the goal outright: the hierarchy vocabulary should become something the whole team can use to give directions — 'Communications › Notifications, section 2'. Without shared words, support conversations and internal handoffs turn into screenshots.

The problem
  • There was no shared way to name a location inside Settings when giving someone directions.
Sound familiar?
What you get
A team can say a settings address out loud and both people land in the same place.

See it on your own jobs

Twenty minutes, your numbers, no slide deck. We’ll build one of your real buildings in front of you and send you the estimate link at the end — yours to keep either way.

or keep browsing features →