Skip to content

Core Feature Screenshot Capture Plan ​

This plan defines the first committed screenshot pass for Wardian documentation. It complements Screenshot Documentation and follows the canonical asset layout:

text
docs/assets/screenshots/<feature-or-window>/<state>.png

Capture Priorities ​

  1. Reader orientation: one clean screenshot for every top-level window or persistent panel readers need to recognize.
  2. Automation proof: one screenshot for important interactions that are hard to understand from text alone.
  3. Native/runtime evidence: terminal and provider screenshots only when the native harness is needed to show the real state.

Initial Screenshot Set ​

PriorityFeature or windowOwning guideAsset pathCapture layerState to show
P0App shell and Griddocs/guide/ui-overview.mddocs/assets/screenshots/grid/app-shell.pngBrowser E2EMain Habitat shell with left rail, grid, and roster visible
P0Dashboarddocs/guide/ui-overview.mddocs/assets/screenshots/dashboard/system-summary.pngBrowser E2EDashboard cards and telemetry summary
P0Agent roster / Watchlistsdocs/guide/watchlists.mddocs/assets/screenshots/watchlists/agent-roster.pngBrowser E2ESearchable right roster with agent rows and status indicators
P0Spawn Agentdocs/guide/getting-started.mddocs/assets/screenshots/spawn-agent/spawn-form.pngBrowser E2EAgent configuration form with name, class, workspace, and provider controls
P0Command Paneldocs/guide/command-panel.mddocs/assets/screenshots/command-panel/broadcast-prompt.pngBrowser E2EBroadcast textarea and target controls
P0Librarydocs/guide/library.mddocs/assets/screenshots/library/library-view.pngBrowser E2EPrompt, skill, or class library browser
P0Automationsdocs/guide/automations.mddocs/assets/screenshots/automations/builder-canvas.pngBrowser E2EAutomation sidebar and builder canvas
P0Settingsdocs/guide/settings.mddocs/assets/screenshots/settings/runtime-settings.pngBrowser E2ETheme, shell, and runtime settings controls
P0Explorerdocs/guide/explorer.mddocs/assets/screenshots/explorer/workspace-tree.pngBrowser E2EFile tree rooted in a seeded workspace
P0Source Controldocs/guide/source-control.mddocs/assets/screenshots/source-control/status-panel.pngBrowser E2EGit branch bar, staged/unstaged groups, and commit box
P1Source Control diffdocs/guide/source-control.mddocs/assets/screenshots/source-control/diff-modal.pngNative E2EInline diff modal with hunk markers
P1User Terminalfuture user guide or docs/specs/2026-05-04-user-terminal-panel-design.mddocs/assets/screenshots/user-terminal/open-terminal.pngNative E2EUser terminal panel with workspace context
P2Agent lifecycledocs/guide/ui-overview.md or docs/guide/watchlists.mddocs/assets/screenshots/grid/active-agent-card.pngNative E2ERunning agent card with terminal output
P2Automation run statedocs/automations/index.mddocs/assets/screenshots/automations/run-state.pngNative E2EAutomation block status while running

First Pass Scope ​

The first pass should commit P0 browser-capturable screenshots and embed them in the owning guides. P1/P2 captures should follow in later commits because they require native IPC, real filesystem state, PTY behavior, or provider runtime behavior.

Capture Data Rules ​

  • Use seeded names such as E2E Mock Agent, Docs Demo, and TestClass.
  • Use generic workspaces such as <absolute-workspace-path> in visible fields when possible.
  • Avoid showing local user names, production WARDIAN_HOME, private repository names, provider tokens, or real provider conversations.
  • Prefer light, crisp screenshots at 1440x960 for documentation unless the feature needs a narrower responsive state.

Embedding Order ​

  1. Add the screenshot under docs/assets/screenshots/<feature-or-window>/.
  2. Embed it near the first paragraph that describes the visible state.
  3. Keep surrounding text short; the image should support the guide rather than replace it.
  4. Run markdown and build verification before finalizing.

Released under the MIT License.