Browse the field guide

Field guide / Use the app

Appearance & interaction

Choose a theme, use comfortable controls, and make the interface fit the way you work.

A theme is one choice

The app’s theme palette controls color consistently across navigation, key actions, fields, surfaces, and diagrams. Choose the overall theme instead of adjusting individual tokens.

The palette names reflect the tool’s visual language:

  • Workshop: warm amber, graphite, and limestone.
  • Blueprint: a cooler blue emphasis.
  • Field: a green emphasis.

Appearance mode is a separate choice: System, Light, or Dark. System follows the phone. A dark theme should retain readable labels, visible boundaries, and enough contrast in drawings.

Controls with room around them

The calculator uses a generous number pad and visible unit controls. Common actions should be reachable without depending on a tiny icon or a hidden gesture.

Touch targets and the visible shapes do not have to be identical. A small icon can sit inside a large accessible button. The important thing is that the interactive region is predictable and has enough separation from neighboring actions.

Feedback should answer a question

Press feedback confirms that a key was registered. A saved-state message confirms that a calculation was retained. An error points back to the input that needs attention.

Animations should explain a surface opening, a selection changing, or a result arriving. The interface should remain understandable with motion reduced or disabled.

Haptics

Haptic feedback can reinforce a key press or successful action. Turn it off in Settings when you prefer a quieter interaction. Haptics are an enhancement; visible feedback still needs to explain the result.

Larger text and assistive technology

Use the phone’s text-size settings when needed. The app should allow labels and results to reflow instead of clipping them. Results and field descriptions remain useful without relying on a diagram alone.

Before store release, the app should be checked on real devices with VoiceOver and TalkBack, large text, both appearance modes, and a range of screen sizes. See the website’s accessibility page for the project’s current approach.

NEXT IN THE GUIDEHow the app is built