解説 / チュートリアル

Three.js で 9 気筒星形エンジンのシミュレーションを構築します。シリンダーの断面図、マスターロッドと連結ロッド、可変ピッチプロペラを含め、RPM、トルク、圧力のリアルタイム更新を実装してください。始動、スロットル、マグネットスイッチなどのコントロールを追加し、視点の回転（オービット）、分解表示（エクスプロードビュー）、メカニズムの観察を可能にします。

脳内のニューロンが過剰反応する、面白い動画を作成してください。 これはあなたの脳とドジなキャラクターたちです

"Gummy Bears" の構築 - 単一の自己完結型 HTML ファイル（唯一の依存関係は CDN から読み込まれた three.js）：白いテーブルの上に置かれた半透明のグミベアの数々を、掴んで引き伸ばしたり、潰したり、投げたり、注いだりできます。 グミベアについて - クラシックなグミベアのシルエット：丸い頭部と二つの耳、短い鼻先、ふっくらとした体躯、ずんぐりした腕と脚、小さな成型された目と鼻 - すべてのパーツが滑らかに融合していること - 個々の球体を組み合わせるのではなく、メタボールやマーチングキューブなどの暗黙的表面として体を構築してください - マテリアル：本物のグミキャンディ。透過と屈折を備えた半透明素材、厚みのある部分で深くなる色吸収、鋭いハイライトを持つ光沢のあるクリアコート - カラー：チェリーレッド、オレンジ、レモンイエロー、アップルグリーン、クリアパインアップル - 各グミベアの下には、その色に染まった柔らかい影を表示 物理挙動（これが最重要ポイントです - プラスチックではなく、ゼリーのように感じられる必要があります） - 各グミベアはソフトボディとして扱います：頭部、耳、鼻先、体、腹部、手、足に質量点を配置し、体積保存形状マッチングによって結合します - 四肢と首は点間をつなぐ伸縮性のあるストランドとしてレンダリングされ、引き伸ばされると細くなります - どの部分でも掴んで引っ張ると：ゴムのように伸び、他の部分がそれに追随して傾き、離すと減衰した揺れとともに元に戻ります - 頭部を上へ引っ張ると：首が伸び、体が追従し、離すとグミベアは潰れて跳ねます - 頭部を下へ押すと：グミベアはパンケーキのように平らになり、横に膨らみ、その後勢いよく元に戻ります - グミベアを投げると：飛んでいき、着地時に潰れ、バウンドしながら他のグミベアを押しのけます - グミベア同士は衝突し、互いを貫通することはありません - 待機中のグミベアは、潰れと伸びを伴う小さなランダムなジャンプを行います - "Pour more bears" ボタンを押すと、上から数匹のグミベアが落ち、揺れ動く山になります UI - 白背景のエディトリアルな製品ページスタイル。大きなイタリックセリフ体のタイトル "Gummy / Bears."、短いサブタイトル、右側にフレーバーのスウォッチ、揺れスライダー、ライブ表示される "Stretch" と "Bounces"、そして "Pour more bears" ボタンを含むミニマルなカード - 掴んでいる間に拡大する控えめな円形カーソル - ACES トーンマッピング、環境反射、ソフトなキーライトとバックライト。スムーズな 60fps

#threejs を使用して自律型電動モーター工場を設計します。レーザーによる鋼材の切断から各モーターのスピンテスト実施まで、生産ライン全体をブラウザ上でライブ表示してください。

康熙年間の建築図面に基づき、紫禁城の太和殿を一から再建します。柱 72 本、斗拱（とうきょう）372 組、釉瓦（ゆうがわら）80,000 枚以上、そして屋根の隅に配置された 10 体の鬼瓦まで、すべてを再現。動画内の施工手順は原本の記録から完全に導き出されています。Blender は使用せず、すべてコードによって生成されました。

