Docs · Start here
Quickstart
Take one live component from a rough first pass to a version that feels deliberate, then continue in code.
5 min read
Outcome and prerequisites
The goal is one working component that does its job, fits the product around it, and is ready to continue in an implementation workflow.
- Use an invited or otherwise authorized Tenor account.
- Bring a small interface idea: one card, panel, control, or section works best.
- Know the job the component should do and identify one thing that currently feels off.
From working to deliberate
- 01
Open a project canvas
Log in, open the project you want to use, and start from the canvas composer.
- 02
Choose a starting point
Describe the component, add a visual reference, or paste a self-contained React component. Include its purpose, important content, and expected behavior.
- 03
Check the working result
Confirm the component communicates its intended job. Look at structure, hierarchy, states, and interaction before polishing details.
- 04
Name what feels off
Use plain language and ask for one visible outcome: make the hierarchy clearer, tighten the spacing, lighten a heavy control, or create a distinct variant.
- 05
Compare and continue
Keep the version that best preserves the product job, then use Share to continue with it in Codex, Claude Code, or your project.
Expected result
You should have one selected component that remains interactive, feels closer to your intent, and is specific enough for a coding agent to integrate. Continue with Refine a component and compare variants when the direction needs another pass.