「いい感じ」を言語化する技術 ― 感覚を具体的なデザイン用語に落とし込む方法

「なんかいい感じにして」の破壊力

デザインの現場で最も厄介な言葉、それは「なんかいい感じにして」です。

これはデザイナーに依頼する側だけの問題ではありません。自分自身が絵を描いたりデザインを作ったりするとき、「なんかしっくりこない」「これじゃない感がある」「もうちょっとこう……いい感じに」と感じた経験はありませんか？ 問題は「何がどう良くて、何がどう悪いのか」を言葉にできないことです。

感覚を言語化できないと、3つの大きな問題が生まれます。

• 自分の作品を改善できない ― 「なんか違う」と感じても、何をどう直せばいいか分からない。闇雲にいじっているうちに元よりも悪くなる
• 他人に伝わらない ― デザイナーや絵師への依頼、チームでのフィードバックで「もっとこう……いい感じに」しか言えない。修正が迷走する
• AIに伝わらない ― AI画像生成のプロンプトが「beautiful illustration」「nice design」のような曖昧な指示に留まり、意図した出力が得られない

逆に言えば、感覚を言語化できるようになると、すべてが変わります。自分の改善ポイントが明確になり、他人への指示が的確になり、AIへのプロンプトが精密になる。この記事では、「いい感じ」を具体的なデザイン用語に分解する技術を解説します。

これまでの記事で学んできた視覚的ヒエラルキー、4原則、視線誘導、余白、光と影の色――これらの知識は、まさに「感覚を言語化するための語彙」です。この記事はそれらの総まとめ的な位置づけでもあります。

なぜデザインの感覚は言葉になりにくいのか

そもそも、なぜ「いい感じ」を言語化するのはこんなに難しいのでしょうか。これには心理学的・構造的な理由があります。

理由1: 視覚は言語より速い

人間がデザインの良し悪しを「感じる」のは一瞬です。脳は0.05秒でWebサイトの第一印象を形成するという研究結果があります。しかし、その印象を「なぜそう感じたか」と分析して言語化するのは、はるかに遅い認知プロセスです。「感じる」と「説明する」の間には大きなギャップがあります。

理由2: 複数の要素が同時に作用している

「いい感じ」のデザインは、色、形、余白、タイポグラフィ、レイアウト、コントラスト、バランスなど複数の要素が同時に調和した結果です。ひとつの要素だけが良いのではなく、すべてが絡み合って「いい」を形成しています。この複合的な印象をひとつの言葉に要約することは本質的に難しい作業です。

理由3: 語彙が足りない

最も実用的な問題がこれです。「この色の組み合わせが心地よい理由」を説明するのに「色相」「彩度」「補色」「類似色」「トーン」といった用語を知らなければ、「なんかいい色」としか言えません。語彙がないと分析ができず、分析ができないと改善ができない。

これは外国語と同じです。語彙が増えれば、表現の精度が上がる。デザインの語彙を増やすことは、「デザインという言語の習得」なのです。

「いい感じ」を分解する5つの観察軸

「いい感じ」を言語化するための最初のステップは、漠然と全体を見るのではなく、観察する軸を分けて見ることです。ここでは、どんなデザインにも適用できる5つの観察軸を紹介します。

軸1: レイアウト・構図（どこに何がある？）

まず目に入るのは「配置」です。以下の視点でチェックします。

• 整列（アライメント） ― 要素が見えない線で揃っているか、バラバラか
• 近接（グルーピング） ― 関連する要素が近くにまとまっているか
• 余白のバランス ― 詰まりすぎていないか、スカスカすぎないか
• 視線の流れ ― 目がどこから入って、どう動くか
• 重心・安定感 ― 構図が左右どちらかに偏っていないか

言語化の例:

• 「左右で要素の重さ（視覚的ウェイト）が不均等で、右に偏っている」
• 「見出しと本文の間の余白が狭すぎて、グループの区切りが不明確」
• 「視線の入口となる要素がなく、どこから見ればいいか分からない」

軸2: カラー・配色（どんな色の組み合わせ？）

色に関する観察です。

