17Example product screens
Screens
21 SURFACES · LIVE HTMLFRAMES LOAD LAZILYCAPTURES: screenshots/
Each screen is real markup from the component library, embedded here as it would be built. Operational screens prioritise function; imagery appears where it earns its place and nowhere else.
Primary surfaces17.01
Today — light
What matters now. One statement, the running task, what needs you, the composer. Nature appears once, at the top, and only here.
screens/today-light.htmlOpen ↗Today — dark
Same surface on carbon. Imagery re-maps to Nous; Vermilion lifts.
screens/today-dark.htmlOpen ↗Milo conversation — light
Persistent conversation and delegation. Artifacts emerge from turns; context line shows project and executor.
screens/milo-light.htmlOpen ↗Milo conversation — dark
Dark set. Milo's turns keep the ◉ in Vermilion.
screens/milo-dark.htmlOpen ↗Goals
Long-term outcomes in serif. Projects hang beneath each goal; nothing else.
screens/goals.htmlOpen ↗Projects
Bodies of work advancing goals. Rows with progress bars; one running state per row.
screens/projects.htmlOpen ↗Project detail
ProjectHeader, task rows, the artifacts the project produced. One primary action: New task.
screens/project-detail.htmlOpen ↗Tasks
Concrete things to accomplish, tabbed Open / Running / Done. Rows summarise; disclosure reveals the run.
screens/tasks.htmlOpen ↗Task detail
The expanded level: Task → Run → Step → Executor → Artifact. Pause is on the run it pauses.
screens/task-detail.htmlOpen ↗Work / artifact
The actual artifact environment. ArtifactHeader with provenance; the file opens in a real application.
screens/work-artifact.htmlOpen ↗Activity
What Milo is doing and has done, by time. Vermilion rows are Milo's; Moss rows are Offline's.
screens/activity.htmlOpen ↗
Secondary surfaces17.02
Resource ledger / Costs
Metrics, quotas and cost by lane. Local is $0 and says so with ⌁.
screens/costs.htmlOpen ↗Fleet
Machines in Moss. Where Milo is running, Vermilion enters the Moss field.
screens/fleet.htmlOpen ↗Connections
Services and accounts with connected / not-signed-in states. Function first.
screens/connections.htmlOpen ↗Settings
Fields and switches on rules. Few settings, because Milo decides what it can.
screens/settings.htmlOpen ↗
Transient controls17.03
Voice states
The five states of the pill over a live surface.
screens/voice-states.htmlOpen ↗Quick Entry
Invoke, type, submit, disappear.
screens/quick-entry.htmlOpen ↗Permission request
Level 3 ask with a scrim; level 4 for spend and destruction.
screens/permission.htmlOpen ↗
Galleries and engine17.04
Art gallery
Original beside Milo interpretation; artist, title, institution and rights on every work.
screens/art-gallery.htmlOpen ↗Nature gallery
Original, National Park, Nous, Archive, Field Study.
screens/nature-gallery.htmlOpen ↗Image engine
The advanced playground, where technical flexibility belongs.
screens/image-engine.htmlOpen ↗