デザイン分析日記38|上品さと機能美
Webサイトから学ぶ、デザイン分析
こんにちは!
ギャラリーサイトなどで心を動かされたデザインを分析・発信を週一の頻度で発信しております。
デザイン分析し、デザインを詳しくなることで、表現の引き出しを増やすことを目的に取り組んでおります。
もし興味がありましたら、最後までご拝読いただけますとありがたいです!
今回ご紹介するのは、那須扇屋様(https://www.nasu-ougiya.com/)です。
表現の意図の仮説
今回の那須扇屋様のホームページは、「信頼できる老舗店であること」と、「贈り物としても安心して選べる品質の高さ」を伝えることを目的として制作されていると考えました。
老舗ならではの安心感やブランド価値を表現すると同時に、商品の魅力を最大限に引き出すことで、「間違いのない美味しさ」や「特別な贈り物として選びたい」という感情につなげる狙いがあるように感じました。
そのため、上質さ・上品さ・洗練された印象を軸としたデザイン設計が採用されていると考えます。
サイトをどのように感じたのか?(私)
このサイトを見たとき、「高級感・上品さ・老舗ならではの安心感・落ち着き
商品への期待感」を感じました。
単に商品を販売するためのECサイトではなく、「那須扇屋」というブランドそのものの価値を伝えることにも重点が置かれているように感じました。
① 色
サイト全体は、
白(#FFF)
グレー(#EEE)
黒(#000)
を中心とした無彩色で構成されていました。
無彩色で統一することで、情報量を意図的に抑え、洗練された印象や落ち着きを演出していると考えました。
また、色による装飾を最小限にすることで、商品そのものへ視線が集まりやすくなり、「デザインではなく品質で勝負している」という印象も受けました。
特に食品系サイトでは暖色を使用するケースも多いため、ここまで無彩色でまとめている点は非常に印象的でした。
その結果、「老舗らしい品格・信頼感・高級感」を自然に感じられるデザインになっていると考えました。
② フォント
日本語フォントには「Zen Old Mincho」、英語フォントには「Oswald」が使用されていました。
「Zen Old Mincho」が使用されている理由
Zen Old Minchoは、伝統的な明朝体の美しさを持ちながらも、現代的な読みやすさを兼ね備えたフォントです。
繊細な線の抑揚
上品な文字の骨格
歴史を感じさせる佇まい
が特徴であり、老舗ブランドとの相性が非常に良いと感じました。
また、ひらがなの柔らかな表情や、活版印刷を思わせるような雰囲気もあり、商品の持つ丁寧さや伝統を補強しているように見えました。
さらにタイトル部分では、文字の縦比率がやや調整されており、本文との差別化を図ることでメリハリを生み出している点も印象的でした。
「Oswald」が使用されている理由
英語フォントには「Oswald」が使用されていました。
使用箇所は限定的でしたが、縦長でシャープな印象を持つフォントであるため、Zen Old Minchoとのコントラストが生まれていました。
和の伝統を感じさせる明朝体と、モダンでスマートな英字フォントを組み合わせることで、現代性のバランスが取られていると感じました。
③ 写真
ファーストビューでは、商品の魅力を最大限に伝えるため、商品へ大きく寄った写真が使用されていました。
細部まで見える構図によって、「美味しそう」「食べてみたい」
という感情を自然に引き出していると感じました。
また、写真がロゴの扇型に切り抜かれている点も印象的で、を象徴が強調されうるする工夫や、シンプルすぎないデザインとして機能していました。
全体の写真については、「明度はやや高め・彩度は控えめ」に調整されており、サイト全体の上品な世界観と統一されてグッと全体のクオリティを押し上げていると感じました。
さらに、商品以外の写真にはグレー系のトーン調整が施されているように感じられ、サイト全体の無彩色デザインとの一体感を高めていると考えました。
商品一覧では余白を大きく取り、商品を単独で見せる写真が多く使用されていました。その為、一つひとつの商品へのこだわりや価値が伝わりやすくなっていると感じました。
④ 言葉
トップページでは言葉数を最小限に抑え、商品の魅力を中心に伝える構成になっていました。その為、余白が生まれ、洗練さがより際立つ印象を与えられると感じました。
そして、商品説明箇所では、香ばしい・とろける・ふんだんに使用など、味覚や食感を想起させる表現が多く使用されており、購買意欲を高めると言葉の重要性も気づきました。
⑤ レイアウト・余白
※PC表示を基準に観察しています。
レイアウトは、和の文化を感じさせる縦書きレイアウトが多く採用されていました。視線は自然と「タイトル → 説明文 → CTA」の順で流れるよう設計されており、商品購入への導線も非常に分かりやすく感じました。
また、全体を通して余白が広く確保されているため、「落ち着き・上品さ・高級感」がより強調されていると感じました。
さらに、
FV
↓
ギフト商品
↓
おすすめ商品
↓
定番商品
↓
種類検索
という構成になっており、
「贈り物に良さそう」
↓
「どんな商品があるんだろう」
↓
「相手の好みに合わせて探してみよう」
というユーザー心理に沿った導線設計になっている点も非常に参考になりました。
このサイトはどのターゲットに向けて作られている?(仮説)
本サイトの主なターゲットは、30代後半〜60代後半の一般消費者であり、その中でも比較的購買力の高い層を想定していると考えました。
特に、
贈答品を探している人
特別感のある商品を購入したい人
品質やブランドを重視する人
に向けて設計されていると感じました。
そのため、
老舗としての信頼感
上品さ
商品の魅力
購入しやすい導線
が丁寧に設計されており、「安心して購入できるブランド」という印象を与えることを目的としていると考えました。
最後に
今回の那須扇屋様のホームページ分析を通して、「高級感」や「上品さ」は、必ずしも豪華な装飾や派手な演出によって作られるものではないということを学びました。
特に印象的だったのは、白・グレー・黒という無彩色のみで構成されているにもかかわらず、サイト全体から老舗ならではの信頼感や品格が伝わってきたことです。
一つひとつの商品にしっかりと余白を与え、商品の魅力を主役として見せることで、「美味しそう」だけではなく、「安心できる商品」「贈り物としても特別感や上品さがあり喜ばれそう」という印象まで与えていました。
さらに、サイト構成についても学びが多くありました。
ギフト商品から始まり、おすすめ商品、定番商品、種類検索へと続く導線は、ユーザーが自然と商品に興味を持ちながら購入まで進める流れが設計されており、ブランド体験とECサイトとしての実用性が両立されていると感じました。
また今回特に印象的だった、無彩色による高級感の演出や、余白を活かした商品の見せ方については、今後の制作でも積極的に参考にしていきたいと感じました。
今回はここまでにさせていただきます!
引き続き、デザインの言語化学習に努めていき、自分の引き出しを増やしていきます!
これからは、50回まで継続を目標に続けていきます!
引き続き何卒よろしくお願いいたします。