• 色相の関係 ― 補色、類似色、トライアド、モノクロマティックなど
• 彩度のレベル ― 鮮やかすぎないか、くすみすぎていないか
• 明度のコントラスト ― 明暗差は十分か、足りないか
• 色数 ― 色を使いすぎていないか（3〜5色が基本）
• アクセントカラー ― 目を引くポイントカラーがあるか

言語化の例:

• 「全体的に彩度が高すぎて目が疲れる。メインカラー以外の彩度を落とすと落ち着く」
• 「暖色系で統一されていて温かみがあるが、アクセントの寒色が1色入ると引き締まる」
• 「背景と文字の明度差が小さくて読みにくい」

軸3: タイポグラフィ（文字の扱い方）

文字のデザインに関する観察です。

• フォントの選択 ― 内容の雰囲気に合っているか（ゴシック、明朝、手書き風など）
• サイズの階層 ― 見出し、本文、キャプションのサイズ差（ジャンプ率）は適切か
• 行間・字間 ― 読みやすいスペーシングになっているか
• ウェイト（太さ） ― 強調すべき部分が太く、それ以外が標準になっているか
• 文字揃え ― 左揃え、中央揃え、右揃えの使い分けは適切か

言語化の例:

• 「見出しと本文のフォントサイズ差が小さくて（ジャンプ率が低い）、情報の階層が伝わらない」
• 「丸ゴシックの柔らかさと記事の真面目なトーンが合っていない。角ゴシックか明朝体が適切」
• 「行間が狭すぎて文字が詰まって見える。line-heightを1.8以上にすると読みやすくなる」

軸4: コントラスト・メリハリ（差があるか？）

デザインの「ぱっとしない」「のっぺりしている」という印象の多くは、コントラスト不足が原因です。

• 明暗のコントラスト ― 明るい部分と暗い部分の差
• サイズのコントラスト ― 大きい要素と小さい要素の差
• 色のコントラスト ― 色相・彩度の差
• 形のコントラスト ― 直線と曲線、角と丸の対比
• 密度のコントラスト ― 密集した部分とスカスカな部分の差

言語化の例:

• 「全体的にサイズが均一で、どこが重要か分からない。タイトルを2倍以上にしてコントラストをつけたい」
• 「明暗差が少なくてフラットに見える。背景をもう少し暗くするか、テキストをもう少し明るくする」
• 「要素の密度が均一すぎて単調。密集ゾーンと余白ゾーンのメリハリが欲しい」

軸5: トーン・雰囲気（どんな印象を受ける？）

最も主観的な軸ですが、これを言語化できると強力です。

• 温度感 ― 暖かい / 冷たい / ニュートラル
• 重さ ― 軽やか / 重厚 / どっしり
• 動き ― 静的 / 動的 / エネルギッシュ
• 時代感 ― モダン / レトロ / 未来的 / クラシック
• 人格 ― フレンドリー / フォーマル / 遊び心がある / 真面目

言語化の例:

• 「冷たくシャープな印象にしたいのに、丸みのある形と暖色が多くて柔らかくなりすぎている」
• 「レトロな雰囲気を目指しているのに、フォントがモダンすぎて時代感がチグハグ」
• 「全体的に静的でおとなしい印象。対角線の構図や動きのあるモチーフを入れてエネルギーを出したい」

即使える「言語化フレームワーク」3選

観察の軸が分かったら、次は「型（フレームワーク）」に当てはめて言語化する練習です。白紙の状態から言葉を絞り出すのは大変ですが、型があれば埋めるだけです。

フレームワーク1: 「○○が△△だから、□□に見える」

最もシンプルで強力な型です。デザイン要素（○○）の具体的な状態（△△）が、印象・結果（□□）を生んでいる――この3つを埋めるだけです。

• 「フォントサイズのジャンプ率が小さいから、情報の優先度が分かりにくい」
• 「背景色と文字色の明度差が30%未満だから、読みにくい」
• 「メインの被写体の周囲の余白が十分にあるから、主役が際立って高級感がある」
• 「暖色と寒色がバランスよく配置されているから、視覚的なリズムがあって飽きない」

