デザイン標準づくりで最も多い失敗は、作れないことではなく 作った後に使われないこと です。ここでは、標準を運用に載せるための仕組みを扱います。
誰が持つのかを決める
| 体制 | 向いている組織 | 注意点 |
|---|---|---|
| 専任チーム | 画面数が多く、複数プロダクトがある | 現場から遠くなると実態と乖離する |
| 兼任のワーキンググループ | 情シス部門で内製・準内製している | 定例の時間を確保しないと自然消滅する |
| 有志のオーナー1名+レビュー体制 | 小〜中規模、ベンダー主体の開発 | 属人化するため、文書化を必須にする |
体制の形はどれでも構いませんが、「この標準の変更を承認する人が誰か」が明確であることだけは必須です。ここが曖昧だと、議論が止まった場所で標準も止まります。
命名規則を先に決める
コンポーネント名が設計書・デザインツール・実装で食い違うと、会話のたびに翻訳が発生します。
- 役割で名付ける:`BlueButton` ではなく `PrimaryButton`
- 業務用語を混ぜない:`OrderTable` ではなく `DataTable`(業務固有は使う側で命名)
- 階層は2語まで:`SearchConditionPanelHeaderTitle` のような名前は破綻の兆候
- 同じ名前を3か所で使う:設計書・Figma・コードで完全一致させる
標準を「読ませる」のではなく「通す」
人はガイドラインを読みません。したがって、読まなくても守れる導線を作ります。
実装で守らせる
最も強力な方法です。共通コンポーネントを提供し、標準どおりに作るのが一番ラクな状態にします。生の色コードを禁止するLintルールを入れると、逸脱が物理的に減ります。
レビューで拾う
設計レビューのアジェンダにチェックリストを組み込みます。「良い/悪い」ではなく「標準に適合しているか」で会話することで、指摘が個人攻撃になりません。
テンプレートで配る
新規画面を作るとき、白紙から始めさせない。一覧画面・入力画面・確認画面のテンプレートを用意しておけば、標準は自動的に引き継がれます。
発注仕様書に「画面は本デザイン標準に準拠すること」と明記し、標準そのものを添付してください。検収条件に含めておくと、後から直す交渉が不要になります。
例外を禁止しない
標準は必ず例外に出会います。例外を認めない運用にすると、現場は標準を無視するという形で例外を作ります。
- 対象画面/コンポーネント
- 標準のどのルールから逸脱するか
- 理由(業務上の制約・技術的制約)
- 暫定か恒久か。暫定なら見直し時期
- 承認者と承認日
同じ理由の例外が3件たまったら、それは標準側を直すべきサインです。例外の蓄積を、標準の改訂トリガーとして扱ってください。
改訂フローとバージョン管理
| 変更の種類 | 例 | 進め方 |
|---|---|---|
| 追加(後方互換あり) | 新しいコンポーネントの追加 | オーナー承認のみ。都度リリース |
| 変更(既存画面に影響) | ボタンの高さを40px→36pxに変更 | 影響範囲の調査+移行期限を設定 |
| 廃止 | 旧テーブルコンポーネントの廃止 | 非推奨として告知 → 猶予期間 → 削除 |
標準にもバージョン番号を付け、変更履歴を残します。「いつから変わったのか」が追えないと、既存画面が違反なのか旧版準拠なのか判別できません。
形骸化を防ぐ計測
- 共通コンポーネントの利用率(全画面のうち何割が共通部品を使っているか)
- 例外申請の件数と、その内訳
- 設計レビューでの指摘件数の推移(減っていれば標準が効いている)
- 画面別の問い合わせ件数(標準適用前後で比較)
- 新規画面の設計にかかった時間
経営層への報告では、見た目の統一ではなく「設計工数の削減」「問い合わせ件数の減少」「教育期間の短縮」で語ってください。デザイン標準への投資が継続されるかは、この翻訳ができるかで決まります。
半年後に見直すべきこと
使われていないコンポーネントはないか
利用率が極端に低い部品は、要件に合っていないか、存在が知られていないかのどちらかです。削除するか、周知し直すかを判断します。
ドキュメントと実装がずれていないか
最も起きやすい劣化です。実装のほうが先に進むため、定期的に突き合わせる時間を確保してください。理想は、実装からドキュメントを自動生成する仕組みです。
標準に載っていない判断が増えていないか
レビューで毎回同じ議論が出ているなら、その論点は標準に追加すべきです。「二度議論した論点は標準に書く」というルールを持っておくと、標準は自然に育ちます。
チェックポイント
- 標準の変更を承認する人が明確になっている
- コンポーネント名が設計書・デザインツール・実装で一致している
- 共通コンポーネントとテンプレートが提供されている
- 例外を申請・記録する場所がある
- 標準にバージョンと変更履歴がある
- 効果を測る指標が決まっている