mcpField
D
design-like-im-5

design-like-im-5

github.com/srinitudeデザイン・UI2304 回インストール1 週間前に更新
リポジトリ

design-like-im-5 について

事実、コスト、リスク、状態、ユーザーの制御権を明示しながら、使いやすい製品を設計・レビューするエージェントスキルです。段階的なワークフローで証拠に基づく判断と視覚・操作の直接確認を行い、証拠がない場合は推測せずブロックします。

主な機能

  1. 01固定順序の設計ワークフロー
  2. 02タスク別のコンテキストと証拠の振り分け
  3. 03視覚的な状態と操作のレビュー
  4. 04安全性・アクセシビリティ・使いやすさの拒否基準
  5. 05来歴と検証記録の追跡

活用シーン

  1. 01証拠に基づく製品デザインの作成・修正
  2. 02状態や画面の向きをまたいだ画面レビュー
  3. 03デザイン承認前の証拠不足の特定

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/srinitude/skills --skill design-like-im-5

インストール後、Claude Code で/design-like-im-5を入力して読み込まれたか確認します。

同梱ファイル

SKILL.md と一緒にインストールされる参考資料やスクリプト。

.github/workflows/
ci.yml
assets/
context-bundle.schema.json
context-routing.json
context-routing.schema.json
decision-records.json
eval-case-template.json
execution-ownership.json
file-manifest.json
improvement-contract.json
invocation-receipt-template.json
lineage.schema.json
mise-primitives-catalog.json
mise-primitives.json
model-record.schema.json
primitive-lifecycle.json
proof-ladder.json
proof-ladder.schema.json
reading-contract.json
reading-exceptions.json
review-record.schema.json
run-intake.schema.json
section-support.json
section-support.schema.json
simplicity-contract.json
speed-policy.json
speed-policy.schema.json
state-record.schema.json
use-case-contract.json
workflow.json
evals/
cases.json

詳細

5歳児にもわかるデザイン

真実、コスト、リスク、状態、制御を隠さず、使えるプロダクトを作ります。完全なサポートはreferences/section-support.mdとmise run section-supportを通じて提供します。

