国内一杯の器をブランドの象徴にする
飲食 / タイポグラフィ
MENSHO
器の立体表現から世界各地の店舗と一杯のメニューへつなぐ、ラーメンブランドのサイト。
設計の見どころ
PC冒頭では黒い背景に白い線で描かれた大きな器が現れ、MENSHOの文字と共にブランドを印象づける。料理写真を並べる前に器そのものを象徴として扱う構成で、一般的な飲食店のメニュー一覧とは異なる始まり方になっている。
詳しい解説を読む →公式サイトを見る ↗← サイト事例に戻る
01 02 03 04 05 国内 
海外
海外
DESIGN NOTES
このサイトの設計を読み解く。
小さなカップと余白で店名を覚えさせる
冒頭はクリーム色の広い余白に、湯気のあるカップの小さな印と店名だけを中央に置く。上部のナビと予約ボタンは控えめに配置され、店名の周辺を静かに保つ。大きな料理写真がなくても、喫茶の用途と落ち着いた調子を短い要素で示せる例になっている。
茶色の面に外観写真を額装する
スクロール先は赤茶色の背景へ変わり、縦長の外観写真を細い枠と葉の飾りで囲む。写真下の短文も中央に寄せ、全体を一つの紹介カードのように見せる。店の外観を単に全面へ敷くのではなく、額縁のような扱いで親しみのある表情を添えている。
コーヒーと食事を別の読み物にする
公開テキストではコーヒーの産地や焙煎との関係を述べる区画と、季節のブランチや子ども向けメニューを説明する区画が分かれる。飲み物への関心と食事の目的を別々に受け止める構成だ。専門性を伝えながら、日常の利用条件も置き去りにしない。
地域の居場所として店を説明する
地域のコミュニティをつなぐ場所という説明があり、コーヒー好きだけでなく家族での利用にも触れる。商品の品質だけに話を絞らず、誰がどんな時間を過ごせる店かを言葉にしている。街の店では、提供物と居場所としての役割を合わせて伝える方法が参考になる。
予約と注文と営業時間をそろえる
上部には予約とオンライン注文の入口があり、公開テキストには平日と週末の営業時間、厨房の終了時刻、住所、メールが記載される。写真で興味を持った後に、店内利用か持ち帰りかを選ぶ材料になる。閉店と調理終了を分ける細かな情報も来店判断を支える。
APPLY TO YOUR PROJECT
自分の制作に取り入れるなら
カフェらしさは写真の量だけでなく、カップの印や落ち着いた色と余白でも伝えられる。飲み物のこだわり、食事、家族利用、注文方法を分けて案内したい。
そのまま真似する前に
冒頭の情報量が少ないため、初見では店内の様子や価格がすぐには分からない。今回見た証拠はPCの一部区画で、メニュー詳細や予約の動作まで確認済みとはしていない。
次に見ておきたい参考
一覧へ →国内海外焼き菓子と一杯を一つの写真にする
飲食 / 写真中心
Madie
焼き菓子とコーヒーの一組を大きく見せ、味選びから来店・特別注文までつなぐ。
設計の見どころ
冒頭の写真は木のテーブル上のマドレーヌとアイスコーヒーを大きく見せる。背景には赤茶色のタイルがあり、商品だけでなく店で過ごす温度感も伝わる。一品の物撮りに絞らず、組み合わせて楽しむ場面を先に見せることで、カフェの利用を想像しやすくしている。
詳しい解説を読む →公式サイトを見る ↗海外The Salad Project
飲食 / 写真中心
情報の順序
飲食 / 写真中心
The Salad Project
食べる人と食材の接写を左右に並べ、日常の昼食から商品選択・受け取り方へつなぐサラダバー。
設計の見どころ
最初はサラダを食べる場面と食材を見せ、続いてサラダとプロテインボウルの選択、アプリの案内へ進む。会社説明を先に長く置かず、今日何を食べるかという来訪者の判断に近い順序だと読める。メニュー内には具材の区分や栄養情報への入口もある。
詳しい解説を読む →公式サイトを見る ↗