テック技報最新号へ →
デザイン

DESIGN.mdは「雰囲気の言葉」より「値」を書き、値には「なぜ」を添えて、使いながら育てる

「上品でミニマル」のような形容は解釈がぶれる。トークンと具体的な値を中心に書き、ルールには理由を書く。最初から完璧を目指さず、違和感が出るたびに書き足す。

@HikaruTayama · 投稿 2026-04-10
#AIデザイン#DESIGN.md#デザインシステム#コーディングエージェント

どんな問題を解決するか / いつ使うか

DESIGN.mdを置いたのに画面を増やすほどUIがバラバラになるとき。AIが雰囲気の言葉を勝手に解釈して想定外のデザインにするとき。

やり方

  1. 冒頭の「デザインの雰囲気・テイスト」の説明は短くし、色・文字サイズ・余白・角丸などの値（トークン）を中心に書く。雰囲気の言葉が長いと、AIがそこから勝手に想像して外れやすい。
  2. 各ルールには「なぜそうするのか」を1行添える（例：「カードの影は使わない。理由：情報量の多い一覧で境界が増えて読みにくくなるため。区切りは余白で作る」）。理由があると、ルールに書かれていない画面でもAIが同じ判断をしやすい。
  3. 完璧に作ってから使うのではなく、まず使って、違和感が出たら直す。修正で決めたことはその場の指示で終わらせず、DESIGN.mdに書き戻す。
  4. 人間も読むガイドラインとして整えると、デザイナーとエンジニアの両方が確認・更新しやすくなる。

注意点・対応状況

  • 値と理由の両方を書くとファイルが長くなる。よく使う部分を上に置き、細かい部分は別ファイルに分けて参照させる。

出典

X の元の投稿を開く