Meng To

カーソルやタッチの移動に合わせて花粉やほこりのような粒子を発生させ、操作速度が変わっても粒の間隔を保つ表現を、固定数のGPU粒子を再利用して実装するスキル。

• カーソルやタッチの粒子軌跡
• 表面から花粉やほこりを舞わせたいとき
• キーボード対応の粒子放出ボタン

Three.jsの3Dモデルを、輪郭や構造を示すワイヤーから立体の表面へと順に出現させ、最後にワイヤーを消すスキャン演出を実装するスキル。

• 3Dモデルをスキャンで登場させたいとき
• 表面より先にモデルの構造を見せたいとき
• ホログラムの組み立て演出

白い本体に青緑の側面とくっきりした影を付け、単体の物を主役にしたSVGイラストを制作します。人物を使わず、アプリの案内画面や機能紹介を共通の画風でそろえます。

• データがない画面の挿絵
• アプリの初回案内用の画像
• 製品の機能を説明するカード

画面の曖昧なアイデアを、レイアウト・文字・配色・余白まで定めたUI生成用プロンプトに整理し、一つずつ条件を変えながら見た目を調整するスキルです。

• 曖昧な画面案をプロンプトにしたいとき
• LPや初回利用案内の見た目をそろえたいとき
• 配色やカード配置の案を比較したいとき

Webサイトの背景に、マウスを追う白い点描の光跡を追加します。WebGPUによる描画と、タッチ端末や動きを抑える設定に応じた静止背景への切り替えを扱います。

• ヒーロー領域に光の軌跡を加えたいとき
• 問い合わせ欄の背景を動かしたいとき
• タッチ端末では静止背景にしたいとき

奥へ続く格子と控えめな粒子で、立体感のあるWeb背景を作るスキル。距離による線のフェード、ゆっくりした前進、マウスに反応する穏やかな視点移動を調整します。

• 立体感のある技術系背景を作りたいとき
• マウスに反応する穏やかな視点演出
• 格子のフェードや粒子を調整したいとき

Reactのカードや入力欄に、縁を移動する光や脈打つ発光を加えます。読み込み・選択・フォーカスと連動させ、動きがなくても状態を伝えられる表示を整えます。

• 処理中パネルへの脈打つ発光の追加
• 選択中カードや現在の手順の強調
• 入力欄の下辺を光らせたいとき

3Dシーンの空を計算による表現やパノラマで作り、地平線の霞、太陽、影、反射を整合。カメラを動かしても自然な背景や、昼から夜への変化を設計するスキル。

• 建築・屋外シーンの空背景制作
• 夕景と影・反射の向きをそろえる
• 昼から夕暮れ、夜へ変化させたいとき

Three.jsで金属の反射と表面の質感を調整し、鋼・真鍮・金・銅などを描くスキル。照明環境、傷、指紋、経年変化、面取りまで扱い、工具や指輪の金属表現を整えます。

• 金属のプラスチック感を直したいとき
• 鏡面やヘアライン仕上げの作成
• 緑青や縁の摩耗の表現

建物や展示空間の3Dバーチャルツアーを実装し、案内ルートのカメラ移動、部屋一覧・間取り図からの移動、モデルの回転確認と段階的な読み込みを整えます。

• 建築の内覧ツアーを作りたいとき
• 不動産ツアーに部屋移動を加えたいとき
• 美術館・ショールームのツアー制作

Three.jsの水中シーンに、太陽へ収束する光の筋と揺らぐ水面を加え、カメラの移動や泳ぐ魚にも連動する光のまだら模様を表現するスキル。

• 水中に差し込む太陽光を加えたいとき
• 水面の揺らぎを下から描きたいとき
• 光を横切る魚の明暗を表現したいとき

Three.jsの海に、波・空や船の反射・太陽のきらめき・泡・航跡を組み込み、移動するカメラから水平線まで自然に見える水面を作るスキルです。

• 昼間や夕暮れの海を作りたいとき
• 船の航跡や船体まわりの泡の表現
• 浮かぶ物体を波に追従させたいとき

