コンセプト作品 ・ IT企業
NOVA Technologies
架空の事業者を想定して制作したデモサイトです。実在の企業・店舗とは関係ありません。
IT企業を想定したサイト。3D表現やスクロール演出など、表現の技術を詰め込んだ作品です。
想定した課題
投資家や提携先の候補、エンジニアを目指す求職者に向けて、会社の技術力そのものを、見て・触って伝える必要がありました。
- 想定したお客さま：投資家・提携先の候補の方と、エンジニア志望の求職者
- サイトのゴール：お問い合わせページからのご連絡
設計のポイント
スクロールやマウスの動きに合わせて立体（3D）の図形が形を変える最初の画面を軸に、紹介している技術そのものを使って各セクションを演出しました。スマホでは重い3D表現を軽い表現に切り替え、快適に見られるようにしています。複数の言語での表示や、暗い配色（ダークモード）にも対応しています。
使った技術
- React Three Fiber（Three.js／WebGL）による3Dヒーロー
- GSAP ScrollTrigger による文字単位のスクロール演出
- Canvas 2D API
- next-intl による多言語対応・デフォルトダークモード
- モバイル向けの CSS／SVG 代替表現