スピカマガジン
カテゴリー
【サイトレビュー】ただの牛乳ではない…「ANOTHER MILK」のサイトレビュー
2024.04.21
こんにちは！デザイナーのHandaです。
今回はアニメーションが特徴的な、牛乳のサイトデザインについて考察してみました。 ユーザーを惹きつけるアイディア満載のサイトデザインを、ぜひ参考にしてみてください！
今回レビューするサイト
生協の食材宅配“生活クラブ”の乳製品「ANOTHER MILK」の公式サイトです。
くるくる回るアニメーション牛乳瓶と、グラフアニメーション、牛乳を飲んでいる女性のビジュアルを組み合わせたファーストビューが印象的です。
「はじめて飲んだその味に、100人が驚きました。」というキャッチコピーは、他の牛乳とは一体なにが違うのかと、思わず続きが読みたくなるような気にさせます。
競合サイト
まずは他のメーカーの牛乳のサイトを調べてみました。
明治おいしい牛乳 おいしい暮らし～Natural Taste～
明治のおいしい牛乳の公式サイトです。 牛乳といえば…と思い浮かべる人は多いのではないでしょうか。
▼配色
【ベース】白 【メイン】青 【アクセント】赤
▼分析
「牧場でのむ搾りたての牛乳のようなおいしさをお届けする」という商品のコンセプトを表したパッケージ同様に、シンプルなサイトデザインとなっています。 過剰な表現は避け素直にレイアウトされており、「しぼりたてそのまま」を視覚化したパッケージを思い浮かべます。
湯田牛乳公社 公式サイト
かわいらしいマスコットキャラクターが印象的な、生乳にこだわった低温殺菌（牛乳）の公式サイトです。 商品名に「牛乳」という言葉が使われていませんが、何にこだわったのかが一目でわかりやすいパッケージが特徴的です。
▼配色
【ベース】白 【メイン】黒 【アクセント】オレンジ
▼分析
マスコットキャラクターと、そのかわいらしい雰囲気に合わせた丸みのあるゴシック体のフォントを引き立てるような色数の少ないシンプルなサイトデザインです。 余計な装飾はせず、ただシンプルに伝えたいことだけをまっすぐに伝えているデザインだと感じました。
総論
どの牛乳ブランドも基本的にはパッケージと雰囲気を合わせており、子供も飲むものだからこそ優しく柔らかな雰囲気のサイトが多く見受けられます。 配色には牛乳を思わせる「白」を使っているものが多く、清潔感のあるシンプルなデザインの印象が強いです。
また、商品サイトのためファーストビューではパッケージを大きく見せているサイトがほとんどでした。
今回のサイト「ANOTHER MILK」
▼配色
【ベース】白 【メイン】青 【アクセント】赤
今回考察する「ANOTHER MILK」のサイトは、競合サイトでも多く見られるように、パッケージが大きく配置されたファーストビューになっています。 背景の大きなアルファベットもインパクトがあります！
いいなと思ったポイント
人工的な強い青をメインカラーとして使ったインパクトのあるサイトデザインがとても良いと思いました！ CV（コンバージョン）となる「WEB加入」ボタンが、単純なボタンではなく牛の絵文字のマウスカーソルをぴったり合わせたくなるようなアイディアで作られている部分も面白いです。
また、どのコンテンツも思わずじっくり読みたくなるようなデザイン・アニメーションが盛り込まれています。
商品の特徴をチャットのような吹き出しのデザイン＆動きで見せているコンテンツや…
牛乳を飲む前、飲んでる最中、飲んだ後の表情の変化をグラフで表したコンテンツなど…
ANOTHER MILKの魅力を引き出すアイディアがたくさん詰まったサイトデザインだと感じました！
なぜこのデザイン？どういう効果が期待できる？
「生活クラブ」という生協の商品を注文してもらうために、ユーザーの興味を惹くことができるようなWEBならではの表現を詰め込んでいるようのではないでしょうか。 牛乳という味の差別化が難しいものをいかによく魅せるかが、WEBデザインで重要だと思います。
また、牛乳は小さな子供もターゲットとなるため、データを使用して安心感も与えているのだと思います。 情緒的な部分だけに訴えかけるのではなく数字を用いた正確な情報も伝えることができる、機能的なデザインでもあると思いました！
まとめ
インパクトのある配色とフォント遣いに加え、ユーザーの興味を惹くコンテンツの見せ方が特徴的なサイトでした。
グラフを使って見せる数字は商品の特徴に説得力を足す一方で、堅い印象になりがちです。 しかし配色やフォントをポップにしたり、実際に飲んでいる人のビジュアルを使ったりすることで親しみやすさ出しています。
他の牛乳ブランドにはないオリジナリティ溢れるデザインで、飲んでみたくなるような興味を惹かせる素敵なサイトでした！
ぜひ参考にしてみてください！
