ai21.net
言語

インタラクティブな3Dのカメラレンズを、単一のHTMLファイルで作って…

インタラクティブな3Dのカメラレンズを、単一のHTMLファイルで作って… — 1

プロンプト

Build me a camera lens in interactive 3D, in one HTML file with Three.js.

Make it look real: a big black pro zoom lens with its glass front, the rubber focus and zoom rings, the red stripe and the white numbers, and inside it the parts you never get to see. The stack of glass elements in their groups, the aperture blades that open and close, the focus motor, the image stabilizer, the zoom cams, and the gold contacts on the mount. Cut it open down the side so I can see the glass inside, with light passing through it as colored beams that bend and meet on the camera sensor behind it. The aperture blades open and close slowly. I can drag to orbit around it and scroll to zoom.

Add an Explode button. When I press it, every part slides apart along the lens with its name on a label. Press it again and it all snaps back together. When I hover a part, it lights up and shows one line on what it does.

No images. Do not ask me any questions. Just build it.

日本語訳

Three.jsを使い、単一のHTMLファイル内にインタラクティブな3Dのカメラレンズを作成してください。

本物らしく見せてください:前面にガラスを備えた大きな黒いプロ用ズームレンズ、ラバー製のフォーカスリングとズームリング、赤いラインと白い数字、そして内部には決して目にすることのない部品まで。グループごとに積み重なったガラス素子、開閉する絞り羽根、フォーカスモーター、手ブレ補正機構、ズームカム、そしてマウント上の金接点。側面を縦に切り開いて内部のガラスが見えるようにし、光が色の付いた光束となってレンズを通り抜け、曲がりながら背後のカメラセンサー上で収束するようにしてください。絞り羽根はゆっくり開閉します。ドラッグで周囲を回り込み、スクロールでズームできます。

「Explode」ボタンを追加してください。押すと、各部品がレンズに沿ってスライドして分かれ、それぞれの名札が表示されます。もう一度押すと、すべてが元の位置にパチッと戻ります。部品にカーソルを合わせると、その部品が光り、機能について一行で表示されます。

画像は使わないでください。質問は一切しないでください。ただ構築してください。

出典

原作者
aichrislee
公開日
2026-10-10(由推文 ID 反解)
原典
元の投稿を見る ↗
収録元
yihui-dev/awesome-opus5-5-videos · aichrislee-408244 · MIT