Vision Board
Feature handbook for the Vision (V/TO) module: terminology, behavioral rules, screen and CTA flows, a state diagram, and the known gaps.
Vision (V/TO) · Prototype / in build
| Module | Surface | Status | Doc version |
|---|---|---|---|
| Vision (V/TO) | Sidebar → Vision | Prototype / in build | v0.1 — extend below |
1 · Purpose & context
RunOlga is an AI-assisted operating system modeled on EOS (the "Traction" framework). The Vision Board is the digital Vision / Traction Organizer (V/TO) — the single page that captures what the company believes, where it is going, and how it will get there. Every other module (Rocks, Scorecard, Meetings) is meant to ladder back up to this page.
This document scopes the Vision module only. It describes current behavior as built, flags where the build is incomplete, and gives QA concrete expected-results to test against.
2 · Glossary of terms
| Term | Definition |
|---|---|
| V/TO | Vision / Traction Organizer. The EOS artifact this whole page represents. |
| Vision Board | The Vision screen as a whole — the grid of category cards. |
| Category / Card | One section of the V/TO, rendered as a card: Core Values, Core Focus, 10-Year Target, 3-Year Picture, 1-Year Plan. |
| Vision Item | A single entry inside a category (one value, one milestone, the target sentence, etc.). |
| Type | The category an item belongs to, chosen in the Add modal. Determines which card it lands in. |
| For Team | Which team the item belongs to (Leadership, Operations, Care Delivery, Whole Company). Captured but not yet shown — see §7. |
| Owner | The accountable person. Captured but not yet shown — see §7. |
| Create more | Modal toggle. When ON, the modal stays open after Add and switches to multi-add (staging) mode. |
| Staged item | An item created in Create-more mode that sits in the side column. Not yet on the board. |
| Confirm (green check) | The per-staged-card toggle that actually places the item onto its category card (or pulls it back off). |
| Olga suggestion | The contextual nudge shown in single-add mode. Currently canned per Type — not live AI. |
3 · The five categories
Each category card has a fixed data shape. The Type dropdown maps one-to-one to a card, and the shape decides how an added item is written.
| Card (Type) | Shape | Add behavior |
|---|---|---|
| Core Values | List of strings | Appends the title as a new line. |
| Core Focus | List of label/value pairs | Appends a pair: label = title, value = description (or "—" if blank). |
| 10-Year Target | Single text | Replaces the existing target with the title (destructive — see §7). |
| 3-Year Picture | List of strings | Appends the title as a new line. |
| 1-Year Plan | List of strings | Appends the title as a new line. |
4 · Feature flows
4.1 — Inline edit (existing items)
- Hover any category card → a pencil appears top-right.
- Click it → the card flips to edit mode (inputs per item).
- Edit text in place; remove an item with ×; add a blank with + Add item.
- Click Done → card returns to read mode. Changes are live.
4.2 — Single add (Create more OFF)
- Click Add Vision → modal opens. Olga suggestion shows on the left.
- Enter Title (required), optional Description, pick Type / For Team / Owner.
- Click Add → item is written to its category card and the modal closes.
4.3 — Multi add with staging (Create more ON)
- Toggle Create more ON → modal widens, Olga panel is replaced by the staged-items column.
- Fill the form, click Add → item is staged (appears in the column, muted, with an outline check). The form clears; the modal stays open.
- The staged item is not on the board yet.
- Click the green check on a staged card → the item is placed onto its category card. Click again → removed from the board (card stays staged).
- Hover a staged card → edit (pulls it back into the form, removing it from board + column) and delete (removes from both).
- Close with Cancel / ✕ / scrim when done. Confirmed items remain on the board.
5 · State diagram — a staged item
6 · CTA map
| Control | Location | Action |
|---|---|---|
| Add Vision | Page header, top-right | Opens the Add-to-vision modal; resets the staged column. |
| Pencil (card) | Each card, on hover | Enters inline edit for that card. |
| Add (modal) | Modal footer | Disabled until Title is non-empty. Commits per §4.2 / §4.3. |
| Create more | Modal footer-left | Toggles staging mode + side column. |
| Green check | Each staged card | Toggles the item on/off its category card. |
| Edit / Delete | Each staged card, on hover | Edit → back into form; Delete → off column + board. |
| Cancel / ✕ / scrim | Modal | Closes the modal. Confirmed items persist; pending stays staged only in memory. |
7 · Known gaps & open questions
These are deliberate to surface — they are where Dev decisions and QA scrutiny are most needed. Severity is a starting suggestion.
| Severity | Gap |
|---|---|
| HIGH | For Team & Owner are captured but never shown or stored on items. The dropdowns write into form state, but Add only persists the title (and description for Core Focus). Decide: render as a badge per item, group by team, and/or filter. Until then both fields are functionally inert. |
| HIGH | 10-Year Target add is destructive. Adding a 10-Year Target overwrites the existing sentence with no confirm. Decide whether it should be append-only, edit-in-place, or guarded by a confirm. |
| HIGH | No persistence. All Vision state is in-memory and resets on reload. Needs a backend/store before this is real. |
| MED | Description is only used by Core Focus. For all other Types the Description field is collected and discarded. Clarify intended behavior per Type. |
| MED | Olga suggestion is canned, not live AI. It maps a fixed string per Type. If it should reflect Title/Description content, it needs a model call. |
| LOW | No dedupe, no item reorder, and edit-mode rows allow empty strings. Blank items render as empty bullets. Decide on validation and whether items can be reordered. |
| LOW | Accessibility not yet addressed. No focus trap in the modal, no keyboard path for the green check / drag actions, no ARIA roles. Needs a pass before release. |
8 · QA acceptance checklist
Each row is an expected result against current scope.
| ID | Expected result |
|---|---|
| VB-01 | Vision page loads with five cards: Core Values, Core Focus, 10-Year Target, 3-Year Picture, 1-Year Plan. |
| VB-02 | Hovering a card reveals a pencil; clicking it enters inline edit for that card only. |
| VB-03 | In inline edit, + Add item appends a blank row; × removes a row; Done exits and changes persist on screen. |
| VB-04 | Add Vision opens the modal with the Olga suggestion visible (Create more OFF). |
| VB-05 | Add button is disabled while Title is empty and enabled once Title has text. |
| VB-06 | Single-add (Create more OFF): Add writes the item to the card matching Type and closes the modal. |
| VB-07 | Type → card mapping is exact for all five Types. |
| VB-08 | Core Focus add creates a label/value pair; blank Description renders as "—". |
| VB-09 | 10-Year Target add replaces the existing sentence (flag if a confirm is later required). |
| VB-10 | Create more ON: modal widens, Olga panel is replaced by the staged-items column. |
| VB-11 | Add in Create-more mode stages the item (muted, outline check) and does NOT place it on the board. |
| VB-12 | Green check ON places the staged item on its category card; OFF removes it; card remains staged. |
| VB-13 | Staged-card Edit repopulates the form and removes the item from column and board. |
| VB-14 | Staged-card Delete removes the item from both column and board. |
| VB-15 | Cancel / ✕ / scrim close the modal; confirmed items remain on the board. |
| VB-16 | Reopening Add Vision starts with an empty staged column. |
| VB-17 | For Team and Owner selections have no visible effect on the board (documents the current gap). |