1つの契約

  • 検証済みの所有アーティファクト変更までの経過時間を最小限にします。探索的・実験的な幅、正確性、すべてのゲート、同じ実行者がビジョンを担うことを維持します。
  • assets/speed-policy.json、assets/speed-policy.schema.json、evals/speed-budgets.jsonが、mise run completeを通じて安全なスケジューリングと制限を管理します。
  • assets/workflow.jsonだけがステップの順序を定めます。assets/execution-ownership.jsonだけが担当者マップを定めます。mise run task-graphとmise run ownershipで両方を確認します。必須ステップを省略、統合、置換、並べ替えしないでください。
  • assets/context-routing.json、assets/context-routing.schema.json、assets/context-bundle.schema.jsonが、mise run context-routingを通じてルートとパケットの形式を管理します。assets/section-support.jsonとassets/section-support.schema.jsonが、mise run section-supportを通じて見出しのサポートを管理します。これらのタスクを通じてreferences/context-routing.mdとreferences/section-support.mdを読みます。ルートを変更した後は、再確認してください。
  • モデルは、権利と拒否権の範囲内で、選択肢を追加、分割、組み合わせ、逆転、または却下できます。すべての目、脳、タッチのレビューはモデルが実施します。モデルは、すべての不適切なデザイン、不適切な出力、不適切な実践のルールを確認します。mise run human-sweepを通じてreferences/review.mdを読み、キャンバスを整理された状態に保ちます。スクリプトがデザインや整理状態に対してPASSを付与することはできません。
  • 真実性、アクセシビリティ、タスク、知覚、親しみやすさ、標準、独自性、クラフト、レジリエンスは、それぞれ個別に合格する必要があります。信頼ゼロから始めます。引き継いだ作業にはSTALEの印を付け、まず観察し、合格は維持し、不要な再設計は却下します。主張は証拠に結び付け、失敗を平均化して無かったことにしないでください。
  • 最重要の視覚的証明ルールでは、測定ゲートを通過した後は直接目で見た結果を最終判断とします。同じ呼び出し元である、強力な視覚機能を持つ実行者が、利用可能なすべての適用可能な視覚機能を使って、現在のピクセルを確認します。各変更と無効化の前後に、さまざまな状態、ビューポート、入力経路を通じて、ビュー全体と細部を確認します。代理指標は拒否権を持ちますが、視覚的なPASSを付与することはできません。視認できない場合はBLOCKEDです。
  • 複数ページの作業では、深さ1の各所有者につき正準ページを1つ選び、その子孫を確認します。配置間違い、重複、孤立、古い作業、移動があれば、影響を受けるビューはブロックされます。現在の目、脳、タッチによる判断に合格する必要があります。
  • モバイルとタブレットの各レイヤーを、縦向きと横向きの両方で確認し、対応している場合は画面の回転も確認します。階層、操作の届きやすさ、安全領域、折り返し、密度、間隔、状態、入力を証明します。解剖学的構造または動作が変わる場合に限り、向きに関するAPIを追加します。それ以外の場合は所有者を1つに保ち、両方のコンテキストで証明します。
  • skill-factoryの更新モードがパッケージの変更を管理します。mise run domain-research-policy、mise run use-case-policy、mise run mise-primitives-policy、mise run primitive-lifecycle-policy、mise run task-graph-policy、mise run decision-policy、mise run improvement-policyを実行します。長いプロンプトや、オープンなプロダクトデザイン作業にはmise run agentic-requestを使います。Miseタスクは構造を確認します。デザインの判断は行いません。
  • Computer Use監査では、プラットフォームに依存しないローカルアプリケーション制御機能としてcomputer-useを使います。同じ実行者がFigmaを含むアクティブなデザインアプリケーションを直接確認し、すべての処置を担当する必要があります。そうでなければ、その項目はBLOCKEDです。Figmaの監査では、ライフサイクルのレシートと、項目ごとに1つのソースレコードも必要です。この監査以外では、このスキルは単独で機能します。

順序付きワークフロー

examples/run.md に従い、mise run examples を通じて一連の使用方法を確認してください。assets/workflow.json は、mise run task-graph を通じて実行順序を一元管理します。

コマンド
  • help: 入力、出力、ルート、タスク、停止条件を説明します。examples/help.md の内容に沿って、mise run run-help を実行してください。作業は開始しないでください。
  • run: 作成、レビュー、または改訂を行います。レビューでは製品ファイルを変更しません。改訂では承認済みのファイルのみを変更します。
  • モデル作業の前に: 初回実行の前と、タスク、パス、パケット、または出力に変更があった後に、mise run examples を通じて examples/run.md と examples/context-packets.md を読んでください。
  • コンテキストが不完全な場合: mise run evals を通じて evals/files/valid-context-record.json と evals/files/missing-context-record.json を比較してください。事実または証拠フィールドが不足している場合は、mise run examples を通じて examples/failure-missing-proof.md を使用してください。推測しないでください。
実行の準備

実行チェックリスト:

  • 1. mise run run-scaffold を通じて assets/workflow.json、assets/execution-ownership.json、および assets/context-routing.json を読んでください。順序、担当者、ルート、およびルートハッシュは固定のままにしてください。
  • 2. references/intake.md を読み、mise run run-start を通じて assets/run-intake.schema.json に事実を記入してください。必要な事実がない場合は、影響を受ける作業のみを停止してください。
  • 3. mise run run-start --intake INPUT --run-dir RUN を実行してください。
  • 4. RUN はこのスキルフォルダーの外に置いてください。そのファイルやフィールドを手作業で作成しないでください。
  • 5. 次のパケットで指定されたすべてのパスを読んでください。
  • 6. パケットで人によるレビューが求められている場合は、両方のレビュータスクを実行してください。
  • 7. 各実行ファイルの書き込み担当者は1人にしてください。

このタスクは、固定された実行フォームとルートハッシュを書き込みます。状態、ルール、オプション、または結果は選択しません。

