U.F.O.のサイトを分析してみた
1947年の今日、アメリカで初めてUFOが目撃されたということからUFOの日になったそうです。今日は美味しいU.F.O.のカップ焼きそばのサイトを分析させていただきました。
KNAPのデザイナー3人でトークしてます。
あくまでメンバーで個人的に分析をさせていただいておりますことをご了承ください。
デザイン分析元の基本情報
商品の特徴：日本で一番売れてるカップ焼きそばU.F.O.
#UFOの日 #焼きそば #藤岡弘 #仮面ライダー #猫バンバン #キャベバンバン #名前の由来
URL：https://www.nissin-ufo.jp/
企業名：日清食品
トップページ
動き、デザイン、コンテンツともに見たことのないワクワクする未確認サイトになっています。
-ファーストビュー
ナビゲーションがマウスオーバーをすると動くなど細かい楽しい仕掛けが。パッケージがにぎやかなので、サイトもそのトーンにあっています。爆風をイメージして勢いを出しつつ、藤岡さんの印象ともあっています。
背景が強いですが、影や縁をつけることで視認性も担保されています。
-コンテンツ
「濃い濃い濃厚ソース」が勢いのある動きがついており、ついつい目が行くデザイン。書体がパッケージと合わさって統一感があります。
商品写真はソースから湯気も出ていて面白いだけでなく、しっかり美味しそう！食べたい！という訴求も行っています。
色々な藤岡さんがコンテンツや背景にも出てきています。
45周年ということで、いろんな世代に愛される藤岡さんのキャラクターがU.F.O.の出た当時の世代の人から若い人々まで共感できるサイトになってるのかと思います。
スマホデザイン（PC，SP切り替え）
ファーストビューの画像がスマホ用に作り込まれていたり、1つ1つのバナーも大きくて見やすくなっていました。PCとSPでソースが別々でそれぞれで見やすいように最適化されています。
下層ページ
CMの企画意図が書かれていておもしろいです。時間の無いときにサクッと食べれるU.F.O.はクリエイティブ業界の救世主だと思うので、そういった観点でも企画意図を見れ業界の方の中でも有名になりそうです。
また、撮影秘話の欄では藤原さんのお茶目な部分もあって色々読み込みたくなります。
-キャベバンバン
日産自動車が推奨する#猫バンバンプロジェクトのパロディ？で蓋の裏についたキャベツを残さず食べようというもの。コンテンツはユーモア満載なのですが、デザインはサステナビリティをイメージさせるような清潔感のあって情報が分かりやすいものになってました。
動き
-歴史ページ
歴史ページなのに、今までの歴史よりガチャが目立つというU.F.O.らしいコンテンツでゲーム感を楽しみながら商品について知れます。３人でやった時、超激レアも出ました！ちょっとうれしくなりますね。
フォント
サイト中をたくさんのフォントが駆け巡っている印象で、そのほとんどが画像フォントになります。
「濃い濃い濃厚ソース」ではパッケージロゴをアレンジして使用していたり、各見出しはコロンとした可愛らしいフォントを使っています。
日本語：Noto Sans
英語：Noto Sans
フォントのカラー：＃e60012、＃FFF000など
カラースキーム分析
U.F.O.のパッケージの赤と黄色で配色されています。一見目がチカチカしてしまいそうな組み合わせですが、色の透過、グラデーション、途中で黒を挟むことでバランスをとっていました。
ファビコン
OG画像
タイトル
日清焼そばU.F.O.
発売45周年！累計50.5億食突破！濃い濃いソースが旨いから売上No.1！
藤岡弘、さんのサイトも分析してみた
U.F.O.のサイトを見ていたら、藤原さんのことが気になり始めオフィシャルサイトを見てみました。これだけ作り込まれている芸能人の方のサイトはなかなか無く、圧巻でした。
-トップページ
写真ではなく、水墨画のようなイラストになっていて武士らしさが伝わります！筆文字がアクセントになっておりかっこいい！！
-藤岡弘、大図鑑
色んな所に特徴が書いており、ポチポチしつつ楽しみながら藤原さんの事を知れるコンテンツになっています。なかなかここまで語れる人はいない気がします。
-武士道
見たことのないデザインで、藤原さんだから実現できるデザインだなと感じました。チャクラのような精神がすべてここに刻まれている感じがうまく表現されています。
-ライセンス
ライセンスなので、一見映画などの著作権的なライセンスの話かと思いきや、ご自身のライセンスで、資格や技術の話が載っていて藤原さんの凄さを感じます。
コンテンツの内容だけでもすごい方なんだなと感じつつ、デザインも藤原さんの凄さをより引き立てるサイトでした。
この記事を書いているメンバーが働いている会社
よかったら見に来てください！