SpaceX の歴史に関する動画を制作します。ナレーション、音楽、モーションエフェクト、および自動取得されたアセットを含めます。プロセスでは、まずストーリーボードを一覧表示し、その後バージョンごとに微調整を繰り返して反復します。最後に著作権チェックを手動で実施してください。

回転可能な4ストロークエンジンのインタラクティブなアニメーションを作成します。93個の個別部品をモデリングし、シリンダー内の炎を表現するためにシェーダーを使用します。その後、このアニメーションから47秒の動画出力を生成します。

Tesla 型電気モーターの仕組みを解説するシネマティックな 3D アニメーションを作成

1 行の依頼だけで Claude Code (Opus 5.5) に Three.js で回転・ズーム可能なピストンとクランクの 3D 図を作成させました。作業時間はわずか 8 分です。 ■ 作成した内容 - ピストン、コンロッド、クランクシャフト（メインシャフト、アーム、ピン、フライホイール）、透明シリンダー、ヘッド、スパークプラグ、燃焼室の炎 - Remotion を使用した縦型 1080x1920、30fps、32 秒の動画 - 画像素材は一切使用していません。部品や炎はすべてコードで描画しています。 ■ 仕組み - クランク角度から数式を用いて毎フレームピストンの高さとコンロッドの角度を計算します。 - 4 ストロークエンジンであるため、上死点直後の 720°に一度だけ燃焼室が光ります。 - 部品のラベルを示す線は、同じカメラで 3D ポイントを画面に投影して描画されています。そのため、回転やズームを行っても、線が正しく部品を指し示します。 ■ 作り方（3 ステップ） 1. 依頼はたった 1 行：「Three.js で回転・ズーム可能なピストンとクランク運動の 3D 図を作ってください」 2. すでにインストール済みの @remotion/three と @react-three/fiber のみを使用して構築しました。追加のインストールはありません。 3. 中間の静止画を 3 回確認し、ピストンリングの向き、カメラの距離と高さ、ラベルとグラフの重なりを修正してからエクスポートしました。ヘッドレスレンダリング (--gl=angle) でも 3D 出力は無傷で保たれ、一発でエクスポートが完了しました。 ■ 注意点 - 元の投稿にあるスキル「Anatomy」は含まれておらず、テストもされていません。ローカルの Three.js のみで構築されました。 - 炎は半透明の発光シリンダーとポイントライトで構成されています。元の投稿のような WebGL シェーダーベースの炎、水、プラズマは実装されていません。 - クランクシャフトのカウンターウェイトは形状が簡略化されているため、角度によっては暗い板のように見えるフレームがあります。 - 視聴者自身が回転やズームを行うことはできません。動画内でカメラが移動して異なる角度を表示します。

ブロックチェーン、ビットコイン アーキテクチャ、ハッシュ アルゴリズムに関する解剖図風アニメーション

Napster の仕組みを解剖学的スタイルの Jig で示す。楽しい カメラ トランジション、モーション、視覚効果、カラー ハイライトを活用して、重要な部分や瞬間を強調してください。

Google のインデックス作成および検索アルゴリズムの仕組みを解剖学的な視点で示す Jig です。そのスケールと速度が重要であるため、Jig 内で驚くほど印象的なズームアウトなどの演出を用いて表現してください。楽しいカメラワークを使用します。

TikTok の動画レコメンデーションアルゴリズム（予測、高速検索、即時再生など）の仕組みを示す解剖図スタイルの Jig を作成します。事実を捏造しないよう事前に調査してください。楽しいカメラ遷移、モーション、視覚効果、色によるハイライトを活用して

Shazamアルゴリズムの仕組み（音声指紋認証、高速検索など）を解剖学的な視点で示すJig形式のコンテンツ。楽しいカメラのトランジション、動き、視覚効果、そしてカラーハイライトを活用して、主要な部分や重要な瞬間を際立たせてください。

