サイトレビュー＃５「CHOCOLATE CHEESE TART」
1.概要
BAKEとダンデライオン・チョコレートがコラボレーションして作った、バレンタイン期間限定のチョコレートチーズタルトの特設ページをレビュー。
今回は私がPinterestで保存していたウェブサイトから選びました。
このサイトを選んだ理由は、そろそろ自分好みのサイトをレビューしてみたかったのと、実際にこの商品を食べたことがあったからです（単純）。
2.ターゲットと目的
・購入を検討している人の後押しをする。
・商品の詳細を知りたい人にわかりやすく説明する。
・バレンタインギフトに悩んでいる人にこの商品を選んでもらう。
・元々BAKEの商品が好きな人に新商品も買ってもらう。
3.サイト構成と印象
【全体】
・ピンクとブラウンでバレンタインとチョコレートのイメージを表す。
・写真がたくさんあって視覚的に訴えかけられている。
・所々に英語があってオシャレな印象。
・写真と背景をずらして配置することで、動きを持たせる。
【SNSアイコン】
・スクロールしてもページの右上に常に配置することで、SNS拡散を促して多くの人に商品を知ってもらう。
・アイコンもチョコをイメージさせるブラウン背景で、サイトとの一体感を演出。丸で囲むことで柔らかい印象に。
【メインビジュアル】
・お皿、文字、タルトの順に現れるアニメーションで、お皿の上にタルトがのせられる状況が演出されている。
・日本語表記がないのでシンプルでスタイリッシュな印象かつ、色で可愛さを表現。
・タイトルには上下に線を付けることで、画像との境目をはっきりさせて目立たせる。
・期間はブラウンとピンクだけではなく、白を入れることで目を引くように。
【コンテンツ】
・1番大事な商品写真と値段は大きく記し、周りよりジャンプ率を上げてわかりやすく。
・道具、工場、カカオ豆、畑の様子を写真で表すことによって、文章を読まなくても商品へのこだわりが感じられる。
・所々にチョコレートの写真が散らばっていて、コンテンツ全体の一体感や流れが見て取れる。
・アニメーションで写真に色がついて、文字はブラウンのマーカーから現れることで、目がそのアニメーションを追って可読性が上がる。
・読むための文字ではなく、デザイン性のある手書き風の筆記体を入れることで、単調な印象を防ぐ。
【SHOPS】
・シンプルでわかりやすく。
・「店舗情報へ」にマウスをのせると背景と文字の色が反転する。
【SPECIAL】
・それまでとは全く異なるデザインのリンクで、思わずクリックしたくなる。
【フッター】
・ピンクの背景にロゴとコピーライトだけで非常にシンプル。
4.色
背景色：#ffffff（white）、#f9c7c5（pink）、#fbc5c3（footer pink）
文字：#310c0c（brown）
ベースカラー：white
メインカラー：brown
アクセントカラー:pink
可愛い印象で女性が好きそうな配色。
5.フォント
・基本：游明朝体
小説を組むことを目的として開発されたフォントで、上品ですっきりとした印象。バレンタインにタルトが相手に送らせるまでを、物語のように印象付けられている。
・「01.〜04.」：Poiret One
幾何学的な印象。数字の「0」が丸くてタルトの丸が思い浮かぶ。
・「店舗情報へ」：Roboto
フォントを変えることでコンテンツとの差別化をはかる。
・コピーライト：Josefin Sans
細身が美しくコロンと可愛らしい印象。
6.レスポンシブ
・左側にあった期間は右側に移動してタイトルとのバランスをとっている。
・コンテンツは縦並びで商品は全面にして目立つように。
7.おわりに
バレンタインらしい配色だったり、物語風のこだわりの見せ方、所々におしゃれな文字があって、まさに商品を購入したくなるようなサイトだと感じました。
ただ可愛いだけでなくて、シンプルだけどおしゃれで動きがあって読みやすいサイト、自分で作るには相当大変だろうけど、出来上がった時の満足感は計り知れないだろうな。
サイトを見つめ続けていたらチョコレートが無性に食べたくなってきた・・・。
ちなみに実際にこの商品食べましたが、濃厚だけど甘さがちょうど良くてすごくおいしかったです。次のバレンタインも楽しみ。
よろしければ「こうした方がいいよ！」などのアドバイスがありましたら、コメントいただけると嬉しいです。
最後まで読んでいただきありがとうございました。
この記事が気に入ったらサポートをしてみませんか？