セマンティックHTML/JSXとWAI-ARIAを「最小で正しく」適用し、キーボード操作・スクリーンリーダ・コントラスト等を満たす実装を作るための判断軸。ネイティブ要素優先、ARIAの過剰使用を避ける。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
【穴埋め雛形】このプロジェクト固有の「存在設計・体験設計」のSSOT。judgment-harness のプロジェクト層スキルとして、立ち上げ時に本ファイルを埋めて使う(雛形のままなら未確定=推測で決めない)。デザイン/UI/モーション/コピーの方針判断、見た目や体験のトーン決め、画面・コンポーネント設計の前段で必ず参照する。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
설치 방법 보기설치하기 전에 에이전트에게 전달되는 지시 내용을 확인할 수 있습니다.
このスキルは、このプロジェクトに固有の決定(what / why)を1か所に束ねるプロジェクト層スキル。 汎用の判断軸(how)は既存スキルに委譲し、ここにはこのプロジェクトだけの値・方針を書く。
使い方(雛形の埋め方):
- プロジェクト立ち上げ時に
{...}を対話で埋める(judgment-harnessの発酵ループ参照)。- 推測で埋めない。決まっていない項目は
TBDと明記し、確定したものから反映する。- プロジェクトに合わせて name / description / 本文の呼称を書き換えてよい(例:
design-language)。
固有の決定を下すときの「判断ロジック」は以下を併用する。重複して書かない。
| 観点 | 委譲先スキル |
|---|---|
| 描く瞬間の規律(コンセプト導出線/材質/引き算/シグネチャ表現) | art-direction |
| 情報設計・状態・コンポーネント/トークン化 | ui-designer |
| なぜ動かす/どう動かす(モーションの原則) | animation-principles |
| 音・触覚・空間など視覚外チャネル | sensory-design |
| 表現品質(動き/触感/視線誘導)の実装制約化 | creative-coder |
| デザインツール→壊れない実装への翻訳 | frontend-implementation |
| アクセシビリティ(セマンティクス/コントラスト/操作) | accessibility-engineer |
| 認知負荷・エラー防止・学習コスト | usability-psychologist |
| 想定ユーザー像の言語化 | persona-designer |
| 視覚テイスト等の固有の作法(演出層スキルを作った場合) | {演出層スキル名 / なければ削除} |
ルール: 「どう判断するか」は上記。「このプロジェクトでは結局どう決めたか」は本ファイル。
個人・組織のデザイン判断基準(例: design-brain)を持っている場合にパスを記入する。 テンプレートには「欄」だけを置き、中身は各自の環境に属する(OSS配布物に個人の審美眼を埋め込まない)。 未記入なら本セクションはスキップしてよい。
規範(守る)と逸脱(意図的に外す)を対で書く。"らしさ"は逸脱から生まれる(
judgment-harness参照)。
確定するたびにここを更新する。値が入るまでは実装で勝手に決めない(推測禁止)。 確定した値は最終的に
doc/input/design/のSSOT(tokens等)と同期する。
| 項目 | 決定 | 状態 |
|---|---|---|
| 全体の質感ワード(3語) | {…} | TBD |
| 材質(コンセプトの手触り。影/ハイライト/彩度の導出元) | {例: マット・紙・水彩} | TBD |
| 背景・基調トーン | {…} | TBD |
| キーカラー / アクセント | {…} | TBD |
| 角丸・線・影の方針 | {…} | TBD |
| 余白の刻み(spacing scale) | {…} | TBD |
| タイポ(見出し / 本文 / 和欧) | {…} | TBD |
art-direction)| 項目 | 決定 | 状態 |
|---|---|---|
| タグライン(体験を一文で。画面にも打つ) | {…} | TBD |
| シグネチャ表現(テーマ由来の固有表現を主要インタラクションのどこに) | {…} | TBD |
引き算の禁止則(このプロジェクト固有。無ければ art-direction の既定を使う) | {例: 情報はカードで囲わない / 塗りは主CTAのみ} | TBD |
animation-principles)| 項目 | 決定 | 状態 |
|---|---|---|
| モーションの役割(演出主体 / 補助のみ) | {…} | TBD |
| 基準デュレーション / イージング | {…} | TBD |
| 遷移の質感(カット / フェード / 連続変形 など) | {…} | TBD |
| reduced-motion 時の代替挙動 | {…} | TBD |
| 項目 | 決定 | 状態 |
|---|---|---|
| 一人称 / 二人称 / 文体 | {…} | TBD |
| 語り口(ユーザータイプ別にあれば分ける) | {…} | TBD |
| 多言語方針 | {…} | TBD |
아직 리뷰가 없습니다. 사용해 본 소감을 남겨 주세요.
로그인 없이 쓸 수 있습니다. 사용 후기, 질문, 작동하지 않은 환경 등을 편하게 남겨 주세요.
아직 댓글이 없습니다. 첫 댓글을 남겨 보세요.
セマンティックHTML/JSXとWAI-ARIAを「最小で正しく」適用し、キーボード操作・スクリーンリーダ・コントラスト等を満たす実装を作るための判断軸。ネイティブ要素優先、ARIAの過剰使用を避ける。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Agent Browser(Headlessブラウザ自動化CLI)を使ったUI検証・E2Eテスト・スクリーンショット取得の判断軸。アクセシビリティツリーベースの要素選択を優先し、壊れにくいテスト設計を目指す。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
ディズニーの12原則とジブリ的自然運動をベースに、UIアニメーションの「なぜ動かすか」「どう動かすか」を判断する。アニメーション/モーション/トランジション設計の相談で、ツール非依存の概念的判断軸として使う。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
アーキテクチャ設計(境界/依存/データフロー/非機能/運用)を、制約とトレードオフで言語化し、ADR-liteで合意形成しながら段階的に形にする。doc/input/rdd.md にアーキテクチャ/非機能/運用の要求がある、または設計判断(分割/責務/インタフェース/データ整合/観測性/スケール)相談で使う。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
事業仮説を支える一次/二次情報を整理し、意思決定に足る「根拠」「不確実性」「次の調査」を可視化する。でたらめな引用や推測の断言を避け、出典の実在を重視する。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
体験品質(動き/触感/視線誘導)を「実装可能な制約」に落とし、アクセシビリティとパフォーマンスを犠牲にせずに表現を実現する。UIの表現・アニメーション・インタラクション設計/実装の相談で使う。
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.