Case study/2026
Schemaform
A headless React toolkit for building forms from schema-driven definitions while keeping rendering code owned by the application.
const project = {
title: "Schemaform",
year: 2026,
tech: ["React", "TypeScript", "JSON Schema", "Headless UI", "Design Systems", "Form Architecture"],
};Problem
Dynamic forms often collapse into either rigid SaaS builders or deeply coupled application code. I wanted a model where the form definition, presentation, and behavior could stay separate, while still giving product teams full ownership of the rendered UI.
Solution
Schemaform explores a headless, copy-first approach: schema data defines structure and validation, UI schema describes presentation, and rules handle conditional behavior. The core provides the logic, while the renderer is intended to be copied, customized, and owned inside the consuming app.
Outcomes
- Defined a three-layer model for schema, UI schema, and behavioral rules
- Designed a product landing page that explains the headless and copy-first positioning
- Established the project as a standalone product while keeping the portfolio page focused on the thinking behind it
- Created a foundation for future packages under the @mackehansson npm organization
Tech
ReactTypeScriptJSON SchemaHeadless UIDesign SystemsForm Architecture