UIを直す前に“構造”を読む　デザインコメントの段取り術

画面レビューの場にいると、新人の多くが“表層のUI”に意識を奪われてしまいます。
ボタンの色、文字サイズ、アイコンの形、位置、余白……。
もちろんそれらは大切です。ただ、ディレクターが最初に身につけるべきは、
「見えている部分」ではなく「見えていない構造」を読む段取りです。

デザイナーは見た目をつくる人ではなく、“体験の道筋”を設計する人です。
そのため、ディレクター側もまず体験の構図を読み取り、
“何を優先して直すべきか”を整理する必要があります。
この整理こそ、若手のうちに身につけたい“見えない段取り”です。

今回は、UIを直す前に確認すべき構造の読み方、
レビューの優先順位をつけるための段取り術、
そして僕自身が1〜3年目でつまずいた経験を踏まえたコラムをまとめます。

UIを直す前に“構造”を読むための段取り術

UIレビューをしていると、どうしても色や配置が目につきます。
ですが、最初の5分はあえて“見た目を見ない”つもりで画面を流し見してください。
代わりに注目するのは 流れ・目的・判断ポイント の3つだけです。

この3つは見た目が整っていなくても読み取れます。
むしろ、見た目に意識を奪われる前に“構造の骨格”を把握するほうが、
レビュー全体の精度が上がります。

新人は「最初にUIを触り出してしまう」傾向がありますが、
それでは細部に引きずられ、重要度の高い問題を見落としてしまうことが多い。
最初の5分で“構造だけを見る”。
この段取りが、レビューの軸をぶらさないコツになります。

構造を読むときのフレームとして、僕が新人時代から使っているのが
「導線」「情報」「操作」 の3層です。

UIはこの3層のバランスでできています。
見た目のズレは、多くの場合この3層のいずれかが崩れているサインです。

デザイナーと話すときも、この3層で言葉を持っていると
「導線の意図はこうですか？」
「情報が先に出てくると判断が早くなりそうです」
といった、構造的なコメントができるようになります。

新人が「UIコメントがうまく言えない」と悩む理由の多くは、
この3層を区別できていないことにあります。
層を分けて読むだけで、“見るべき順番”がはっきりするのです。

UIレビューの後半で、必ず話題に上るのが“余白”です。
しかし、余白調整は“最後の工程”として扱うのが鉄則です。
なぜなら、構造や文言が変わると余白のバランスは必ず崩れるためです。

未経験〜3年目の新人がやりがちなのは、
余白の大小やパーツのズレに最初から注目してしまい、
根本の導線や情報の流れに気づけないケースです。

レビューの段取りは次の順番が理想です。

余白は“整えたい衝動”を呼ぶので、つい最初に触れたくなる。
でもここを踏みとどまれるかどうかで、
ディレクターとしての質が変わってきます。

僕が1年目だった頃、UIレビューは本当に苦手でした。
先輩たちは画面を開いた瞬間に
「ここの導線がぶつかっているね」
「情報の出方が途中で跳ねている」
と、迷いなくコメントしていきます。

その一方で僕は、
「ボタンの色が気になるな…」
「このあたりの余白が広いような…」
と、表面的な違和感しか言葉にできませんでした。

あるレビューの場で、ついに先輩から
「海斗、表面だけじゃなくて“流れ”を見てごらん」
と優しく指摘されました。

そのとき、僕は初めて画面の“道”を意識しました。
ユーザーがどこから来て、どこへ向かうのか。
目的地はどこにあり、そのために何を判断しないといけないのか。

見た目をいったん脇に置いて“流れ”を見た瞬間、
UIの全体像が薄く立ち上がってくるような感覚がありました。

そこから僕は、レビュー前に必ず
「導線・情報・操作」 の3層をメモするようになりました。
すると、デザイナーとの会話が少しずつ変わりはじめたのです。

「この導線だと、初回ユーザーが目的地を見失いそうです」
「情報の並びが上下でトーンが違うかもしれません」
そんなコメントが自然と出てくるようになった。

すると先輩が言いました。
「海斗、その視点があれば大丈夫。UIは“構造”を理解した人から伸びるから」

あの日の言葉は、今でも仕事の軸になっています。

見た目は後からいくらでも勉強できます。
でも、ユーザーの“流れ”を読み取る力だけは、
早い段階で身につけておきたい基礎です。

もし今、UIレビューに自信が持てない人がいたら、
どうか焦らないでください。
最初に必要なのは、“綺麗さを見る目”ではなく
“構造を読む段取り” だけです。
それが、若手のうちに覚えてほしい「見えない仕事」です。