この型の良いところは「根拠 → 結果」の因果関係が明確になることです。「なんかダサい」が「ジャンプ率が低いから階層が伝わらない」に変われば、改善方法も自動的に見えます（＝ジャンプ率を上げればいい）。

フレームワーク2: 「もっと○○に / もっと○○を減らして」

改善の方向性を伝えるときの型です。曖昧な「もっといい感じに」を具体的なパラメータの増減に翻訳します。

• もっと余白を増やして（情報密度を下げて、呼吸感を出す）
• もっとコントラストを上げて（明暗差を強くして、メリハリをつける）
• もっと彩度を落として（色の鮮やかさを抑えて、落ち着いた印象に）
• もっと角を丸くして（border-radiusを大きくして、柔らかい印象に）
• 色数を減らして（3色以内に絞って、統一感を出す）
• フォントの種類を減らして（2種類以内にして、ごちゃつきを防ぐ）

「いい感じにして」は無限の解釈があり得ますが、「彩度を20%落として」は解釈がひとつだけです。パラメータレベルまで落とし込むことで、コミュニケーションの精度が格段に上がります。

フレームワーク3: 「○○と参照先の△△の共通点は□□」

参考イメージを使ったコミュニケーションの型です。「こんな感じにしたい」と参考画像を見せるとき、何を参考にしてほしいのかを明示します。

• 「このサイトの配色のトーンを参考にしたい（レイアウトではなく色味だけ）」
• 「このポスターの文字のジャンプ率と余白の取り方を参考にしたい」
• 「このイラストの光と影の色使いを参考にしたい（構図は違ってOK）」

参考画像なしに「いい感じ」を伝えるのは困難でも、参考画像＋「何を参考にするかの言語化」があれば、イメージの伝達精度は飛躍的に高まります。

これだけは覚えたいデザイン言語化用語30

語彙がなければ言語化はできません。ここでは「いい感じ」を分解するのに特に役立つデザイン用語を30個、カテゴリ別に紹介します。すべてを一度に覚える必要はありません。「あ、この感覚はこの用語だ」と気づいたときに辞書のように使ってください。

色・配色の用語

• 色相（Hue） ― 赤、青、黄などの色の種類。色相環上の角度
• 彩度（Saturation） ― 色の鮮やかさ。高いと派手、低いとくすむ
• 明度（Value / Brightness） ― 色の明るさ暗さ。デザインで最も重要な要素のひとつ
• トーン（Tone） ― 彩度＋明度の組み合わせ。パステル、ビビッド、ダーク、グレイッシュなど
• 補色（Complementary） ― 色相環で正反対の色。強いコントラストを生む
• 類似色（Analogous） ― 色相環で隣り合う色。調和しやすく落ち着く
• アクセントカラー ― 少量使うことで画面を引き締める差し色
• 色温度（Color Temperature） ― 暖色系か寒色系か。シーンの空気感を決める

レイアウト・構図の用語

• ジャンプ率 ― 見出しと本文のサイズ差。高い＝ダイナミック、低い＝落ち着き
• グリッド ― 要素を配置するための目に見えない格子線
• ネガティブスペース（余白） ― 何も置かない空間。密度とのバランスが品質を決める
• 視覚的ウェイト ― 各要素の「目立ち度」の重さ。大きい・暗い・彩度高い＝重い
• 視線誘導 ― 見る人の目の動きを意図的にコントロールすること
• 三分割法 ― 画面を3×3のグリッドに分割し、交点に要素を置く構図法
• 対称 / 非対称 ― 左右対称は安定感、非対称は動きと緊張感

タイポグラフィの用語

• セリフ / サンセリフ ― 文字の端に飾り（セリフ）があるかないか。明朝＝セリフ、ゴシック＝サンセリフ
• ウェイト ― 文字の太さ。Light, Regular, Bold, Black など
• 行間（Leading / Line-height） ― 行と行の間隔。読みやすさに直結
• 字間（Tracking / Letter-spacing） ― 文字と文字の間隔
• カーニング ― 特定の文字ペアの間隔を個別調整すること
• 可読性（Readability） ― 文章が読みやすいかどうか。行間、行長、フォントサイズが影響

印象・雰囲気の用語

