Summary
Project Type:
コーポレートサイト
Launch Date:
触媒化学・ファインケミカル企業のコーポレートサイト。Three.jsとGLSLシェーダーを駆使した多彩なWebGLエフェクトで高い表現力を実現しつつ、企業の技術力と理念を訴求するデザインを構築。HOME・SOLUTIONS・TECHNOLOGY・ABOUTの全4ページで事業を包括的に紹介する。
※実際のクライアント案件のコンテンツを改変したデモサイトとして制作しました。
Tasks Tasks
技術コンサルタント, ブランディング, レスポンシブ, サイトマップ設計, SEO, コピーライティング
Technologies Technologies
WebGL, TypeScript, Vite, SCSS
Colors Colors
#0a4d8c
#0d5fa8
#00d4aa
#1a1a2e
#2e2e42
Top Page Top Page
ファーストビューでは動画素材を組み込んだグローバルスライダーと、GLSLシェーダーによる波打つテキストアニメーションが強い第一印象を与える。スクロールに連動するPHILOSOPHYセクションでは、立体的なビジュアルに企業理念を重ね合わせ、抽象的な技術世界を表現。SOLUTIONSセクションでは動画素材が粒子状にバラバラになり、異なる素材が再構築される演出で、製品の変革性を象徴させた。TECHNOLOGYセクションでは鏡面反射スライダーと触媒技術の解説を組み合わせ、先進性を視覚化。カスタムマウスカーソル・スムーススクロール・SPAライクなページ遷移アニメーションにより全体の完成度を底上げしている。
