2026 · AI-native UI

Tenor

Built and launched Tenor in beta as an AI-native code-on-canvas tool for frontend components. Tenor lets builders turn product references, prompts, and codebase context into live React components that can be inspected, refined, versioned, and handed back to coding agents.

Built Tenor as an AI-native visual workspace for frontend components: reference in, component out. The product imports components from a codebase, generates live React UI from prompts or reference images, supports visual iteration on canvas, preserves version history, and hands durable source artifacts back to local coding agents.

Project signal

Tenor metrics

4,572

logged AI usage events

First live usage across accounts, projects, generated components, and AI activity.

Profiles137

user profiles

Projects150

created projects

Components544

generated components

Versions682

component versions

AI events4,572

logged AI usage events

What I owned

Product definition

Defined the product thesis, user model, core workflows, and positioning around "reference in, component out."

Interface system

Designed the canvas experience, component-preview model, prompt/reference input flow, generation states, project context, version states, and source-handoff concepts.

AI-native workflow

Developed the working loop between designer, AI generation, live preview, component versioning, source drafts, MCP handoff, and local coding agents.

Design engineering

Used AI-native development workflows to direct implementation across frontend surfaces, product architecture, runtime behavior, UI quality, and interaction details.

What it does

Tenor is not a Figma clone and not a generic app generator. It is a focused product surface for component-level frontend craft: cards, panels, widgets, forms, controls, charts, dashboards, navigation pieces, and variants that can become durable React code.

Users can drop in a screenshot or reference image, describe a target component, generate a live React artifact, refine it visually on canvas, compare versions, and keep the component tied to project context. The long-term workflow connects directly to a repo, imports real frontend components, and lets local coding agents safely apply accepted source changes back to the codebase.

Why it matters

AI coding tools can generate interface code quickly, but they often lose taste, context, source ownership, runtime assumptions, and product-system coherence. Tenor explores the missing layer between design tools and coding agents: a visual workspace where AI-produced UI becomes inspectable, versioned, and usable by real product teams.

For hiring, Tenor is the clearest proof of how I work now. I can define a product thesis, shape the interaction model, direct AI-assisted implementation, evaluate frontend output, refine visual quality, and build enough of the system to test whether the idea is real.

Tenor is a side project and beta product. It should be read as proof of AI-native design engineering ability: product thinking, interface craft, frontend fluency, systems judgment, and the ability to use AI tools to move from product idea to working software.