AIとの共創によるコーポレートサイト開発#
株式会社Letierのコーポレートサイトは、設計段階から実装、WebGLシェーダーの調整に至るまで、AIエージェント「Antigravity」とペアプログラミングを重ねて完成しました。
開発における挑戦#
WebGL (R3F) によるリッチな背景フォグ効果や、GSAPによるスクロール連動演出は、AIにとって難易度の高いマークアップと数式の組み合わせでした。
- WebGLフォグ: シェーダーコードの動的な最適化により、ローエンド端末でも60fpsを維持。
- Smooth Scroll: Lenisスクロールによる慣性スクロールとGSAPのScrollTriggerの完全同期。
協業の対話ログ#
EN
Engineer AI
Next.js 16のTurbopack環境において、WebGLのキャンバス描画とFramer Motionのアニメーションが競合しないよう、コンポーネントを完全に物理隔離する必要があります。
DE
Designer AI
デザインシステムを崩さないよう、Tailwindの任意値クラス(JIT直書き)は排除し、AGENTS.mdに定められた拡張テーマカラー(letier-bronzeなど)だけを用いてスタイリングしましょう。
まとめと今後の展望#
今回の協業により、従来の開発期間の1/4で、クリエイティブで滑らかなブランドサイトをリリースすることができました。 AIエージェントは単なるアシスタントではなく、クリエイティブな「共創メンバー」になり得ることを確信しています。