はじめに
エキサイト株式会社3年目デザイナーの山﨑です！
7月10日に開催された「エキサイト第5回ビアバッシュ 」に登壇させていただいたので、その時に発表したことを共有したいと思います。
「エキサイト第5回ビアバッシュ」では、コーポレートサイトリニューアルにあたってどのような事を準備してきたのか、サイトをリニューアルしたことで何が変わったのかなどを発表しました。
リニューアルの目的
今回エキサイトHDの上場にあたり、エキサイトHDとエキサイト株式会社のコーポレートサイトリニューアルが決定したのですが、エキサイトHDとエキサイト株式会社それぞれのリニューアルする目的の違いを明確にする必要がありました。
以下が改修目的の違いになります。
【改修目的】
エキサイトHD：サービス・IR情報を充実させ、事業理解を促す
エキサイト株式会社：企業のブランディングにより求職者を増やす
この記事では「エキサイトHDコーポレートサイト」のみに絞りイメージボード制作からデザイン完成までの流れを説明していきます。
イメージボード製作とすり合わせ
発注先がデザイン制作に入る前に、「ユーザーがコーポレートサイトを見たときにどのような事を感じて欲しいのか」「感じてもらうにはどのようなデザインが適切なのか」を決めるため、以下のような工程でイメージボード制作を進めていきました。
① コーポレートサイトで表現したいキーワードの精査
② キーワードに対しての見た目的表現の方向性を決める
③ ①、②をイメージボードにして、チームで認識合わせをする
④ ステークホルダーに共有する
⑤ 発注先の制作会社に共有する
コーポレートサイトで表現したいキーワードの精査
エキサイトHDのサイトで伝えたいことをキーワードに落とし込み、イメージを明確にしました。
キーワードに対しての見た目的表現の方向性を決める
落とし込んだキーワードが、上図にあるイコライザーのどの位置にいるのかを明確にしました。
①、②をイメージボードにして、チームで認識合わせをする
キーワード、イコライザーにより近いサイトをイメージボード形式で並べ、「このデザインのどういった所がアクティブだと感じるのか」など付箋を貼りながらすり合わせしていきました。
ステークホルダーに共有する
デザイナー内で「視える化＆合意」したイメージボードを制作会社に伝える前にステークホルダーに共有します。
イコライザーのみですとピンとこないものも、ビジュアルと併せて伝えることで方向性の大きな違い→手戻りを防ぐことができます。
発注先の制作会社に共有する
ステークホルダーへの承認を得たら、制作会社にイメージボードの共有をして依頼をしました。
こちらが実際のデザインになります。
白を基調に、シンプルで洗練されたデザインに仕上げていただきました。
ファーストビューの調整
エキサイトHDのサイトでは、ファーストビューに各主要サービスの画像が自動で流れるデザインになっています。
同じレイアウトにするためガイドラインを作成し、各サービス担当のデザイナーさんにPC・SPのファーストビューを制作していただきました。
リニューアルした結果
コーポレートサイトをリニューアルしたことより、「ユーザー当たりビュー1.7倍＆滞在時間2.7倍改善」という結果になりました！
弊社が上場したことでHDサイトのアクセス数が伸びたことも理由の一因だとは思うのですが、従来のHDサイトからよりパワーアップしたサイトをお届けすることができよかったと思います🙌
最後に
最後に、エキサイトではデザイナー、フロントエンジニア、バックエンドエンジニア、アプリエンジニアを絶賛募集しております！
興味があればぜひぜひ連絡ください！🙇