Retinaなどの高精細画面で3D表示のぼやけを直すため、200%描画や後処理の解像度、ポインター座標を整え、性能を測って画質の調整を行うスキル。

• Retinaで3D表示のぼやけを直したいとき
• 固定200%の描画設定を用意したいとき
• 後処理と操作座標を整えたいとき

Three.jsで和紙やコットン紙、クラフト紙の質感を作ります。繊維の凹凸、破れた縁、厚み、折れやインクのにじみ、逆光の透け方を接写でも見える形で表現するスキルです。

• 逆光で透ける和紙の障子を作りたいとき
• カードやラベルに破れと厚みを付けたいとき
• 接写で紙の繊維を見せたいとき

記事やチュートリアル、プロンプト集から独立して使える作業手順を抽出し、使用例、動作するデモ、プレビュー、検証を備えたスキル一式にまとめます。

• チュートリアルの手順をスキル化したいとき
• プロンプト集を機能別に分けたいとき
• 使用例と動作デモ付きで配布したいとき

空や木々、屋根の隙間から差す光の筋を、Three.jsなどの3Dシーンに追加します。遮蔽物や太陽の位置を反映し、見た目と描画負荷を調整する実装を支援します。

• 木々の隙間に木漏れ日を加えたいとき
• 屋根の隙間から日差しを見せたいとき
• 夕方の建築シーンを作りたいとき

3Dオブジェクトに、ホバーで視点が傾き、クリックで手前に持ち上がる鑑賞操作を実装します。回転・拡大縮小・元の位置への復帰まで扱います。

• 3D商品に鑑賞操作を付けたいとき
• 木組みの細部を回して見せたいとき
• 作品にタッチ・キー操作を付けたいとき

Three.jsで布の織り目や光沢、縫い目、裾の厚みを表現するスキル。ひだで模様が伸びない形状づくりから、薄布の透けや擦れまで扱います。

• 逆光で透けるカーテンを作りたいとき
• リネン・シルク・ウールの質感表現
• 接写用の裾や縫い目を作りたいとき

透明な水球や水の鞭、結晶の成長・粉砕をThree.jsで制作するスキル。屈折や反射、水しぶき、波紋、地面に落ちる破片まで、一連の視覚効果として組み立てます。

• 透明な水球や水の鞭を作りたいとき
• 結晶の成長・共鳴・粉砕演出
• 池に飛沫や雨、波紋を加えたいとき

Three.jsで高低差のないゲームステージを制作・改修するスキル。移動経路、衝突判定、戦闘エリア、照明を整理し、目的地の見やすさやPC・モバイルでの通しプレイを確認します。

• 平坦な通路や戦闘エリアの設計
• 装飾・衝突判定・移動経路の分離
• 光源と照明の対応を整えたいとき

Three.jsのゲームで、追従や斜め見下ろし、ズーム制限などのカメラ挙動を実装・調整するスキル。障害物による遮蔽やタッチ操作、動作確認も扱います。

• 追従や斜め見下ろし視点の調整
• 壁や高い障害物での遮蔽対策
• ロックオンや一時的な揺れの実装

完成したローカルのWeb作品を整理し、READMEと実画面のプレビューを添えてGitHubへ登録します。対応する作品はGitHub Pagesで公開し、動作も確認します。

• ローカルのWeb実験を共有したいとき
• READMEと実画面のプレビュー作成
• GitHub Pagesで作品を公開

Webサイトと提供された参考資料を文章・画像・動画・構成・変更履歴まで照合し、独自性を損なう類似点を証拠付きで整理して、具体的な修正案を示すスキル。

• 参考サイトとの類似を公開前に調べたいとき
• 文章や素材の重複を確認したいとき
• 変更履歴に残る流用の調査

既存の3Dシーンに春夏秋冬の切り替えを加え、葉や日差し、空、地面、雪を連動して変化させます。カメラや操作を保ちながら、季節の移り変わりを表現します。

• 屋外3Dシーンに四季選択を付けたいとき
• 建築の季節ごとの見え方を示したいとき
• 葉・日差し・空・地面を連動させたいとき