gallery

ギャラリー

LP

Parts

にぎやか アーカイブ | theta - blog にぎやか アーカイブ | theta - blog

gallery

教育テレビ「つくってあそぼ」を連想するような遊び心満載のFV。
うなぎパイが出来上がるまでの工程をアニメーションで表現しています。食品工場ならではの表現方法だなと思いました。

とくちょう

うなぎパイの形を生かして歴史を辿るようなデザインになっています

UI / UX

各部の状況がアイコンで一眼でわかるのが良い

イメージ

色分けしているのでわかりやすいと思いました。
また「close」デザインもかわいいです。

ポイント

クリックすると「電球アイコン」がでてくる

遊び心ある仕掛けで良いなと思いました

楽しさを「赤」で表現しているデザインです。ユーザーの商品の先に対する「情熱」を表現しているのかなと思いました。

UI / UX

マウスを当てると画像も変化する

マウスをコンテンツに当てると項目ごとに画像が変化します。
とび先のイメージが伝わる仕掛け。

重要なお知らせが目に見えてわかる

イメージ

重要なお知らせを別で目立つように表示させています。
他のお知らせと混ざらないので、訪れたユーザーが視認しやすいと思います。

左固定のメニュー

イメージ

いちユーザーとして見た時目的のものにすぐ飛べるのは良いなと思いました。
目当ての画材がすでにあるユーザーにとってダラダラ見せられるのは時間ロスだし、
探せないことにイライラしてきそうだなと思いました。

ポイント

商材の形に合わせた矢印のデザイン

イメージ

矢印のデザインがペンに沿っているのが良いなと思いました。

ポップで明るい印象を受けるデザインです。
農業の楽しさを伝えようとしているデザインだと思いました。

UI / UX

図がわかりやすい

イメージ

図がわかりやすい②

イメージ

ポイント

ハンバーガーメニューがわかりやすい

イメージ

上から順に番号振って記載されている点が
初めて訪れたユーザーからみたら情報が整理されていてわかりやすいのではないかと思いました。

要素の多いにぎやかなデザインですが、内容がわかりやすく、訪れたユーザーに伝えたい情報をしっかりと伝えているデザインです。

とくちょう

食べ物を連動させて表現

イメージ

サプリメント商材ですが、食べ物と合わせて謳うことで、ユーザーの潜在意識へ問いかけているのではと感じました。特にバーガーなどは高カロリー食品なので体系を意識している人は「カロリー」を気にすると思います。

背景に画像を取り入れることで奥行きがでる

イメージ

ずらしておくこと奥行きがでる

UI / UX

キャッチコピーで惹きつける

イメージ

「まかせて！食べたいキモチ♪」→食欲旺盛な人に我慢しないで食べようということをポジティブに表現しています。FV直下に権威性を伝えることで、興味を感じているユーザーに商材への信頼を後押しする。

ポイント

食べ物をハンバーガーで統一して表現している

イメージ

高カロリーの食べ物はたくさんありますが、太る食材を「ハンバーガー」で統一表現しているの良いなと思いました。

ハンバーガーメニューのボタンにも

イメージ

起用モデル＝商品のイメージ

イメージ

「女優の高畑充希＝カロリメットのCMの人」というモデルのイメージを定着させるように並べられていると感じました。

明るく、楽しい雰囲気が伝わってくるデザインです。また、ロゴに合わせてデザインされていると思いました。メインカラーの黄色はブライトトーン配色で「鮮やか、陽気、カジュアル」といった印象を伝えます。

とくちょう

ポップで動きを感じるデザイン

イメージ

波模様のデザインが動きを表現。

UI / UX

画面で変わるアクセス動線

下にスクロールすると、アクセス動線が右固定に変化する。上の幅の領域が狭くなるので画面が見やすくなるのと、ユーザーがいつでも次の動線へ移行しやすい仕組み。

「初めての方へ」ページのユーザーを惹き込むアニメーション表現が秀逸

先を読み進めたくなる仕掛け。

ポイント

ページ移行中のアニメーション

マスコットキャラを使った表現が商材とマッチしていて良い

ページによってフォントを使い分けている

イメージ

「初めての方へ」のページでは「親しみやすさ」を意識して制作されているように感じます。手書きフォントは、やわらかで、温かみのあるフォントなので、親しみやすさを演出したいときに使うと効果的です。

数字のメリハリが◎

イメージ

背景に彩度・明度が高い色をつかうと沈みがちですが、白のラインを影のように使うことでしっかり目立たせている点参考になります。

商材のあしらいが印象的でものづくりのわくわくさや楽しさを感じるデザインです

とくちょう

「おもしろさの追求」とい文字とデザインが一致

イメージ

ステップアップしているような段階で表現しているデザインがキャッチコピーと一致していて良いなと思います。

デザインを引き立てる写真使い

イメージ

実際の人物写真を切り抜いて使うと手作り感がでます。

UI / UX

思わず読みたくなるデザイン表現

イメージ

線で繋がれていると目でおってしまうので、見てもらう工夫が施されていると思いました

背景写真に合わせた文字のレイアウト

イメージ

写真に合わせた文字表現が参考になりました！