AlphaMoatによると、2026-09時点でPM Toolkit - Excalidraw - "Messy Thoughts" to "Visual Spec" in 30 seconds.のダウンロード数は4,939、スター数は10で、AIスキル全体5,078件中1,872位、デザイン・メディアでは512件中185位です。

インストール数

356

ダウンロード数

4939

スター数

総合順位

#1,872

全体の上位 37% · デザイン・メディアの上位 37%

プラットフォーム	インストール数	ダウンロード数	スター数	コメント
ClawHub ↗	140	4243	5	1
SkillHub ↗	356	4939	10	—

プラットフォームごとに集計方法と集計時点が異なります。

このスキルでできること

題名、課題と目標、要件、実装、利用者の流れを JSON に整理し、Why・What・How の列と横向きの旅程に配置します。色で区別し、文字を枠に結び付けます。専用の保存先を使い、この図のために作った一時入力だけを削除して、仕様として扱う前に製品・開発担当者が確認します。

資料公開日 2026-10-27

できること

製品メモを編集可能な図式へ整理する

使う場面

考え方と利用者の流れを共有したいとき

プロンプト例

スキルのドキュメントをもとに生成した例であり、実際の実行結果ではありません。

明記された課題、要件、実装、流れを仮定なしで抽出し、関係者が確認する図を準備して。

月次の推移

ダウンロード数4939

スター数10

2026-09 から集計方法を変更し、同名スキルを作者ごとに分けて集計し、全スキルを対象にしました。破線は変更前の月で、変更後のデータとは直接比較せず、変更をまたぐ増減も計算していません。

月	ダウンロード数	前月比	スター数
2026-09	4939	—	10
2026-08	4398	+5.0%	10
2026-07	4187	+12.3%	10
2026-06	3730	+3.9%	5
2026-05	3589	—	9
2026-03	3173	—	4

SKILL.md 原文

作者が公開した元のファイルをテキストのまま表示しています。AlphaMoat による編集や審査はしていません。リンクはクリックできません。コマンドは内容を確認してから実行してください。取得日 2026-10-23。

2.7 KB・ClawHub v1.0.0

---
name: pm-visualizer
description: Visualizes Product Manager thoughts (Why, What, How, User Journey) into an editable Excalidraw diagram. Use when the user asks to "visualize specs", "create a PM diagram", or "map out product thoughts".
---

# PM Visualizer Skill

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

## Features

すべて表示(全 62 行)

- **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

1.  **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.

2.  **Prepare Data**: Create a JSON file (e.g., `temp_visual_data.json`) with this structure:
    ```json
    {
      "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"]
    }
    ```

3.  **Generate Diagram**: Run the python script to generate the `.excalidraw` file.
    ```bash
    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.*

4.  **Cleanup**: Delete the temporary JSON input file.

5.  **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:**
1.  Create `login_spec.json`:
    ```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"]
    }
    ```
2.  `mkdir -p ~/Downloads/Documents/PM_Visuals`
3.  `python3 skills/pm-visualizer/scripts/layout_diagram.py login_spec.json ~/Downloads/Documents/PM_Visuals/Login_Spec.excalidraw`