インタラクティブな禅庭園 HTML アニメーション
Three.js/Canvas を使用して、単一の HTML ファイルでインタラクティブな 3D 禅庭園を作成するためのプロンプトです。カーソルのドラッグでハイトマップに溝を刻む動的な砂紋描画や、リアルな影でシーンを再照明する時間帯切り替え機能を備えたアニメーションが特徴です。
創作結果
参考プロンプト
事例の意図をもとに編集した参考例です。自分のテーマに合わせて調整できます。作者の元投稿は出典欄をご覧ください。
“Make a rakeable zen garden in one HTML file. Use a 1536-pixel sand heightmap over a 440×440 grid, updating it as the cursor draws five grooves and six ridges along each stroke. Arrange five moss-covered rocks, two stone lanterns, and a maple with 420 leaves around the sand. Add a time-of-day switch, with a low golden-hour sun that makes the raked grooves cast shadows. Review the scene for moss leaking through sand, blocky rock shapes, and lanterns falling outside the frame.”
PagePopで制作するには
助手を選んで依頼を伝え、PagePopと制作を進めます。会話で修正し、完成した作品をダウンロードできます。
目的に合う助手を選ぶ
幅広い業界の専門助手を探せます。豊富な事例集からアイデアを見つけることもできます。
自然な言葉で依頼する
画像、動画、PPT、ドキュメント、Webページなど、作りたいものを伝えてください。必要に応じて参考画像や資料を追加できます。
モデルを自動で選び制作
PagePopが目的に合うモデルとツールを選び、作品を制作します。
修正してダウンロード
同じ会話の中で内容や見た目を繰り返し調整できます。納得できたらダウンロードして使えます。
自分の言葉で始めましょう
この実例を参考に自由に変更し、最適な制作方法はPagePopに任せてください。
よくある質問
この動画事例を自分の制作に活かすには？
「インタラクティブな禅庭園 HTML アニメーション」の参考プロンプトを起点に、テーマ・スタイル・縦横比を置き換え、参考画像や関連資料を追加してください。取り入れたい構成を残し、不要な条件を削除して、結果を見ながら調整できます。
閲覧やプロンプトのコピーは無料ですか？
プロンプト集の閲覧とコピーは100%無料です。PagePopも無料で利用できます。料金とクレジットのルールは料金ページでご確認ください。
PagePopとは何ですか？何ができますか？
PagePopは対話型のAI制作プラットフォームです。自然な言葉で依頼し、画像・動画・プレゼンテーション・ドキュメント・Webページを制作できます。PagePopが適切なモデルとツールを選び、同じ会話の中で修正を続けられます。
その他の実際のプロンプト例
インタラクティブ ターボファンエンジン
“Build an interactive Three.js turbofan that can be taken apart in the browser. Label the airflow stages from intake and compression through combustion and exhaust. Show the fan's bypass flow, the compressor's pressure i…”
決定論的なフレームベースの動画レンダリング
“Animate an X-ray-style butterfly using a fixed 1000×1080 canvas and frame-number-driven drawing. Build a 720-frame, 12-second loop in which draw(f) gives the same image whenever that frame is requested. Avoid clocks, ti…”
HTML で実現する WebGPU オーシャンシーン
“Build an ocean scene that runs in the browser as a single HTML file using WebGPU. Drive the sea surface with FFT waves, add whitecaps, and place it under a realistic sky. Include WASD movement so the viewer can explore…”