■ 概要 Overview
小学館が創立100周年を次の100年を見据えた「0周年」と定義し、現場の人間が常に自分の中に「0」を持ち続け考え続けるという決意表明と、次の100年に向けてどのような種をまいていくのか紹介した特設Webサイト
■ ファーストビュー Above the fold
カウントアップのアニメーションの最後に100周年記念ロゴ
その後にトップメニュー
ハンバーガーメニュー
コンセプト
キーワード
水彩絵の具が水で漂うようなアニメーションの中央に「0」の型抜きをしたシェイプを配置
■ ターゲット Target
ユーザー全般
■ フォント Font
Zen Kaku Gothic New
12px,18px,24px,48px,60px
■ カラー Color
#E7C06A,#E2D427,#57DF4F,#66D5D9,#4C89D6,
#AA53EC,#EE8DB2,#F0586B,#EBAB21(ランダムで変わる)
#FFFFFF
#16140F
■ デザインの特徴 Design features
100周年にちなみ、100までのカウントアップを100種類のフォントによってイベントがおこり、100周年記念ロゴに到達する。
本をモチーフにしたロゴになっていて、中央に大きく設置した後に、テーマである「０」のモチーフへとアニメーションで移行される
「0から考えよう。」というテーマについて解説があり、１行25文字以下の中央揃えで、Zen Kaku Gothic newを採用。
Zen Kaku Gothic newによって可読性の高さを獲得している。
Zen Kaku Gothic Newはベーシックなサンセリフで、シンプルなデザインが自然な読みやすさをもたらすとされているが、ヒューマニスト系のサンセリフのように柔和なニュアンスがあり、テキストでありながら、人に語り掛けるようなイメージを与える。
イメージやテキストは全て中央に配置されており、余白もたっぷりとり、強いメッセージ性がある。
背景は有機的に動くアニメーションで、イメージやCTAボタンはオンマウスでイベントがおこるようになっている。シンプルながらも、感情に訴えかけるデザインんになっている。
https://www.shogakukan.co.jp/zero/