# prd-v04-screen-flow-definition > Connect user journeys to screens, defining the UI structure and navigation paths during PRD v0.4 User Journeys. Connect user journeys to screens, defining the UI structure and navigation paths during PRD v0.4 User Journeys. Triggers on requests to define screens, design screen flows, map UI structure, plan navigation, or when user asks "what screens do we need?", "define screens", "screen flow", "UI structure", "information architecture", "navigation design", "wireframe planning". Consumes UJ- (User Journey Mapping), FEA- (Feature Value Planning), BR- (constraints). Outputs SCR- entries for screens and DES- entries for design system elements. Feeds v0.5 Red Team Review. - Type: Skill - Made by: mattgierhart - Category: Design - Formats: Skills - Version: 3b3473c - Source: https://github.com/mattgierhart/prd-driven-context-engineering/tree/HEAD/plugins/prd-ce/skills/prd-v04-screen-flow-definition - Page: https://pluginboard.ai/skills/prd-v04-screen-flow-definition-mattgierhart ## Works with - ChatGPT - Claude - Gemini - GitHub Copilot - Cursor - Claude Code - Codex - Antigravity - Gemini CLI - Replit - OpenClaw - OpenCode - Hermes Agent ## Install ### ChatGPT In ChatGPT: Download the prd-v04-screen-flow-definition folder and zip it, then Plugins → Skills → Create → Upload from your computer. Business and Enterprise plans. View the folder on GitHub: https://github.com/mattgierhart/PRD-driven-context-engineering/tree/HEAD/plugins/prd-ce/skills/prd-v04-screen-flow-definition ### Claude In Claude (web or desktop): Download the prd-v04-screen-flow-definition folder and zip the folder itself, then upload it in Customize → Skills. View the folder on GitHub: https://github.com/mattgierhart/PRD-driven-context-engineering/tree/HEAD/plugins/prd-ce/skills/prd-v04-screen-flow-definition ### Gemini In Gemini: Download the prd-v04-screen-flow-definition folder, then at gemini.google.com click Customize → Skills → Create → Upload and pick the folder (or a .zip of it). View the folder on GitHub: https://github.com/mattgierhart/PRD-driven-context-engineering/tree/HEAD/plugins/prd-ce/skills/prd-v04-screen-flow-definition ### GitHub Copilot Run in your terminal: ```shell npx -y degit mattgierhart/PRD-driven-context-engineering/plugins/prd-ce/skills/prd-v04-screen-flow-definition ~/.copilot/skills/prd-v04-screen-flow-definition ``` View the folder on GitHub: https://github.com/mattgierhart/PRD-driven-context-engineering/tree/HEAD/plugins/prd-ce/skills/prd-v04-screen-flow-definition ### Cursor Run in your terminal: ```shell npx -y degit mattgierhart/PRD-driven-context-engineering/plugins/prd-ce/skills/prd-v04-screen-flow-definition ~/.cursor/skills/prd-v04-screen-flow-definition ``` View the folder on GitHub: https://github.com/mattgierhart/PRD-driven-context-engineering/tree/HEAD/plugins/prd-ce/skills/prd-v04-screen-flow-definition ### Claude Code Run in your terminal: ```shell npx -y degit mattgierhart/PRD-driven-context-engineering/plugins/prd-ce/skills/prd-v04-screen-flow-definition ~/.claude/skills/prd-v04-screen-flow-definition ``` View the folder on GitHub: https://github.com/mattgierhart/PRD-driven-context-engineering/tree/HEAD/plugins/prd-ce/skills/prd-v04-screen-flow-definition Or all of PRD-Driven Context Engineering, in Claude Code: ```text /plugin marketplace add mattgierhart/PRD-driven-context-engineering /plugin install prd-ce@prd-ce-methodology ``` ### Codex Run in your terminal: ```shell npx -y degit mattgierhart/PRD-driven-context-engineering/plugins/prd-ce/skills/prd-v04-screen-flow-definition ~/.agents/skills/prd-v04-screen-flow-definition ``` View the folder on GitHub: https://github.com/mattgierhart/PRD-driven-context-engineering/tree/HEAD/plugins/prd-ce/skills/prd-v04-screen-flow-definition ### Antigravity In Antigravity: Copy the prd-v04-screen-flow-definition folder into ~/.gemini/config/skills (Antigravity app and IDE) or ~/.gemini/antigravity-cli/skills (Antigravity CLI). View the folder on GitHub: https://github.com/mattgierhart/PRD-driven-context-engineering/tree/HEAD/plugins/prd-ce/skills/prd-v04-screen-flow-definition ### Gemini CLI Run in your terminal: ```shell npx -y degit mattgierhart/PRD-driven-context-engineering/plugins/prd-ce/skills/prd-v04-screen-flow-definition ~/.gemini/skills/prd-v04-screen-flow-definition ``` View the folder on GitHub: https://github.com/mattgierhart/PRD-driven-context-engineering/tree/HEAD/plugins/prd-ce/skills/prd-v04-screen-flow-definition ### Replit Run in your terminal: ```shell npx -y degit mattgierhart/PRD-driven-context-engineering/plugins/prd-ce/skills/prd-v04-screen-flow-definition .agents/skills/prd-v04-screen-flow-definition ``` View the folder on GitHub: https://github.com/mattgierhart/PRD-driven-context-engineering/tree/HEAD/plugins/prd-ce/skills/prd-v04-screen-flow-definition ### OpenClaw Run in your terminal: ```shell npx -y degit mattgierhart/PRD-driven-context-engineering/plugins/prd-ce/skills/prd-v04-screen-flow-definition ~/.openclaw/skills/prd-v04-screen-flow-definition ``` View the folder on GitHub: https://github.com/mattgierhart/PRD-driven-context-engineering/tree/HEAD/plugins/prd-ce/skills/prd-v04-screen-flow-definition ### OpenCode Run in your terminal: ```shell npx -y degit mattgierhart/PRD-driven-context-engineering/plugins/prd-ce/skills/prd-v04-screen-flow-definition ~/.config/opencode/skills/prd-v04-screen-flow-definition ``` View the folder on GitHub: https://github.com/mattgierhart/PRD-driven-context-engineering/tree/HEAD/plugins/prd-ce/skills/prd-v04-screen-flow-definition ### Hermes Agent Run in your terminal: ```shell npx -y degit mattgierhart/PRD-driven-context-engineering/plugins/prd-ce/skills/prd-v04-screen-flow-definition ~/.hermes/skills/prd-v04-screen-flow-definition ``` View the folder on GitHub: https://github.com/mattgierhart/PRD-driven-context-engineering/tree/HEAD/plugins/prd-ce/skills/prd-v04-screen-flow-definition --- From Pluginboard (https://pluginboard.ai).