• ミニマル ― 要素を最小限に削ぎ落としたデザイン。余白多め
• フラットデザイン ― 立体感や影を排したシンプルなデザイン
• スキューモーフィズム ― 現実の質感を模倣したデザイン（革の質感、木目など）
• ブルータリズム ― 生々しく、粗く、型破りなデザイン。衝撃を与える
• モーフィズム（グラスモーフィズム、ニューモーフィズム等） ― ガラス風の半透明、凹凸のある質感

「いい感じ」をフィードバックに変換する実践練習

学んだ知識を定着させるために、よくある「曖昧なフィードバック」を「具体的なフィードバック」に翻訳する練習をしてみましょう。

練習1: 「なんかダサい」を翻訳する

「ダサい」という感覚を5つの軸でチェックします。

• レイアウト → 「要素の整列が甘く、テキストのベースラインが揃っていない」
• カラー → 「色数が多すぎる（7色以上使っている）。3〜4色に絞ると統一感が出る」
• タイポグラフィ → 「フォントが3種類以上使われていてバラバラ。2種類に統一する」
• コントラスト → 「ジャンプ率が低く、全要素が同じ重さに見えて平坦」
• トーン → 「かわいい雰囲気にしたいのにフォントが硬質なゴシック体で、トーンが不一致」

練習2: 「もうちょっと高級感がほしい」を翻訳する

• 「余白を1.5倍に増やす。情報密度を下げるだけで高級感が出る」
• 「彩度を20%落とす。ビビッドカラーは庶民的に見える。低彩度で上品に」
• 「フォントをセリフ体（明朝体）に変える。セリフ体は伝統・品格の印象がある」
• 「色数を2色（黒＋1色アクセント）に減らす。モノトーン＋差し色はシンプルで洗練」
• 「装飾を削る。不要なボーダー、影、グラデーションをなくし、ミニマルにする」

練習3: 「なんか寂しい」を翻訳する

• 「アクセントカラーが不在。全体がモノトーンで視線を引く要素がない。1色差し色を追加」
• 「サイズのメリハリがない。全要素が同じサイズで単調。メイン要素を大きくする」
• 「テクスチャやパターンがない。フラットすぎて素っ気ない。背景に軽いテクスチャを加える」
• 「視覚的なフォーカルポイントがない。目を引くヒーロー要素（画像や大きな見出し）を追加」

AIプロンプトへの応用 ― 言語化スキルが画像生成を変える

デザインの言語化スキルが最も即効性を発揮する場面のひとつが、AI画像生成のプロンプトです。

曖昧なプロンプト vs 言語化されたプロンプト

同じ意図のプロンプトでも、言語化の精度で出力品質が激変します。

NGプロンプト（曖昧）:

• 「beautiful anime girl illustration, nice design, good colors」
• → AIにとって「beautiful」「nice」「good」は情報量ゼロ。何がbeautifulなのか分からない

OKプロンプト（言語化済み）:

• 「anime girl, golden hour side lighting, warm orange highlights, cool purple shadows, minimalist composition with large negative space on the left, low saturation pastel color palette, soft cel shading, clean line art」
• → 光の方向、影の色、構図、余白の位置、彩度、色調、シェーディング方法、線画スタイルが全部指定されている

5つの観察軸をプロンプトに変換する

先ほど学んだ5つの軸は、そのままAIプロンプトの構成要素になります。

• レイアウト軸 → 「centered composition」「rule of thirds」「wide shot」「close-up」「negative space on right」
• カラー軸 → 「pastel color palette」「high saturation」「monochromatic blue」「complementary colors orange and teal」「muted earth tones」
• タイポグラフィ軸 → （テキスト入り画像の場合）「bold sans-serif title」「elegant serif typography」「handwritten text」
• コントラスト軸 → 「high contrast lighting」「dramatic chiaroscuro」「soft low contrast」「bold color contrast」
• トーン軸 → 「warm cozy atmosphere」「cold futuristic feel」「retro 80s aesthetic」「clean modern minimalist」「dark moody cinematic」

「なんか違う」をリプロンプトに変換する

