prefrontend

Prefrontend is a term used in software development to describe the phase and set of practices that occur before frontend engineering begins. It emphasizes defining content, information architecture, user tasks, and interaction patterns in advance of UI implementation. The goal is to establish a stable foundation of data, structure, and design constraints that developers can build against.

The concept originated in cross-functional product teams where early alignment between product management, design, content strategy, and engineering was sought to reduce rework and improve delivery predictability.

Core activities include content modeling, information architecture, user flows and task analysis, screen wireframes, API contracts or data schemas, accessibility and localization requirements, and a lightweight design system or tokens that guide styling decisions.

Prefrontend acts as a bridge between design work and frontend implementation. It informs backend data models and API design, content governance, and UX guidelines, ensuring the frontend has consistent structure, predictable data, and a scalable path for components.

Typical workflows combine stakeholder interviews, content inventories, IA diagrams, user journeys, rapid prototyping, and contract generation for APIs and content schemas. Common tools include sketching and wireframing software, schema definitions, documentation platforms, and collaborative review processes.

Critics warn that over-structuring the early phase can slow teams, but proponents argue that prefrontend reduces churn, improves accessibility and localization readiness, and accelerates frontend delivery for complex, content-driven applications.