Terminal Viewer Gallery — Random Pick

Kami — JSON App Mock

An AI-powered design assistant that helps designers think, create, and make decisions.

User: Clayton (ql373)
Role: Product Designer
Reviewed: 2026-04-23

Loaded SRC URL

App Behavior

Kami is a mock AI design assistant interface — a JSON-driven simulation of what a real product called "Kami" might look like. The app loads user data (name, role, net ID) and product data (features, projects) from a JSON file and populates several named UI regions:

Snapshot
Settings
Quick Actions
Mock Assistant
Features
Projects

The Mock Assistant panel exposes three action buttons — Generate Idea, Synthesize Research, and Support Decision — which are meant to simulate Kami's core AI capabilities. A Features section lists toggleable capabilities loaded from the JSON, with a "Show enabled only" filter. A Projects section renders project cards that can be selected to set the active project context for the mock assistant. Status fields show Assistant mode: Idle, Current project: None, and Last action: Waiting until interaction occurs.

Things That Didn't Work as Expected

Mock assistant buttons produced no visible output. Clicking "Generate Idea," "Synthesize Research," or "Support Decision" left the response area reading "No action yet. Try one of the mock features." — no simulated response text appeared.
Projects section appeared empty. The prompt to "pick a project card to make it the active project" was shown, but no cards were rendered — either the JSON contained no projects or they failed to populate into the DOM.
Features section showed no individual features. The label "All features loaded from the JSON file" appeared, but no feature rows or toggles were visible — the "Show enabled only" filter had nothing to act on.
Snapshot and Settings sections were blank. Both section headers rendered but contained no content — likely placeholder regions that were never wired up to the JSON data.
Status fields never update. Assistant mode: Idle and Last action: Waiting remained static regardless of button clicks — the state machine driving these fields appears unimplemented.
Reset button has no apparent effect. With nothing populating the assistant output in the first place, the Reset control in the Mock Assistant panel has no observable behavior.

Prompt to Improve the App

// improvement prompt — paste into next iteration

"Fix and extend the Kami JSON Mock app with the following changes:"

  1. Wire the mock assistant buttons to actual output. When "Generate Idea," "Synthesize Research," or "Support Decision" is clicked, populate the response area with a relevant canned response pulled from the JSON (e.g. a responses array keyed by action type). Update Last action and Assistant mode status fields accordingly.
  2. Populate the Projects section from JSON. Add a projects array to the JSON with fields like name, status, and description. Render each entry as a selectable card. Clicking a card should set it as Current project in the Snapshot panel.
  3. Render the Features list. Add a features array to the JSON with name and enabled fields. Render each as a toggle row. Make the "Show enabled only" filter actually hide disabled features when toggled.
  4. Fill in Snapshot and Settings. Use JSON fields (e.g. model, responseStyle, language) to populate these panels with real readable values rather than empty section headers.
  5. Make Reset functional. Clicking Reset should clear the assistant output, deselect the active project, and return all status fields to their initial idle state.