株式会社ジュニの初となる採用特設サイト「Junni is...」を公開。デザインから作っていく普段の制作スタイルとは異なり、WebGLによる実装を先行して、デザインを後付していくフローで制作。

WEBの３大デザインアワード受賞！

WEBサイト公開後、「The FWA 」で「FOTD（FWA of the day）」を受賞、「 CSS Design Awards」「Awwwards」で「SOTD(Site of the day)」を受賞し、WEBの３大デザインアワードでそれぞれ賞を獲得。

今回の実装のTipsやリポジトリも同時に公開することで業界界隈にも話題を提供しました。

今回は採用サイトとしての役割もあり、ジュニの多様性や、自由な発想で生み出されるクリエイティブをグラフィカルに表現するサイトとして、また、エンジニアの実装から始まり、細部のデザインや演出は後から加えるという通常の制作フローとは真逆の進行というチャレンジ的な制作となりました。

ジュニのマスコットキャラクターであるバクを中心に、色んな見せ方や演出でシーンを切り替え、全ページを通して"Junni is ~"をキーワードに展開しています。
その結果、“企画から制作までワンストップで制作できる”、ジュニの強みを詰め込んだサイトになりました。

映画を見ているようなストーリー展開

ジュニでは様々な種類の案件があるので、デザインや技術の幅の広さや企画力をサイトで表現すべく、セクション毎に「ポップ・クール・スタイリッシュ・カワイイ（キュート）」とキーワードを設定。
それぞれで全く違う見せ方、演出にしつつサイトとしては『一本の映画を見ているような感覚』を味わってもらえるような一貫性を持たせたシームレスなWebサイトを目指しました。

どのページもメッセージ性の強い、ジュニのこだわりを感じられる仕上がりになってます。
今回はプランナーが企画し、デザイナーがデザインを制作、エンジニアが実装するという通常の制作フローとは異なり、エンジニア発となるサイト制作を行いました。
アートディレクターの黒図とフロントエンドエンジニアの右近を中心に制作した実験的なサイト『Junni is…』は、WebGLの演出とビジュアル、そしてアソビゴコロを追求したスペシャルサイトです。
ぜひご覧ください。

興味を持った方はぜひサイト制作の裏側を御覧ください。

突拍子もないWebサイトの作り方 技術編
https://zenn.dev/junni/articles/bb71f44c89cb77

突拍子もないWebサイトの作り方 制作フロー編
https://zenn.dev/junni/articles/3a62a247a033db?redirected=1

社内インタビュー記事
https://www.wantedly.com/companies/junni/post_articles/453134