From ui-flow-design
Designs user action flows from functional requirements, producing text flows covering normal and error cases in Markdown plus PlantUML diagrams with Salt wireframes.
npx claudepluginhub sean-sunagaku/claude-code-plugin --plugin ui-flow-designステップ1を担当。機能要件からユーザーアクションフローを設計する。 1. `01_user-action-flow.md` - テキスト版のアクションフロー（正常系 + 異常系） 2. `01_state-diagram.puml` - Salt ワイヤーフレーム版のアクションフロー 各ステップの画面状態を Salt で表現し、ステップ間にユーザーアクション説明を挟む。 1枚の Salt 図に全ステップを縦に並べる。 ``` {^"1. 状態名" (画面の Salt ワイヤーフレーム) } . <color:blue>**>>> ユーザーのアクション説明**</color> . {^"2. 次の状態" (画面の Salt ワイヤーフレーム) } ``` - `!theme` ディレクティブは使わない（Cursor 互換性） - `} | {` は必ず1行で書く - テーブルの列数は全...Builds full-screen wireframes in a single PlantUML Salt diagram, iterates layouts with user feedback, and records screen design notes in Markdown.
Generates Mermaid diagrams including flowcharts, sequence diagrams, ERDs, C4 architecture, state machines, and Gantt charts from system descriptions, workflows, and specs. Ideal for technical docs and visualizations.
UX designer for user flows, information architecture, text/Mermaid wireframes, usability reviews, and interaction design patterns. Delegate structural UI/UX planning.
Share bugs, ideas, or general feedback.
ステップ1を担当。機能要件からユーザーアクションフローを設計する。
01_user-action-flow.md - テキスト版のアクションフロー（正常系 + 異常系）01_state-diagram.puml - Salt ワイヤーフレーム版のアクションフロー各ステップの画面状態を Salt で表現し、ステップ間にユーザーアクション説明を挟む。 1枚の Salt 図に全ステップを縦に並べる。
{^"1. 状態名"
(画面の Salt ワイヤーフレーム)
}
.
<color:blue>**>>> ユーザーのアクション説明**</color>
.
{^"2. 次の状態"
(画面の Salt ワイヤーフレーム)
}
!theme ディレクティブは使わない（Cursor 互換性）} | { は必ず1行で書くplantuml -tpng で実レンダリング検証する（-checkonly だけでは不十分）