見出し画像

ゆめみコーポレートサイトリニューアル -アートディレクター目線-

2020年で20周年を迎えるゆめみ。
それを記念してかどうかは定かではないんですが、そのタイミングでコーポレートサイトのリニューアルプロジェクトが発足しました。
プロジェクト開始当時からアートディレクターとして参加し、ようやくリリースできましたので僕の目線からサイトについて書いていきます。

基本コンセプト

爆速!バクソク!ばくそく!
プロデューサーの「爆速」その一言から全てが始まりました。というのもリニューアル前のサイトはまー重いこと・遅いこと。開発会社のホームページがこれじゃあまりにも印象が悪い、あまりの表示速度の遅さに毎回ストレスを感じていました。
そこで上記のセリフが出たわけですが、異論なく今回のリニューアルでは何をおいても爆速を実現しよう!と「爆速」がプロジェクト全体の合言葉になりました。
ではどう爆速を実現するのか?はプロデューサー工藤のnoteから引用⬇️します。

まず目をつけたのがSSG(Static Site Generator)です。
後述するDevOpsフレンドリーにも繋がりますが、今回のサイトは全コンテンツが Amazon S3 に、静的なhtmlファイルとして格納されています。クライアント側からは、 Amazon CloudFront 越しにアクセスしますので、従来のWebサイトよりも速くページ表示されると思います。動的な部分にはNuxt.jsを使っており、ページ全体はSPA(Single Page Application)で生成されています。

上記のようにNuxt.jsを使用してSPA(Single Page Application)で生成されています。モダンですね!

デザインコンセプト

ゆめみは自律・自責・自学の元に社員一人一人に大きな裁量を与え成長を強力にサポートしている会社で、個人の成長が会社の成長につながると考えています。
没個性で会社にフィットさせるのではなくそれぞれが個性を持って成長し、その結果ゆめみ自体個性的に成長していける、と僕は考えていますので今回はそれを象徴するものがいいと考えていました。
その思いを持ちメンバーでディスカッションした結果、ゆめみそのものが有機的な生命体であると方向付けし、そこから発展させた結果キーワードとしてフラクタル・フィボナッチ(数列)と導きました。一見個性と相反するキーワードに感じますが、社員一人一人がゆめみを象徴する存在であり、さらには会社を自分ごと化していくことの重要さも伝えられるのでは、と考えました。
ぜひサイトから有機的・フラクタルを表した部分を探してみてください。

爆速の壁

爆速と言えるほどの表示速度は、当たり前ですがグラフィックを大きく扱ったり写真を前面に引いたりというデザインでは、ファイルサイズが大きすぎて実現できない。
この当たり前のことが今回のプロジェクトで大きな壁となりました。極力画像を使わない工夫を行いましたが、今回背景は特に苦労しました。常に色を美しくシームレスに変化・ループするデザインを実現するため、画像は極力小さくCSSを駆使してなんとか現在のものを実現しました。

リリースして

社内でのレビューを繰り返し、第三者からの目線を取り入れながらなんとかリリースをいたしました。
やはりプロデューサー工藤も言っています爆速は正義。まるで”色の白いは七難隠す”のごとくまだまだ完成度は低いものの概ね好評のようで一安心しています。
ここで満足せず、今後は成長するコーポレートサイトを目指しバージョンアップをしていきますのでその際には続編を投稿いたします。

その他のメンバーのnote


この記事が気に入ったらサポートをしてみませんか?