kta-design-spec

To generate per-screen design specs from a PRD, you need a tool that converts feature documents into structured, tool-agnostic briefs. This process loops across features and screens to enforce a mandatory six-state component model and validates token references for AI design tooling.

A six-state component model in AI design specs mandates that every UI component lists six distinct states. This validation ensures AI design tools receive complete interaction briefs, preventing incomplete component generation from your markdown PRD inputs.

Converting markdown PRDs into a design-bundle for Stitch or Figma AI requires parsing feature documents and grouping screens by feature. The output includes an INDEX with feature-to-screen mapping and a final design-bundle markdown file.

No, this design spec workflow explicitly enforces no Kotlin or Compose code output. It strictly produces markdown design specs and a design-bundle to serve as tool-agnostic briefs for AI design tooling.

The best way to structure design tokens for automated spec generation is using a style-foundation markdown file. The spec generation process validates references against these style-foundation tokens to ensure consistent design application across all screens.

You can use this workflow by manually supplying per-feature PRDs in the plans directory, but it is designed to integrate with a PRD pipeline. Running a pipeline ensures the required markdown PRD inputs are correctly structured before generating the design-spec set.