ノート

Claude、Three.js、GSAPを使ったスクロール駆動のストーリーテリングWebサイトを構築する

フリーのプロンプト百科事典 Wikiprompt より

FHILY👑

2026年6月9日

Claude、Three.js、GSAPを使ったスクロール駆動のストーリーテリングWebサイトを構築する Claudeにスクロール駆動のストーリーテリングWebサイトを構築させるためのステップバイステップのワークフロー。Three.js、GSAP ScrollTrigger、Lenis.jsを組み合わせてスムーズなスクロールを実現します。

関連メディア

プロンプト内容保存

英語から翻訳 ·

1. Claudeにプロンプト:「各スクロールセクションが流れるような色の遷移で新しい章を明らかにするストーリーテリングウェブサイトを構築してください。」 2. カーソルに反応するペイントされたテクスチャ背景にThree.jsを使用します。 3. Claudeにプロンプト:「各セクションが映画的なシーンとしてアニメーションするようにGSAP ScrollTriggerを追加してください。」 4. プレミアムサイトが持つような、バターのように滑らかなスクロールにLenis.jsを使用します。

ログインしてこのプロンプトをコピーし、コレクションに保存

ログイン

使い方

このプロンプトは coding 向けに設計されています。上の内容をコピーして、お好みの AI ツールに貼り付けてください。

最良の結果を得るには、プレースホルダー(角括弧や大文字で示された部分)を具体的な要件に置き換えてください。

参考資料

カテゴリ:coding| twitter| claude-code| storytelling-website

ノート