Workspace for assembling interfaces with an AI agent from a user-defined design system and component library.
The product gives the model a controlled environment: existing components, extracted props, face.json contracts, ui@1 composition, previewable states, and checks before changes reach the codebase.
The goal is to keep generation inside the component system that the user actually ships, instead of letting the agent invent UI surface freely.
Status
Work in progress
Role
Author, Product Design Engineer
Domain
AI Tools, Developer Tools, Design Systems
Userface treats AI interface generation as work inside a known component environment.
The user connects a library; the system reads components, extracts props, finds face.json contracts, and gives the agent concrete rules for assembly instead of a blank surface.
General AI tools can sketch a screen quickly, but they often lose the product system: invent props, ignore component rules, or produce JSX that has to be rewritten by hand.
Userface narrows the task. The agent works with real components and their states; the interface shows what exists in the library, what props can be changed, and how the result renders before it reaches the codebase.
A generated screen is treated as a checked composition: it can be inspected, corrected, and connected to implementation without leaving the rules of the design system.
The engine gives the app a structured view of the component library: component discovery, prop extraction, face.json contracts, registry scanning, and ui@1 composition.
A face.json file describes a reproducible component state. Through currentState.props and typed prop metadata, the workspace can show controls, render preview states, and keep the agent inside the component API.
This is the main product constraint: the agent can propose a structure, while the environment defines which components exist, which props are available, and what can be rendered for review.