すべてのアクションを順番に完了する
  • mise run task-graph を通じて、assets/workflow.json のすべてのアクションに従います。実行前に、指定された各ソースを読み込みます。指定された証拠を保存します。
  • 各実行タスクは、自分の順番が来る前の作業を拒否します。
  • 1つのアクション内では、入力が確定した後、独立した読み取り、レンダリング、キャプチャ、チェックをまとめて実行します。
  • run-start はアクション1と2を完了します。次のアクションは source_meaning でなければなりません。
  1. [CTX-FREEZE-INTAKE] freeze_intake。 Mise:mise run run-start で受付内容を確認し、凍結します。モデル:references/intake.md と evals/files/missing-proof.json をそのタスクを通じて適用し、事実を決して捏造しません。
  2. [CTX-LIST-CAPABILITIES] list_capabilities。 Mise:mise run run-scaffold で固定された機能フォームを提示します。モデル:references/failure.md をそのタスクを通じて適用し、構造を視覚または操作の証拠として決して扱いません。
  3. [CTX-SOURCE-MEANING] source_meaning。 Mise:mise run run-packet で references/research.md、evals/source-mapping.json、evals/context-cases.json を処理します。モデル:ソースの意味と反証を記録します。
  4. [CTX-STATE-JUDGMENT] state_judgment。 Mise:mise run run-packet、mise run review-checklist、mise run human-sweep を実行します。モデル:references/product-states.md をこれらのタスクを通じて適用し、プロダクトの状態を見つけます。
  5. [CTX-SELECT-RULES] select_rules。 Mise:mise run run-select-rules --run-dir RUN を実行します。モデル:assets/simplicity-contract.json と references/decisions.md をそのタスクを通じて適用し、固定された拒否順序を維持します。
  6. [CTX-ATOM-JUDGMENT] atom_judgment。 Mise:mise run run-packet を実行します。モデル:assets/lineage.schema.json と evals/files/valid-lineage.json をそのタスクを通じて適用し、証明されたアトムのみを判定します。
  7. [CTX-PART-DESIGN] part_design。 Mise:mise run run-packet と mise run lineage-file MANIFEST を実行します。モデル:evals/files/skipped-lineage.json をこれらのタスクを通じて適用し、ロックされた下位オーナーからのみ構築します。
  8. [CTX-SCREEN-DESIGN] screen_design。 Mise:mise run run-packet を実行します。モデル:references/build.md と examples/context-packets.md をそのタスクを通じて適用し、証明されたパーツから画面を構築します。
  9. [CTX-MOTION-JUDGMENT] motion_judgment。 Mise:mise run run-packet と mise run human-sweep を実行します。モデル:references/review.md をこれらのタスクを通じて適用します。静止画から動きを推測してはなりません。
  10. [CTX-VISUAL-REVIEW] visual_review。 Mise:mise run run-packet、mise run review-checklist、mise run human-sweep を実行します。モデル:assets/review-record.schema.json をこれらのタスクを通じて適用し、現在のピクセルと使用状況を確認します。
  11. [CTX-PLAIN-READBACK] plain_readback。 Mise:mise run run-packet を実行します。モデル:evals/cases.json をそのタスクを通じて適用します。誤った状態にある明瞭な文言を決して受け入れてはなりません。
  12. [CTX-CHECK-LINEAGE] check_lineage。 Mise:assets/lineage.schema.json を使って mise run lineage-file MANIFEST --run-dir RUN を実行します。モデル:結果はリンクと証拠の範囲にとどめ、デザイン品質には及ぼしません。
  13. [CTX-FINAL-CHECK] final_check。 Mise:まず mise run run-check --run-dir RUN を実行し、次に evals/contract.md と evals/rubric.md を使って mise run complete を実行します。モデル:タスクの証拠をデザインの証拠にすり替えようとする試みはすべて拒否します。
