Story | サイト制作秘話
#1 Departure
#1 Departure
世界レベルのWebサイトへの序章
「今まで見たことがない、日本一のWebサイトを創る。」 Sazeの熱い想いが、本プロジェクトの幕開けとなりました。
従来のコーポレートサイトには、会社の技術力や文化、そして未来へのビジョンを十分に伝えきれていないという課題がありました。そこで私たちは、単なる情報羅列に終わらない、ユーザーにSazeの魅力を伝える圧倒的な体験を提供するWebサイトを構想しました。
これは、優秀なエンジニアと出会うための一般的なWebサイト制作ではなく、Sazeの未来にとって極めて重要な「投資的活動」として位置づけられました。プロジェクト開始から、常に「最高」を追求する姿勢で、私たちは未踏の領域へと踏み出したのです。
#2 Inspiration
#2 Inspiration
デザインの壁とCGの閃き
私たちはこの挑戦的なプロジェクトを実現するため、クリエイティブパートナー「株式会社セルインタラクティブ」と共に、最初の2ヶ月をかけてサイト全体のコンセプトとデザインの方向性を模索しました。
既存の枠にとらわれない表現を追求する中で、「どんな自由を選択するも、自由の定義もユーザーの自由。」というコンセプトアイデアが生まれました。サイトにさまざまな自由を表すモチーフが現れ、スクロールと連動しながら、「自由とは、自ら選び、その意味も自分自身で定義するもの」というSazeの価値観をCGを用いて体験させるサイトにしよう、と決定したのです。
このCGを核としたコンセプトメイキングには、2ヶ月もの時間を費やしました。度重なる議論と試行錯誤の末、「鍵」「翼」「扉」という３つのモチーフが誕生。「鍵」は自由への探求、「翼」は可能性を広げ飛翔する力、そして「扉」は新たな世界を自ら開く意思。これらが、自由を求め自ら道を切り開いていく世界観を確固たるものにしました。
#3 Frontier
#3 Frontier
WebGLが拓く未踏の領域と、1年間の技術的格闘
コンセプトを実現するための手段として、私たちは「WebGL」の導入を決断しました。しかし、それは同時に、エンジニアチームにとって長く険しい戦いの始まりでもありました。
制作期間は約1年。その実態は、単なるコーディングではなく、「ブランドの世界観をどう物理演算やシェーダーで翻訳するか」というR&D（研究開発）そのものでした。特筆すべきは、コアとなるビジュアル表現です。既成の質感表現に頼りすぎず、必要に応じてシェーダーを用いた独自の質感調整を行いながら、ブランドが求める「自由」や「揺らぎ」のニュアンスを細密に再現していきました。抽象的なイメージをパラメータや数式へと置き換え、形状の変化や光の応答を幾度も再計算しては微調整する。
さらに、ポストプロセスでの色調整やブレンド、動きの後処理を含め、最終的な映像としてのまとまりを整えていく過程は、コードを書くというよりも、光と形を少しずつ削り出していく彫刻のような作業に近いものでした。
そして、大きな課題となったのが「最適化」でした。ハイエンド環境だけで滑らかに動作することよりも、一般的なノートPCやスマートフォンでも無理なく体験できることが重要でした。そのため、描画負荷の調整や複数の描画処理の統合、後処理の整理、FBO やテクスチャ解像度の見直しなど、レンダリング全体の最適化に幅広く取り組みました。
さらに、3D 制作工程でも現実的な範囲での負荷調整を進めています。ポリゴン数の調整、テクスチャの解像度管理に加え、UV アトラスを作成してテクスチャ枚数を減らすなど、表現の質と軽量化のバランスを取りながらデータ構造を整えていきました。
※WebGL（Web Graphics Library）とは
Webブラウザ上でプラグインなしに高機能な2D/3Dグラフィックスを表示できるJavaScript API。HTML5の要素をグラフィックス描画領域とし、ユーザーのデバイスのGPU（画像処理装置）を直接活用することで、インタラクティブで高品質なグラフィックを高速に処理する技術です。
※ FBO（Frame Buffer Object）とは
Web ブラウザ上で行われる 2D/3D グラフィックス処理において、描画結果を画面に直接出力するのではなく、一度オフスクリーンに保持するための仕組みです。これにより、ぼかしや合成など複数の効果を重ねながら高速に処理でき、インタラクティブな表現の実現とパフォーマンス最適化の両方に重要な役割を果たします。
#4 Compass
#4 Compass
サイトに込めた未来への羅針盤
完成したサイトは、単なる企業紹介の枠を大きく超えるものとなりました。 TOPページにはJavascriptのコードを使用した演出や、ホバーによるインタラクションなど、遊び心をくすぐる要素をふんだんに取り入れています。
創業者の伊藤が掲げる「エンジニアが世界一働きやすく、エンジニアがあげた成果を正しく還元する会社」という経営ビジョンは、WebGLで緻密に描かれたCGの世界観の中に凝縮されています。「鍵」「翼」「扉」のモチーフは、サイトへアクセスするユーザーに対して、「既存の枠にとらわれず、自らの手で未来を切り開くことの可能性」を強く示唆しています。
このWebサイトは、単なる採用のためのサイトではありません。私たちがエンジニアにかける真剣な姿勢と、未来への飽くなき挑戦、そして「自由」という一貫したテーマを象徴する、羅針盤なのです。
