見出し画像

フェリシモ×ドラえもんのWebサイトを分析してみた

フェリシモ さんとドラえもんのコラボサイト。「大人にこそ、ドラえもんを。」というキャッチコピー があるように、昔懐かしのドラえもんグッズがレトロかわいくデザインされています。 

KNAPのデザイナー3人でトークしてます。
あくまでメンバーで個人的に分析をさせていただいておりますことをご了承ください。

画像4

デザイン分析元の基本情報

商品の特徴:フェリシモとドラえもんコラボのグッズ紹介サイト
#ドラえもん #フェリシモ #LP #Webサイト #ファッション
URL:https://www.felissimo.co.jp/doraemon/
企業名:フェリシモ

動きやレイアウトで漫画の世界観を表現しつつ、レトロポップで可愛いデザインになっています。


-ファーストビュー

スクリーンショット 2021-04-07 19.20.00

かすれたどら焼きが背景に敷いてあったり、ヘッダーのロゴ横にテキストが流れているなど細かい演出がされています。

画像12

画像12

画像13

-コンテンツ

スクリーンショット 2021-04-07 18.46.32

写真の見せ方も画質を調整することで、イラストとマッチしたレトロな印象になっています。

goto のコピー

momo のコピー

abe のコピー


-アイコン周り

画像18

abe のコピー 2

momo のコピー 2


スマホデザイン(レスポンシブ)

画像9

スマホでは、色の展開で商品の切り替えがわかりやすくなっています。
PCとは異なり、写真はグラデーションで切っていますね。商品のボタンもスマホではクリックできるようにやや大きく、空間を空けて配置されています。また、見出しがコンテンツによって縦書き横書きになっていて、面白さがあります。


動き

画像7

1コマずつ吹き出しやイラスト達が出てくる演出がワクワクしますね!


カラースキーム分析

画像10

ドラえもんをイメージする青をメインに使いながら、いろいろな色を使うことでレトロ(古くさい)ではなく、レトロかわいいを表現しています。


OG画像

画像8


タイトル

ドラえもん   l   フェリシモ
HELLO DORAEMON! フェリシモオリジナルのドラえもんグッズ。大人にこそ、ドラえもんを。


大人に向けたドラえもんのサイトはいかがでしたか?すでに売り切れ商品もあるようで、この素敵なWebデザインの効果が出ていることは間違いなしですね!

画像6

この記事を書いているメンバーが働いている会社
よかったら見に来てください!

画像5


この記事が参加している募集

おうち時間を工夫で楽しく

この記事が気に入ったらサポートをしてみませんか?