feishu-whiteboard-pro

Feishu Whiteboard Pro

意図的な構成と検証可能な内容で、実際に編集できる Feishu の SVG ホワイトボードを作成します。 扱う範囲は意図的に限定しています。使用するのは 1 種類のフォント、ネイティブの長方形・円・コネクターのみで、グラデーション、フィルター、不透明度、動きは使用しません。 品質は、正確さ、階層、トポロジー、リズム、コントラスト、余白によって生まれます。

基本方針

• 依頼内容を優先します。 指定されたブランド、配色、参照資料、密度、スタイルに従います。明確な依頼を、デフォルト設定やアンチパターンの警告を理由に黙って別の方向へ誘導してはいけません。
• 修正では維持し、再設計では置き換えます。 修正では、ユーザーが変更する軸を指定していない限り、内容、関係性、形状、ビジュアルアイデンティティを維持します。スタイル変更では、情報設計ではなくビジュアルシステムを変更します。
• ビジュアルの権威は証拠に基づきます。 既存のボード、SVG、スクリーンショット、明示された依頼内容は、別途デザインドキュメントがなくても基準として扱います。
• 関係性は主張です。 レイアウトを整えるために、矢印、数値、引用、カテゴリ、担当者、ステータス、因果関係を作り出してはいけません。作成したデモ用コンテンツには、明確にその旨を示します。
• 機械的なチェックとデザイン判断は分けます。 測定可能な不具合はスクリプトが検出し、内容の正確さ、読み進める順序、階層、バランス、密度、文脈に応じたコントラスト、配置はレビュー担当者が判断します。
• 検証の範囲を限定します。 一度確認し、まとめて修正し、もう一度確認します。残る決定論的な不具合は解消しますが、終わりのない好みの調整は繰り返しません。

セットアップ

<skill-dir> をこの SKILL.md があるディレクトリに解決し、作業ディレクトリはユーザーのプロジェクトのままにします。同梱されているすべての参照資料とスクリプトは、<skill-dir> を基準に解決されます。

ローカルでレンダリングする前に、bash <skill-dir>/scripts/preflight.sh を一度実行します。Node 20 以降が必要です。ホワイトボード CLI は npx 経由で実行され、初回使用時にはネットワークアクセスが必要になる場合があります。

公開する場合のみ、Feishu の認証が必要です。ライブボードに書き込む前に、bash <skill-dir>/scripts/preflight.sh --publish を実行します。公開できない場合は、ローカル SVG と高解像度 PNG を使って作業を続け、有効なローカル成果物を破棄しないでください。

依頼に応じた手順の選択

すべての作成または編集で RULES.md を読み、その後、該当するワークフローを 1 つだけ読み込みます。

依頼	ワークフロー	デフォルトの判断基準
新規ボードまたは構成の置き換え	references/create.md	ユーザーのコンテンツ、参照資料、新しいボードの要件
既存ボードの修正、再構成、スタイル変更、簡略化	references/revise.md	既存の成果物と、明示的に変更する軸
ボードのレビュー、診断、承認	references/critique.md	現在の証拠。修正依頼がない限り読み取り専用

選択したワークフローで必要な場合に限り、補助資料を読み込みます。

• 新しい構成や再構成には COMPOSITION.md。
• 配色の選択やスタイル変更には CATALOG.md と templates/<slug>/design.md を 1 つ。
• デザインレビューと最終納品には CRITIQUE.md。
• 依頼に合う厳選済みの配色がない場合に限り、templates/GENERATE.md。

作成と修正のどちらを求めているのか曖昧な場合は、まず提供された成果物を確認します。どちらの判断基準を選ぶかで結果が大きく変わる場合に限り、質問してください。

ビルドと検証

SVG を作成する場合：

1. トポロジーが合う場合は、対応する examples/*.svg をベースにします。内容を置き換え、例をそのまま信頼せず、古い矢印の先端とメタテキストを再確認します。

2. 決定論的なチェックを実行します：

   node <skill-dir>/scripts/fit-check.mjs <dir>/diagram.svg
   

3. 余白を詰めたローカル画像をレンダリングして確認します：

   npx -y @larksuite/whiteboard-cli@^0.2.11 \
     -i <dir>/diagram.svg -o <dir>/diagram.png -f svg
   

4. 表示上の修正をまとめて行い、fit-check を再実行して、確認用のレンダリングを 1 回行います。別のプロセスに根拠を渡す場合は、 node <skill-dir>/scripts/fit-check.mjs --json <dir>/diagram.svg を使用します。

5. 重要な成果物を納品する場合は、 agents/whiteboard-finish-reviewer.md の最新の読み取り専用レビュアーを使用します。元の依頼、事実・デザインに関する契約、SVG、ローカル PNG、チェッカーの出力、実際の Feishu の証拠があればそれも渡します。

公開と納品

Feishu の作成、更新、照会に関する正確なコマンドは RULES.md に従ってください。公開すると外部の状態が変更されるため、ユーザーが公開ボードを依頼した場合、または更新対象を指定した場合にのみ行います。

公開に成功した場合は Feishu ドキュメントのリンクと、ローカルの diagram.svg および余白を詰めた diagram.png を納品します。正方形の Feishu エクスポートは検証用の証拠であり、共有用の画像ではありません。公開できない場合はローカルの成果物と、残っている認証手順を明確に伝えます。

リポジトリのファイル

• RULES.md — 検証済みの媒体に関する制約と公開コマンド。
• references/ — 作成、改訂、批評の手引き。依頼ごとに 1 つ読み込みます。
• COMPOSITION.md — 間隔、文字サイズ、構成の類型、反射的な判断を避けるための指針。
• CRITIQUE.md — 真偽の判定、5 つの視覚的評価軸、範囲を限定したレビュー手順。
• CATALOG.md — 生成されたパレットのインデックス。
• templates/ — 厳選されたパレットと、任意の生成レシピ。
• examples/ — 編集可能な模範 SVG の出発点とレンダリング画像。
• scripts/fit-check.mjs — テキストと JSON で出力する、決定論的な媒体および変形されていないジオメトリのチェッカー。
• scripts/check-repo.mjs — オフラインで実行するリポジトリの回帰チェック。
• scripts/preflight.sh — ローカルおよび公開の準備状況チェック。