*視点
名古屋発祥のコーヒーチェーン、コメダ珈琲店。元々固定ファンの多い老舗ですが、
近年ではそのボリュームたっぷりのメニューが”逆写真詐欺”(※メニュー表の写真よりも明らかに大きな商品が提供される)とSNSで話題となりました。
今回はそんなコメダ珈琲店のコンセプト”「街のリビングルーム」としてくつろぎを届ける”という思いが明確に伝わってくるコメダ珈琲店 公式WEBサイトをレビュー。
こだわりあふれるディテールに着目してまいります。
*フォント
-
見出しや本文には、ゴシック体が使われており、読みやすいレイアウト。
-
太字・大きめサイズの見出しで視線を誘導。本文内もストレスなく読める行間にまとまっています。
*色彩計画
-
ベースは白背景に木材やベージュ〜ブラウンを配し、温かみと安心感を演出。
- アクセントとして深い赤を用いた縞模様のセクションが入る。
店舗内で使用されている同じ配色のソファーをイメージしたデザインがいかにも”コメダらしい”雰囲気を引き立てます。 - 見出しには濃いグレーが使われ、本文の視認性を強調。

No.020 コメダ珈琲店 公式WEBサイト レモンな向上心|WEBサイト100選
*サイトデザインについて
- メインビジュアルには大きく”心にもっとくつろぎを”の言葉を配置。
その後ろには温かみ溢れるメニューイラストと写真が6つ並び、アニメーション付きで入れ替わります。
どの画像にもくつろぎ・安心・おもてなしを感じさせます。 -
ヘッダーは縦型に配置。ナビゲーションが並び、左端に固定されているのでスクロールしても必要な情報にアクセスしやすい。
-
セクションごとの余白が充実しているので自然とスクロールが進む構成。背景を各セクションで変えている点にもこだわりを感じます。
-
各見出しに対応した写真が効果的に挿入され、文章と画像の配分が読みやすい。
- リンクがついた箇所の写真はサイト全体で一貫してホバー拡大する構造。UIとして分かりやすい効果。
-
レスポンシブ対応も良く、スマホ閲覧でもストレスなく見られる設計に配慮されています。

No.020 コメダ珈琲店 公式WEBサイト レモンな向上心|WEBサイト100選 *所感
コメダ珈琲店 公式WEBサイトはブランドの世界観とサイトデザインがリンクしており、ユーザーにとって共感しやすい深い“らしさ”が感じられました。
くつろぎ・安心・おもてなしという核が本文であったり、様々な画像であったり、UI全体から感じられ、整合性のとれた雰囲気づくりが秀逸です。
サイト全体を通して“居心地の良さ”を視覚的に伝える、サイトデザインとなっておりました。
