ライブデモの進行ガイド
実際のプロダクトが変わる瞬間を見せる。
良い oh-my-design のデモは、スキル名を順に紹介する場ではありません。目に見える課題を一つ選び、既存の大切な挙動を守りながら、誰でも確認できる根拠とともに実際のルートで完了させます。
成果を証明できる最小の形式を選ぶ
時間で削るのは作業範囲であり、根拠ではありません。開始前に形式を一つ選び、変更しないものも明示します。
目に見える問題を一つ直す
既存ページは動くものの、平凡または分かりにくい場合
挙動を維持しながら、階層・余白・状態・アクセシビリティのうち影響の大きい課題を一つ修正します。
変更前の表示、焦点を絞った差分、同じ実ルートで動く変更後の表示。
小さな画面を完成させる
技術スタックとコンポーネントがあり、フローの範囲が明確な場合
プロジェクトのデザイン文脈を使い、小さな画面と loading・empty・error・success の各状態を実装します。
動作するルート、状態の網羅、変更ファイル、実際に実行したチェック。
チェックポイント付きハーネスを動かす
新規または曖昧で、調査とデザインシステム判断が必要な場合
承認ゲートを省略せず、Discovery から Journey、DESIGN.md 提案、実装、検証まで進めます。
Journey、DESIGN.md patch、動作する UI、検証サマリー、3回のユーザーチェックポイント。
繰り返し使える6ステップ
ミートアップ、ワークショップ、画面収録でも同じ順序を使えます。CLI は環境を整え、UI の変更はコーディングエージェントがリポジトリ内で行います。
- 01
目に見える課題と、守る挙動を一つずつ決める
実際のルートを開き、観客が確認する箇所を正確に示します。URL、データフロー、フィールド名、コピー、操作のうち変更してはいけないものも宣言します。
- 02
バンドルを導入し、doctor で実態を確認する
プロジェクトルートで2つのコマンドを実行し、導入後にコーディングエージェントを再起動します。インストール成功そのものを成果として見せないでください。
npx oh-my-design-cli@latest npx oh-my-design-cli@latest doctor - 03
DESIGN.md と verified_v2 根拠を整合させる
公開デモには verified_v2 リファレンスを選びます。既存の DESIGN.md と一緒に読み込ませ、その製品画面に属する根拠だけを採用し、不明なフォント、トークン、コンポーネントは空欄のままにします。
- 04
実際の画面と重要な状態を実装する
既存のスタックとコンポーネントを使います。新しいフローでは、静的な成功画面だけでなく、利用者が実際に遭遇する状態まで扱います。
- 05
実ルートで監査する
製品ルートを開いて保護した挙動を操作し、必要なアクセシビリティと interface-feel のチェックを行います。実行した検査と測定値だけを報告します。
- 06
利用者からの修正を記録する
視覚的な判断について修正を受けたら、その範囲だけを直し、omd:remember に残します。次のセッションで同じ誤りを繰り返さないためです。
5分の改善デモで使うプロンプト
最初に DESIGN.md を読み、現在の製品ルートを確認してください。URL、データフロー、フィールド名、既存のユーザー挙動を維持したまま、このページで目に見える階層または状態の問題を一つ改善してください。公開デモには verified_v2 リファレンスを使い、この製品画面に属する根拠だけを整合させます。不明な値はフォールバックで埋めずに省略します。実際の画面へ実装し、重要な状態を扱ったうえで、そのルートを検証し、変更ファイルと実行したチェックを報告してください。DESIGN.md の拡張や必須ハーネスチェックポイントを越える前には確認してください。観客がその場で確認できる証拠
進行中に次の記録を残します。追跡できる過程がない美しいスクリーンショットだけでは、監査可能なデモになりません。
変更前の画面と、最初に指摘した一つの課題
保護する挙動まで含めた正確なプロンプト
DESIGN.md の差分と、意図的に省略した未確認フィールド
切り離したモックではなく、重要な状態を含む実際の製品ルート
変更ファイルと、実際に行った検査または測定
範囲を定めた永続的な好みとして記録したユーザー修正
驚きを誠実に伝えるためのルール
CLI は導入と診断を担当します
導入された文脈を読み、UI を変更するのはコーディングエージェントです。インストーラー単体が画面を生成したとは説明しません。
不明なものは空欄のままです
欠けたブランド情報をシステムフォント、汎用コンポーネント、推測トークン、別のマーケティング画面で補いません。
演出より証拠を優先します
実測した前後比較がなければ、速度、コンバージョン、アクセシビリティ、性能の向上を主張しません。
必須チェックポイントは省略しません
30分のハーネスでも Journey、DESIGN.md patch、検証の承認で停止します。ライブであることは省略の理由になりません。