【#勝手にサイト分析 vol.07】大塚製薬株式会社様のコーポレートサイトを分析させていただきました。 | Curious inc.

はじめに

おはようございます！
株式会社Curious代表の吉沢でございます。

noteを始めて1週間経ちますが、見てくれている皆様ありがとうございます！
ぜひ「このサイトも分析して欲しい！」というリクエストがありましたら、お声がけください！！

本日も【世の中の"クリエイティブ"を勝手に分析！】をテーマに、記事を書かせていただきます。

あくまで"勝手に"分析をさせていただいており個人的見解になります。
ご理解のほど、宜しくお願いいたします！

基本情報まとめ

企業名
大塚製薬株式会社

URL
https://www.otsuka.co.jp/cmt/to_programmer/

コンセプト/デザイン分析

ターゲット
・プログラマー
・Webデザイナー

コンセプト
<カラー>
全体を白黒で構成していながらも、目立たせたい箇所やリンクには目がチカチカするぐらいの黄色を使用しメリハリを演出。
白黒構成がプログラムのもつ”質素さ”を上手に表現している。

<写真>
上記カラーに合わせて、全体のモノトーンの世界観を崩さないよう白黒にされている。

<フォント>
英語フォントが、”プログラム”を表現する最適なチョイスがされている。

ここは参考になる！と思った点

僕らも"クリエイティブ"には非常に力を入れていますが、僕らから見ても参考にしたい！と思った点を、恐縮ながら挙げさせていただきます。

カロリーメイトという商品自体は、明確なターゲットはなく老若男女向けの商品です。

そのため、今回のサイトのようにターゲットを絞ることで、強いインパクトを与え、よりターゲットを引きつけられるよう考えられているなと感じました。

僕自身もプログラミングをしたことがありますが、片手で食べられるカロリーメイトはPCと向き合っている時は、必需品でした！
プログラマーにはぴったりな訴求ができているなと！

配置が全て左揃えになっている。これはコードをモチーフにされているため、世界観が最高に表現されている。

大きいディスプレイ時に少しバランスが悪く見えてしまうが、それを踏まえても素晴らしい！

メッセージ箇所はもはやプログラマーじゃないと読めない。でもこれがまた世界観を作り、プログラマーの心を掴む要因になっている。

リンクのhoverアニメーションも”プログラム”を上手に表現している。

ローディングアニメーションで、”プログラマー”向けというのが分かるので、ターゲットが1番最初のタイミングで、認知することができる。

最後に

このサイトを見た瞬間、もはや焦りました。笑
これは凄すぎる、、、メッセージ箇所も最初なんて読むのかめちゃ気になってしまいました。
※下にあるtranslateボタンで見れます。

世の中にある全てのWebサイトがイケてる世界を！
では、また来週！！