各モデルパケットを作成する
  • mise run run-packet --run-dir RUN --action ACTION を実行します。assets/context-bundle.schema.json を適用し、そのルートを読み込んで、使用したコンテキストまたは不足しているコンテキストを記録します。必須のコンテキストが不足している場合は BLOCKED です。
  • 互いに異なる出発点を少なくとも4つ作成します。既知のもの、製品に沿ったもの、逆方向のもの、奇抜なものを含めます。状態、構造、言葉、アクション、動き、音、触覚、アクセシビリティ、プラットフォーム、サービスへの影響にわたって、追加、分割、組み合わせ、または反転させます。それぞれにシーン、主張、証拠、コスト、拒否条件、テスト、新規性に関する注記を付けます。証拠または拒否条件によって却下されるまでは、大胆な選択肢を残しておきます。
  • デザインレイヤーを残す前に、mise run test を通じて references/controlled-comparisons.md を適用します。視認する前に、素材の方向性を比較し、証拠を確定させます。選択の判断には、現在の視覚、脳、触覚、悪いデザイン、悪い出力、悪い実践に関する知見を用います。小さな最適化には、リクエスト、欠陥、またはしきい値を示す証拠が必要です。
  • mise run test を通じて references/build.md に正規のフォーカス・意図レコードを作成します。その人が何に、どこで、いつ、どのように、なぜ、どの順序で気づくべきかを判断します。フィールドや目立ちやすさだけでは、成功の証明になりません。
  • 次のアクションに進む前に、mise run run-record --run-dir RUN --result RESULT で結果を保存します。

デザインを判断する

mise run run-select-rules を通じて references/decisions.md を assets/simplicity-contract.json と併用します。デザイン上のすべての選択はモデルが担います。

拒否条件と失敗ルール
  • 拒否条件は、安全性、アクセシビリティ、理解、主体性、タスクの成功、慣習、表現、新規性、構築コストの順に適用します。
  • 安全性、アクセシビリティ、理解、主体性を犠牲にしてはいけません。コスト、リスク、作業、制御を隠してはいけません。
  • 不足している事実、権利、情報源、視認性、アトムの証明、コンテキスト、衝突、変更について、mise run run-check を通じて references/failure.md を確認します。
  • 該当する主張には BLOCKED を返します。失敗したゲート、不足している証拠、関連する要素、安全に進められる作業、再開するための最小限の方法を明記します。
  • 観察された作業を、その作成者ではなく DEFECT、MEDIOCRE、SLOP、または PASS として診断します。最低基準を満たしたこと、よく知られた慣習、珍しいスタイル、構築のしやすさ、数値平均によって、別のゲートの失敗を打ち消すことはできません。
製品の状態を見つける
  • mise run run-packet を通じて references/product-states.md、assets/state-record.schema.json、examples/product-states.md、evals/section-support-cases.json を読み、その後 mise run review-checklist と mise run human-sweep を実行します。
  • 閉じたリストではなく、証拠から状態を見つけます。人、目標、過去の行動、データ、システム、場所、デバイス、入力、時間、コンテンツ、関係者、リスクを確認します。状態は重複したり、入れ子になったり、矛盾したり、変化したりすることがあります。
  • 互いに異なる対応を作成します。原因、関連、証拠、不確実性、トレードオフ、選択を記録します。不明、混在、古い、短期間、同時進行の状態も未確定のままにします。非公開の思考の連鎖を求めてはいけません。
すべてのレビュー不変条件を実行する
  • 固定 ID には mise run review-checklist、未確定のプロンプトには mise run human-sweep を実行します。このタスクを通じて references/review.md を適用します。
  • 目、頭、手触り: 視線の順序、グループ、変更、コンテンツ、正確性、アクション、記憶、言語を確認します。フィードバック、リスク、対象、間隔、リーチ、手がかり、ジェスチャー、修復、労力も確認します。
  • 失敗: 重なり、クリッピング、操作不能なコントロール、作業の消失、行き止まり、誤ったフォーカスを許容しません。隠れた状態、古い証拠、弱い選択肢、残留物、ステータスが混在する領域、先送りされたクリーンアップも許容しません。
  • 証拠: 事実、視認、推論、変更を分けます。NOT_APPLICABLE には証明が必要です。証明がない場合は BLOCKED です。ソースまたは製品に変更があった場合、影響を受けるキャプチャとチェックは無効になります。
  • 回答: 状況、観察、証拠、選択、理由、選択肢、コスト、拒否理由、疑念、明示した推定を示します。
  • 品質: mise run human-sweep を通じて references/review.md を適用します。正確性、アクセシビリティ、タスク、知覚を確認した後に、一意性、標準への準拠、親しみやすさを求めます。視線、思考、手触り、全体像、詳細、レスポンシブ、入力経路の証拠を保持します。