以下のシーンを含む、セキュリティワークフローの解説動画を作成してください。 i. マップ: リポジトリ、依存関係、アクセスルール、ログをマップとして構築し、攻撃経路を追う前の状態を表示します。 ii. トレース: ユーザー入力が生 SQL に至る過程を追跡し、信頼できないデータがクエリに到達する箇所を強調表示します。 iii. ホールド: ファジングテストで orders.py が検出され、エクスプロイトがフラグ付けされると、ワークフローはマージを「HOLD（保留）」に設定します。 iv. パッチ: 修正を適用し、当初のエクスプロイトが依然として機能するかを確認します。 v. 再攻撃: レッドチームサブエージェントがパッチ適用後のコードを攻撃します。画面には指示文「fix it · then try to break it again」を表示します。エージェント自身の作業が次の標的となります。 vi. 引き継ぎ: PR を作成し、セキュリティアドバイザリーは非公開のままにし、人間の承認を待ちます。興味深いのはパッチ適用後であること、つまり再度破壊を試みる段階であることを強調します。 最終的な画面テキスト: 「opus never merges alone」 テーマ: 自分の修正を攻撃せよ。人間の「Yes」を勝ち取れ。

添付された hrv_recovery_log.csv ファイルから、30 秒の説明動画を作成してください。 ビジュアルスタイル：白い背景、最小限のテキスト。 ルール： 1. すべての数値を CSV から計算してください。 2. 因果関係を主張せず、相関関係のみを示してください。 表示すべき主要な洞察： > SLEEP - 「回復にポジティブな影響」 > ALCOHOL - 回復を「かなり悪化させる」 > LATE MEALS - なしの場合 70.2 ms、ありの場合 58.1 ms、差は -12.1 ms > WORKOUTS - 「回復にいくらか影響はあるが、大きな効果ではない」 まとめメッセージ：「十分な睡眠を取り、飲みすぎないこと。」

Pudgy Penguin NFT のライブ・トレイトスキャナーインターフェースを構築します。 対象: 特定の Pudgy Penguin イメージ 1 枚。 パイプライン: Hair -> Eyes -> Medal -> Full Scan -> Grade。 手順: 1. 1 つの対象と 1 つのパイプライン（hair, eyes, medal, full scan, grade）を固定します。 2. まずトレイト辞書を作成し、モデルが体に存在しないパーツを勝手に生成しないようにします。 3. センターステージを構築します：ペンギン、照準レティクル、FULL SCAN バッジ。 4. 左側の表示はトレイトのみとします：afro, pick, eyes, beak, fur, medal, ribbon, aura。 5. 右側の表示はスキャン統計のみとします：conf, depth, rate, lock, sway。 6. 最後に下部デッキを接続します：star path, crystal ball, rune track, mana curve。 7. スキャンを最初から最後まで再生し、ロックが現実的に感じられるまでパネルごとに修正します。 ルール: - 1 ステップにつき 1 つの表示を担当します。 - フルシルエットがロックされる前に判定結果を表示しません。 まず 1 匹のペンギンから始め、次のスキャンでは同じマシン内で新しい対象として処理します。

4つのトピックを扱う82秒のテックニュース動画を制作します。 1. スクリプト: ブリーフィング内容を口語的なナレーションに一文ずつ書き直します。映像にはブリーフィングに記載された事実のみを表示します。 2. ナレーション: VoxCPM2 をローカルで使用し、中国語男性音声合成を実行します。Whisper による文字起こしで検証します。 3. 音楽: YuE2 をローカルで使用し、純粋な音楽（ジャズヒップホップスタイル）を生成します。ナレーションに合わせて自動ダッキングを行います。 4. ビジュアル: HyperFrames を使用し、HTML + GSAP アニメーションを動画としてレンダリングします。スイススタイルのタイポグラフィを採用し、スクリーンショット用に余白を確保します。 5. 同期: 各ナレーション行の実長を測定し、カメラワーク、字幕、数値表示を音声と同期させます。