Rework templates into a component gallery
Nobody has claimed this yet.
Assessment
- Difficulty
- 5/5
- Estimated time
- Over a week
- Newbie friendliness
- 42/100
- Issue type
- Feature
- Clarity
- Mostly clear
- Activity status
- Quiet
- Tech stack
- typescript
- Domain
- frontend
Research direction
Start by reading .chalk/plans/demo-gallery.md and the existing template drawer it describes, then review related issues #14 and #42 for the export scope. Done means replacing the raw-template approach with curated gallery items showing one prompt and one interactive generated component, with component download support and the plan updated to match.
Written by the indexing model from the issue text.
Description
Problem
The current template system doesn't make sense from a UX perspective or for showcasing what Open Generative UI can do. Templates are a drawer of raw HTML strings — they don't communicate the value of agent-generated UI.
Proposal
Replace templates with a gallery of curated, saved conversation outputs. Each gallery item is a snapshot: 1 user message → 1 generated component. This lets visitors immediately see what the agent produces and interact with real outputs.
Gallery items should showcase two axes:
1. Explainers & Visualizations
Educational/explanatory generated components — things like:
- "How a Plane Flies" — interactive pitch/roll/yaw 3D explainer
- Binary search step-through
- Solar system model
- Neural network forward pass animation
These demonstrate the agent's ability to generate rich, interactive educational content from a simple prompt.
2. Custom UI & Styled Components
Generated components that match a specific design language or brand style:
- Clippy / paperclip-style assistant UI
- Spotify-inspired music dashboard
- Invoice card in a specific design system
- Themed dashboards
These demonstrate that generated UI isn't generic — the agent can produce components that feel intentionally designed.
Each gallery item includes:
- The original user prompt (1 message)
- The generated component output (rendered, interactive)
- Ability to download the generated component
Download capability
Users should be able to download generated components from the gallery. This connects to the broader artifact export story.
Related issues
- #14 — "Save / Download Rendered Asset" — downloading rendered visuals as PNG/SVG
- #42 — "Add copy-as-code and download options for generated artifacts" — copy-as-code and download as standalone HTML
Replaces
This supersedes the template drawer approach. The existing gallery plan (.chalk/plans/demo-gallery.md) should be updated to reflect this direction.
- Dominant language
- TypeScript
- Stars
- 1.6k
- Forks
- 202
- PR merge metrics
- No merged PRs in 30d
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
More from CopilotKit/OpenGenerativeUI
-
bug
Difficulty 2/5 1-3 hours Newbie friendliness 72/100
-
enhancement
Difficulty 2/5 1-3 hours Newbie friendliness 72/100
-
Difficulty 4/5 3-5 days Newbie friendliness 48/100
CopilotKit/OpenGenerativeUI#87 · 2 comments ·
-
Difficulty 5/5 Over a week Newbie friendliness 35/100
-
Difficulty 4/5 3-5 days Newbie friendliness 45/100
All issues in CopilotKit/OpenGenerativeUI
Similar issues
-
clawsweeper:linked-pr-open clawsweeper:no-new-fix-pr clawsweeper:source-repro impact:message-loss issue-rating: 🦞 diamond lobster maturity:stable P2
Difficulty 2/5 1-3 hours Newbie friendliness 88/100
-
Difficulty 2/5 1-3 hours Newbie friendliness 84/100
Eynzof/Hermes-CN-Desktop#616 ·
-
ZCode 3.14.3 に対応する Open
Difficulty 2/5 1-3 hours Newbie friendliness 68/100
supermomonga/zcode-acp#24 ·
-
Difficulty 2/5 1-3 hours Newbie friendliness 76/100
growthbook/growthbook#7100 ·
-
triage
Difficulty 1/5 1-3 hours Newbie friendliness 88/100