AIが出力した画像が「なんか違う」とき、5つの軸でチェックしてリプロンプトに変換します。

• 「密度が高すぎる」 → 「more negative space, simpler background, fewer elements」を追加
• 「色がくすんでいる」 → 「vibrant colors, higher saturation」を追加
• 「のっぺりしている」 → 「dramatic lighting, strong shadows, high contrast」を追加
• 「硬い印象」 → 「soft rounded shapes, warm colors, gentle lighting」を追加
• 「安っぽい」 → 「minimalist, premium, clean design, generous white space」を追加

言語化力を鍛える日常トレーニング

言語化は知識だけでなく「筋トレ」のように練習で伸びるスキルです。日常でできるトレーニングを紹介します。

トレーニング1: 毎日1つ「好きなデザイン」を言語化する

SNSや街中で「いいな」と思ったデザインを見つけたら、なぜ「いいな」と感じたのかを3行で書く。ノートでもスマホのメモでもOK。

• 「このカフェのメニュー、余白が大胆で高級感がある。色は白＋金の2色のみ。フォントは細いセリフ体で上品」
• 「この映画のポスター、人物の顔が三分割法の交点にある。背景が暗くて人物だけが明るい。視線が自然に顔に集まる」

1日1つでも、30日で30の言語化の蓄積になります。これが「引き出し」として後から効いてきます。

トレーニング2: Before/After で変化を言語化する

デザインのBefore/Afterの比較画像を見て、何がどう変わって、なぜ良くなったかを言葉にする練習です。Webデザインのリニューアル事例やロゴの変遷など、ネット上に素材は無数にあります。

• 「ロゴの線が細くなり、角が丸くなった → モダンで親しみやすい印象に。旧ロゴは太い線と角ばった形で硬質で古い印象だった」
• 「Webサイトのカラムが3列→1列になった。情報密度は下がったが、1つ1つの要素が大きくなり視認性が上がった」

トレーニング3: 「反対語」でペアを覚える

デザインの用語はペアで覚えると便利です。「AではなくBにしたい」という形で使えるようになります。

• ミニマル ↔ 装飾的（オーナメンタル）
• 高コントラスト ↔ 低コントラスト
• 暖色 ↔ 寒色
• 有機的（曲線的） ↔ 幾何学的（直線的）
• 密集 ↔ 疎（ゆとり）
• 高彩度 ↔ 低彩度
• セリフ ↔ サンセリフ
• 対称 ↔ 非対称

「ミニマルではなくもう少し装飾的に」「低コントラストすぎるので高コントラストに振りたい」――反対語ペアで表現すると、方向性が明確になります。

まとめ ― 「いい感じ」と言わない自分になる

「なんかいい感じにして」は、語彙の不足が生む空白の言葉です。この記事で学んだことをおさらいしましょう。

• 言語化が難しい理由 ― 視覚は言語より速い、複数要素の複合的な印象、語彙不足の3つ
• 5つの観察軸 ― レイアウト、カラー、タイポグラフィ、コントラスト、トーン。軸を分けて見るだけで分析精度が飛躍的に上がる
• 言語化フレームワーク ― 「○○が△△だから□□」で因果関係を示す。「もっと○○に」でパラメータの増減を指示する。参考画像は「何を参考にするか」を明示する
• 30のデザイン用語 ― 色相、彩度、ジャンプ率、ネガティブスペース、トーンなどの語彙を辞書的に使う
• フィードバック変換 ― 「ダサい」「高級感がほしい」「寂しい」を5つの軸で分解し、具体的な改善点に翻訳する
• AI活用 ― デザインの語彙 ＝ プロンプトの語彙。5つの軸がそのままAIへの指示構成になる
• 日常トレーニング ― 1日1つ好きなデザインを3行で言語化する習慣が最も効果的

デザインの言語化とは、「感覚を分解して、再現可能な知識に変換する技術」です。感覚だけでは再現できませんが、言語化された知識は再現できます。次に「なんかいい感じ」と言いそうになったとき、一歩踏み込んで「余白が広くて、彩度が低くて、セリフ体のフォントが上品で……だから高級感がある」と言えたら――あなたのデザイン力は確実にレベルアップしています。