PM Visualizer Skill

This skill converts unstructured Product Manager thoughts into a structured Excalidraw visualization.

Features

Smart Layout: Automatically columns "Why, What, How" and creates a horizontal flow for "User Journey".
Color Coding: Visual distinction between problem (Why - Yellow), solution (What - Green), implementation (How - Blue), and flow (Journey - Red/Pink).
Grouped Elements: Text is properly bound to containers so they move together.

Workflow

Analyze Request: Extract the following sections from the user's prompt or context:
- Title: The feature or product name.
- Why: The problem statement, business goals, or "Why are we building this?".
- What: The solution requirements, features, or "What is it?".
- How: Technical implementation details, API strategy, or "How will we build it?".
- Journey: A sequential list of steps for the user journey or process flow.

Prepare Data: Create a JSON file (e.g.,

temp_visual_data.json

) with this structure:

{
  "title": "Feature Name",
  "why": ["Reason 1", "Reason 2"],
  "what": ["Feature 1", "Feature 2"],
  "how": ["Tech 1", "Tech 2"],
  "journey": ["Step 1", "Step 2", "Step 3"]
}

Generate Diagram: Run the python script to generate the

.excalidraw

file.

python3 skills/pm-visualizer/scripts/layout_diagram.py temp_visual_data.json ~/Downloads/Documents/PM_Visuals/Output_Name.excalidraw

Ensure the output directory exists first.

Cleanup: Delete the temporary JSON input file.
Report: Inform the user the file is ready at the output path.

Example

User: "Visualize a new 'Login with Google' feature. Why? Reduce friction. What? Google button on login page. How? OAuth2. Journey: User clicks button -> Google Popup -> Redirect to Dashboard."

Codex Action:

Create

login_spec.json

{
  "title": "Login with Google",
  "why": ["Reduce friction", "Increase conversion"],
  "what": ["Google Sign-in Button", "Profile Sync"],
  "how": ["OAuth 2.0 Flow", "Google Identity SDK"],
  "journey": ["User clicks 'Sign in with Google'", "Google permissions popup appears", "User approves access", "System verifies token", "User redirected to Dashboard"]
}

mkdir -p ~/Downloads/Documents/PM_Visuals

python3 skills/pm-visualizer/scripts/layout_diagram.py login_spec.json ~/Downloads/Documents/PM_Visuals/Login_Spec.excalidraw

PM Toolkit - Excalidraw - "Messy Thoughts" to "Visual Spec" in 30 seconds.

AI Skill Market Insights

Be Part of the 0+ Developer Community

PM Visualizer Skill

Features

Workflow

Example

Quick Start

Manual Installation

TEAR & SHARE

Tags

writing-plans

executing-plans

plan-ceo-review

Office Automation

Todo Manager

Channels

Learn

Compare

Company