証明済みの部品から構築する
  • アトムまたは部品の作業を始める前に、mise run lineage-file を通じて references/build.md を読みます。
  • token proof -> tokens -> atoms -> molecules -> organisms -> UI composition templates -> screens -> flows の順に進めます。
  • UI コンポジションテンプレートは、再利用可能な画面構造です。Code Connect マッピングテンプレートは、リポジトリのマッピング成果物です。これは製品デザインのレイヤーではなく、どちらの種類ももう一方の証明にはなりません。
  • すべてのソーストークンとアトムに対して、現在の dtcg-tokens スキルを実行します。その手順を繰り返して説明しないでください。
  • そのスキルまたは証明がない場合は、アトムのゲートで停止します。画面で低レベルのルールを新たに作ってはいけません。
  • 低レベルの変更後は、リンクされた高レベル部品をすべて古い状態としてマークします。影響を受ける部品をすべて再構築し、レビューします。
  • mise run lineage-file MANIFEST を実行します。リンク、順序、ループ、古い部品、未使用の部品をチェックします。品質は判定しません。

証明して完了する

保存する証明には assets/model-record.schema.json を使い、mise run run-record を実行します。最終ゲートには evals/contract.md を使い、mise run evals を実行します。

モデル作業を記録する
読み取りとパッケージの管理元
  • assets/reading-contract.json と assets/reading-exceptions.json は、mise run reading を通じて読み取りルールを管理します。SKILL.md は標準的な YAML ヘッダーと、移植性のある CommonMark のみを使用します。公開変更の後に限り、mise run generate を通じて references/generation-contract.md を読みます。
  • assets/file-manifest.json は mise run file-manifest を通じて役割を管理します。evals/source-lineage.json は mise run source-lineage を通じてハッシュを管理します。assets/workflow.json と assets/execution-ownership.json は mise run run-scaffold を通じて実行の形式を管理します。
  • mise.toml は mise run task-graph を通じてタスクを管理します。.github/workflows/ci.yml は mise run ci を呼び出します。UTF-8、LF、ATX 見出し、ブロック間の空行、相対リンクを維持します。すべてのブロックを整然と、読みやすく、エージェントが解析できる状態に保ちます。
  • mise run skill-info を実行し、変更した公開ソースを mise run generate で再生成してから、mise run complete で完了します。Mise は独立したチェックを並列で実行し、必須タスクをキャッシュしたりスキップしたりしません。
Eval の担当範囲
返却と完了

完了チェックリスト:

  • プロダクトファイルと実行証明を返します。ソース、ギャップ、状態、選択肢、選択、レビュー、アトム証明、リンク、古い部分、コンテキストのギャップ、拒否事項を明記します。examples/run.md と examples/failure-missing-proof.md の停止形式に従い、mise run examples で実行します。
  • PASS、STALE、BLOCKED のみを使用します。タスクの合格を、ピクセル、使用、アクセス、価値に関する主張に決して置き換えないでください。すべてのレコードとコンテキストのパスが存在し、必要な各ビューが確認済みで、未解決の拒否事項がないことを確認します。
  • mise run run-check --run-dir RUN を実行します。続けて mise run complete を実行します。
  • mise run complete がコード 0 で終了した後に限り、PASS を返します。
  • 任意の最終ステップ: 必須のプロダクト作業が合格した後、mise run improvement-policy を実行し、担当箇所のうち名前を指定した 1 つの部分を最小単位で変更してから、mise run complete を再実行します。その部分が改善した場合に限り、変更を維持します。速度、真実性、視認性、選択、テスト、および現在のすべてのルールを悪化させてはなりません。いずれかが悪化した場合は、最後に合格したバージョンに戻し、そのダイジェストを確認します。

コメント