Behind the build — Day 002

つくり方の全容

「AIサイト100連発」day2、駅前の老舗ラーメン店「ラーメン はやし」。看板は、二代目のまかないから生まれた裏メニュー——焦がしラー油の辛味ラーメン。お願いしたのは「老舗だけど重厚にしない。ポップでキャッチー、でも安っぽくしない」。ところが最初、ポップにしようと飾りを足していったら“うるさく”なった。渦巻き、囲み線、影、原色、大きなイラスト——にぎやかだけど、安い。そこからやったのは逆で、引き算。飾りを削り、主役(丼)を画面からはみ出すぐらい大きく、一つだけに。今回のキモは、ポップの正体は“量”ではなく“引き算と単一焦点”だったこと。完成形は、いちばん下で。

01

最初の出力は、方向が少し違った。

初回の出力 step00 — 方向は悪くないが色と書体が子どもっぽい
step00 — 悪くはない。でも色と書体が、少し子どもっぽい

これが初回の出力。全体として、悪くはない。雑誌の表紙のように店名と丼を大きく中央に据えた、賑やかな誌面。ただ、狙いとは方向が少し違った——黄色を主役にした色遣いと、丸くて主張の強い書体が、どこか子どもっぽい。見出しのフォントはやや安っぽく見え、写真の白枠・ドロップシャドウ・囲みの黒い線も“チープ”な印象。狙いは「ポップだけど、安っぽくない」。ここから同じ素材・同じAIのまま、ディレクションだけでそこへ寄せていく。

出した指示方向は、赤と白を主役にした潔いポスター感に寄せたい(黄色で子どもっぽくしない)。見出しのフォントが安っぽいので変える。写真の白枠・ドロップシャドウ・黒い囲み線はチープなので外す。ポップだけど、安っぽくはしない。

02

作り替えても、まだ“うるさい”。

飾りを増やしすぎて“うるさく”なった版(修正前)
修正前 — 盛れば盛るほど、安く見える

ここが良くなかった:色や配置を直しても、まだ“飾りで賑やかにする”発想のまま。渦巻き模様を全面に繰り返し、マスコットの虎を大きく置き、店主紹介は黒地に黄色の文字。にぎやかではあるが——視線がどこを見ていいか分からず、全体が“うるさい”。黒×黄は「危険・警告」を連想させ、安っぽさも出た。盛るほど、安く見える。

出した指示渦巻きは全面に繰り返さず、一箇所だけのポイント使いに。虎は小さくして文字に被せない。黒地に黄色(危険色)はやめる。視線の主役を一つに決めて、他をそれに従わせる。

03

引き算して、主役を一つに。

飾りを削り主役を一つに絞った版
引き算後 — 静かになって、品が出た

ここで方針転換:足すのをやめて、削った。渦巻きは画面の上に一本だけのアクセントに。虎は隅の小さなマスコットへ。黒×黄はやめて、白地+赤を基調に。にぎやかさは“量”でなく、主役(丼)を一つに絞ることで出す。一気に静かで、品が出た。

出した指示強い装飾は1箇所だけのポイント使いに。配色は白地+赤を基調、黄はアクセント。視線の主役を丼ひとつに決め、店名・マスコット・装飾はそれに従わせる。

04

主役を、画面からはみ出す。

丼を画面外へブリードさせ、縦書き大型店名と組んだ最終ヒーロー
仕上げ — 主役を一つ、画面からはみ出す大胆さで

仕上げの肝:焦点が一つに決まったら、それを思い切り大きく。丼を画面の左下からはみ出すぐらい大胆に。店名は右に縦書きで大きく、写真に重ねたアーチの英字でモダンに。中央に置くと単調で、幅によって店名が丼と被る——だから左右に振った非対称に。ヒーローは高さを固定して、どんな画面でも関係が崩れないように。「右に写真・左にテキスト」の定番をやめたから、似た顔にならない。

出した指示看板のラーメンを画面からはみ出すぐらい大きく。中央寄せはやめて左下へ。店名は縦書きで大きく、英字でモダンに。ヒーローは可変でなく固定高さの絶対配置に。

05

そして、完成形。

完成した全体(ラーメン はやし)
完成 — ラーメン はやし(全体)

看板の物語(まかない発の裏メニューが一番人気に)を軸に、お品書き・麺とスープ・二代目までを一枚に。書体は店名や見出しの“大きい文字”だけ表情のあるディスプレイ体に絞り、本文は読みやすいゴシックへ。「ポップに」と言われて飾りを足すと、たいてい安くなる。足すのをやめて、主役を一つに絞り、色は面と余白で。同じ素材・同じAIでも、ディレクションでここまで変わる。完成した全体は、この画像のとおり。

「にぎやかさ」を、
引き算した。

ポップの正体は、飾りの量ではなかった。主役を一つに絞って、画面からはみ出すぐらい大きく。それだけで別物になった。

サイトを見る →