design-deck

Generate deck slides with distinct architecture and UI options for stakeholder decisions.

Updated May 4, 2026
One-click install
npx skills add https://github.com/panamini/pi-tooling --skill design-deck-panamini
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-deck
Source: https://github.com/panamini/pi-tooling/tree/main/extensions/pi-design-deck/skills/design-deck
Command: npx skills add https://github.com/panamini/pi-tooling --skill design-deck-panamini

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This skill eliminates guesswork by presenting multiple high-fidelity visual alternatives so you can make explicit architecture and UI decisions faster.

Core Features & Use Cases

  • Visual decision making: Create side-by-side comparisons using code diffs, Mermaid diagrams, images, and rich HTML previews.
  • Plan/PRD-driven workflows: Read a plan or PRD, locate decision points, and generate a deck of distinct options for each.
  • Interactive choice flow: Guides selection through structured slides and supports iterative “generate-more” to refine outcomes.

Quick Start

Load the skill and use the /deck-discover flow to interview for missing requirements, then produce a visual design-deck you can choose from.

Frequently Asked Questions about design-deck

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I compare architecture and UI options side-by-side for a PRD?▼

To compare architecture and UI options side-by-side, you generate deck slides containing distinct visual previews using Mermaid diagrams, code diffs, and rich HTML mockups. This allows stakeholders to review multiple alternatives directly from a PRD.

What is the best way to visualize architecture decisions from ambiguous requirements?▼

Visualizing architecture decisions from ambiguous requirements involves using an interactive discovery flow to interview for missing details. It then produces a visual deck with option previews so you can iteratively add and refine choices.

Can I use Mermaid diagrams to present UI mockups in a decision deck?▼

Yes, you can use Mermaid diagrams alongside code diffs, images, and rich HTML previews to present UI mockups in a decision deck. These visual options are structured into slides to help stakeholders make explicit choices.

How do I generate multiple visual options for a plan-driven system design?▼

You can generate multiple visual options for a plan-driven system design by loading a plan or PRD, locating specific decision points, and producing a deck of distinct alternatives for each point. This supports iterative generation to refine outcomes.

Does this visual comparison approach support iterative option generation?▼

Yes, this visual comparison approach supports iterative add-options generation based on selected decision points. It guides selection through structured slides, allowing you to generate more alternatives until the design outcome is refined.