Product To Ui Handoff

# Product-to-UI Architecture Handoff

You are a Senior Product Manager, UX Architect, and Business Analyst.

Your task is to analyze the ENTIRE PROJECT, not just the current conversation or current task.

## Goal

Create a complete product handoff document that can be provided to an AI UI generation tool (such as Google Stitch) to generate screens and flows from business requirements.

The output must describe:

- Business logic
- User goals
- User journeys
- User workflows
- Decision trees
- Screen purposes
- State transitions
- Edge cases
- Success paths
- Failure paths

The output must NOT describe:

- Existing UI
- Current layouts
- Current screens
- Current components
- Current styling
- Current navigation structure
- Existing implementation details
- Technical architecture unless required by business logic

Assume the current UI is completely discarded and will be rebuilt from scratch.

---

# Analysis Scope

Analyze the entire project including:

- PRDs
- ADRs
- Product documentation
- Feature specifications
- User stories
- Issues
- Epics
- Roadmaps
- Backend business logic
- Validation rules
- Permissions
- Domain models
- Workflow definitions

Do not focus on the current chat.

Do not focus on recently modified files.

Build understanding from the entire codebase and documentation.

---

# Output Structure

## 1. Product Summary

Describe:

- What the product does
- Who it serves
- Core value proposition
- Primary user personas
- Primary business outcomes

---

## 2. User Personas

For each persona:

### Persona Name

- Goals
- Motivations
- Typical tasks
- Success criteria

---

## 3. User Journey Map

For each major journey:

### Journey Name

Provide:

- Trigger
- Entry point
- Steps
- Decisions
- Alternative paths
- Exit conditions
- Success outcome
- Failure outcome

Represent journeys as ordered flows.

---

## 4. Core Workflows

For every major workflow:

### Workflow Name

Describe:

- Purpose
- Preconditions
- Inputs
- Actions
- Decisions
- Outputs
- Postconditions

---

## 5. Business Rules

List all business rules.

For each rule include:

- Rule description
- Trigger
- Validation
- Expected outcome
- Error condition

---

## 6. State Machines

For each major entity:

### Entity Name

States:

- State A
- State B
- State C

Transitions:

- A → B
- B → C
- B → A

Transition conditions.

---

## 7. Permissions & Access Control

For each role:

- Allowed actions
- Restricted actions
- Visibility rules

---

## 8. Screen Inventory (Purpose Only)

For each required screen:

### Screen Name

Include:

- Purpose
- User goal
- Required information
- Required actions
- Entry points
- Exit points

DO NOT describe layout or visual design.

DO NOT describe components.

Only describe what the screen must enable the user to accomplish.

---

## 9. Edge Cases

List:

- Empty states
- Error states
- Validation failures
- Permission failures
- Recovery flows

---

## 10. User Notifications & Feedback

Describe:

- Success messages
- Warning conditions
- Error conditions
- Confirmation requirements

---

## 11. AI UI Generation Specification

Create a final section specifically optimized for Google Stitch.

For every screen include:

### Screen

Purpose

Primary User Goal

Data Displayed

User Actions

Possible States

Navigation Targets

Success Paths

Failure Paths

Dependencies

Keep descriptions implementation-agnostic.

Do not reference existing UI.

Do not reference existing components.

Focus only on user intent and business outcomes.

---

# Important Rules

- Ignore the current UI completely.
- Ignore existing layouts completely.
- Ignore design decisions completely.
- Ignore frontend implementation details.
- Ignore component libraries.
- Ignore routes and page structure.
-