海外焼き菓子と一杯を一つの写真にする
飲食 / 写真中心
Madie
焼き菓子とコーヒーの一組を大きく見せ、味選びから来店・特別注文までつなぐ。
設計の見どころ
冒頭の写真は木のテーブル上のマドレーヌとアイスコーヒーを大きく見せる。背景には赤茶色のタイルがあり、商品だけでなく店で過ごす温度感も伝わる。一品の物撮りに絞らず、組み合わせて楽しむ場面を先に見せることで、カフェの利用を想像しやすくしている。
詳しい解説を読む →公式サイトを見る ↗← サイト事例に戻る
01 02 03 04 05 海外 
海外
国内
DESIGN NOTES
このサイトの設計を読み解く。
素材と料理を二枚でつなぐ
冒頭はバターの表面を写した接写と、皿に盛られたトーストを左右に配置する。中央に大きな店名を重ねることで、何を使い、どんな状態で提供する店かを一画面で伝えている。食材の写真と完成品の写真を一組にする方法が明快だ。
濃い青を説明面にも使う
右側の鮮やかな青は次のAboutの背景にも続き、写真から説明へ移っても同じ店のページと感じられる。白文字の小さな段落を中央にまとめ、周囲の線画と余白で囲む構成だ。装飾色と情報面の色を揃えることで画面の切り替わりをつないでいる。
100年の技術を体験に翻訳する
本文はバターと歩んだ年月を紹介した上で、作りたての風味や口どけをこの店の体験として説明する。企業の沿革を長く並べず、蓄積した技術が来店客にどう届くかへ結びつける順序になっている。製造元がある飲食ブランドに応用しやすい。
メニューから営業情報へ着地する
公開テキストではトースト、フレンチトースト、ポテト、デザートとドリンクが並び、その後に定休日のお知らせと所在地、電話が続く。食べたい気持ちを作ったあとに来店の判断材料を置く流れであり、商品説明と営業案内を分けている。
提供写真に撮影の役割を持たせる
素材の質感と皿の全体像を撮り分ければ、単品中心の店でも二枚の写真で異なる情報を伝えられる。接写はおいしさの感覚、俯瞰写真は提供量や食べ方を受け持つ。色の強さだけをまねるより、写真ごとの役割を先に決めて撮影したい。
APPLY TO YOUR PROJECT
自分の制作に取り入れるなら
素材の接写と実際の提供写真を対にする。商品の背景を説明する区画でも同じ色を使い、食材・製造技術・店での体験を一本の流れにまとめる。
そのまま真似する前に
確認時の営業時間はお知らせとAccess欄で異なる表記があった。期間限定の変更を掲載する場合は通常営業時間にも注記を付け、来店前の迷いを減らしたい。
次に見ておきたい参考
一覧へ →海外海外The Salad Project
飲食 / 写真中心
情報の順序
飲食 / 写真中心
The Salad Project
食べる人と食材の接写を左右に並べ、日常の昼食から商品選択・受け取り方へつなぐサラダバー。
設計の見どころ
最初はサラダを食べる場面と食材を見せ、続いてサラダとプロテインボウルの選択、アプリの案内へ進む。会社説明を先に長く置かず、今日何を食べるかという来訪者の判断に近い順序だと読める。メニュー内には具材の区分や栄養情報への入口もある。
詳しい解説を読む →公式サイトを見る ↗国内手で持つ大きさから味を想像させる
飲食 / 写真中心
はちとワルツ
カステラサンドを持つ手元と蜂の線画で、食感と秋保の店の雰囲気を伝える。
設計の見どころ
冒頭は両手でカステラサンドを持つ写真が主役で、断面の厚さと餡の層が見える。白い縦方向の店名を右に置き、左側には秋保温泉の店であることを小さく添えている。完成品を孤立させず、人の手を物差しにして大きさを伝える構成だ。
詳しい解説を読む →公式サイトを見る ↗