コーディングエージェントのためのデザイン文脈
コードを書けるエージェントに、デザイン判断と根拠を渡す。
oh-my-design は、品質グレード付きリファレンスと再利用できるデザインワークフローを、普段使っているコーディングツールへ導入します。対応するツールには専門エージェントの役割も追加されます。導入後は、作りたい画面を自然言語で依頼できます。
必要な成果から始める
スキル名を覚える必要はありません。作りたい画面と守る条件を伝えると、適切なワークフローが選ばれます。
デザインシステムを作る
製品ブリーフと verified_v2 リファレンスから、プロジェクト所有の DESIGN.md を作ります。不明な事実は補完しません。
プロンプト
“家族向け資産管理アプリに、落ち着きと信頼感のあるデザインシステムを設定して。Toss を参考にしつつ、既存のロゴとコピーは維持して。”
結果
DESIGN.md、エージェント用 shim、明示的なトークン差分、確認済みの最初の画面。
完全な画面を作る
Discovery、IA、ワイヤーフレーム、コンポーネント、コピー、アクセシビリティ、検証を一つのチェックポイント付きフローで進めます。
プロンプト
“このアプリのオンボーディングを設計・実装して。現在のスタックを維持し、DESIGN.md を正本として使って。”
結果
動く画面、状態網羅、検証記録、リポジトリ内のハンドオフ成果物。
既存UIを改善する
製品の挙動を保ったまま、階層、リズム、アクセシビリティ、典型的なAI UIパターンを修正します。
プロンプト
“URLとフォーム名は変えずに料金ページを改善して。影響の大きい修正を適用し、結果を検証して。”
結果
焦点を絞ったコード変更、前後の根拠、決定論的な品質チェック。
CLI はコーディングエージェントの作業環境を整えます。
バンドルには20の製品スキル、18のエージェント定義、品質グレード付き DESIGN.md 440件があります。内訳は verified_v2 141件、partial 159件、legacy snapshot 140件で、公開デモには verified_v2 を使います。Claude Code、Codex、OpenCode には互換スキル・役割・カタログが入り、Cursor にはプロジェクトルールとカタログが入ります。
製品スキル20個 · 専門エージェント18個 · verified_v2 141 / partial 159 / legacy 140 · インストール時の AI 呼び出し0回
1つのコマンド、その後に1つの製品プロンプト
プロジェクトルートで実行します。インストーラーが利用中のエージェントを検出し、対象チャネルを選べます。
npx oh-my-design-cli@latestnpx oh-my-design-cli@latest doctorエージェントを再起動し、doctor を一度実行してから欲しい画面を説明してください。デーモン、APIキー、MCPサーバーは不要です。
現在のデザインスキル潮流に OmD が加えるもの
anti-slop の判断を、好みだけでなくプロジェクトの DESIGN.md に固定します。
監査の語彙と決定論的ゲートに、リファレンス証拠とマルチエージェント実行を加えます。
未検証のブランド値を、もっともらしいフォールバックで埋めません。
Builder は視覚的リファレンスの入口として残し、CLI はその文脈をコードベースへ運びます。