ai-tech-knowledge

Blender MCPを使った3Dモデリングの段階的ワークフロー（プリミティブ→ブロック→サブディビジョン→スカルプト→リトポロジー）と、AI経由のBlender操作の判断軸。3Dモデリング、シーン構築、スカルプティング、リトポロジー、メッシュ編集、Modifier設計、Blender MCPの操作に関する相談で必ず使うこと。ユーザーが「3Dオブジェクト作って」「キャラクターをモデリング」「Blenderで」と言った場合にも適用する。

p5.js（クリエイティブコーディング）のProcessing由来「コードでスケッチ」思想を軸に、setup/drawループ・座標系・インタラクション・パフォーマンス最適化を整理する。p5.js、Processing、クリエイティブコーディング、ジェネラティブアート、インタラクティブ表現、ビジュアルプログラミング、Canvas描画、パーティクル、フラクタル、ノイズ表現に関する相談で必ず使うこと。ユーザーが「コードでアート」「動くビジュアル」「インタラクティブな描画」と言った場合にも適用する。

Three.js（WebGL/3D表現）のScene-Camera-Renderer三位一体と手動メモリ管理を軸に、ウェブ3Dの設計・実装・パフォーマンス最適化を整理する。Three.js、WebGL、React Three Fiber（R3F）、3Dシーン構築、メッシュ/マテリアル/テクスチャ、メモリリーク、dispose()、インスタンシング、シェーダー、GLTFローダーに関する相談で必ず使うこと。ユーザーが「ブラウザで3D」「WebGLで表示」「3Dモデルをウェブに載せたい」「パーティクルエフェクト」と言った場合にも適用する。

Astroプロジェクトの設計・実装・レビューを、HTML中心/Islands Architecture/クライアントJS最小化の思想で整理する。Astro、Islands Architecture、SSG/SSR選択、コンテンツサイト構築、パフォーマンス最適化、JS削減、マルチフレームワーク統合、.astroファイルに関する相談で必ず使うこと。ユーザーが「静的サイト」「ブログ」「ドキュメントサイト」「ランディングページ」と言った場合も、Astroが技術スタックに含まれていれば適用する。

GSAP（GreenSock Animation Platform）のTween/Timeline/ScrollTrigger/Easingを軸に、ウェブアニメーションの設計・実装・パフォーマンス最適化を整理する。GSAP、GreenSock、ScrollTrigger、ウェブアニメーション、スクロール連動アニメーション、タイムライン制御、イージング設計、gsap.to/fromに関する相談で必ず使うこと。ユーザーが「スクロールで要素をフェードイン」「ページ遷移アニメーション」「シーケンシャルなアニメーション」と言った場合、GSAPが技術スタックに含まれていれば適用する。

Playwright E2Eテストフレームワークの判断軸。ユーザー視点のロケーター選択・自動待機・テスト分離・CI最適化を公式ベストプラクティスに沿って整理する。Playwright、E2Eテスト、ブラウザテスト、インテグレーションテスト、getByRole、ロケーター設計、テストの安定性、CI上のテスト失敗に関する相談で必ず使うこと。ユーザーが「テストが不安定」「CIでだけ落ちる」「ブラウザテストを書きたい」「ログインフローをテスト」と言った場合、Playwrightが技術スタックに含まれていれば適用する。

React/Next.jsプロジェクトで、UI=計算モデル（コンポーネント/状態/レンダリング）を軸に、設計・実装・レビュー・性能改善の判断を整理する。React、Next.js、JSX、コンポーネント設計、useState/useEffect、状態管理、Server Components、SSR/SSG/Streaming、App Router、バンドル最適化、再レンダリング問題に関する相談で必ず使うこと。ユーザーが「コンポーネントの分割」「stateの置き場所」「パフォーマンスが遅い」「RSCの使い分け」と言った場合にも適用する。

Svelte/SvelteKitプロジェクトにおいて、UI=状態の直接的な反映という思想を軸に、コンパイル時最適化・状態管理・レンダリング・配信量の設計を整理する。Svelte、SvelteKit、.svelteファイル、リアクティビティ、$state/$derived、コンパイラ最適化、軽量UI、store設計、配信量削減に関する相談で必ず使うこと。ユーザーが「Svelteでアプリを作りたい」「ランタイムを減らしたい」「仮想DOMなしのフレームワーク」と言った場合にも適用する。

Tailwind CSSをutility-first（早すぎる抽象化を避ける）思想で運用し、UI実装の認知負荷を下げながら一貫性と保守性を保つための設計・レビュー・リファクタ判断を整理する。Tailwind CSS、utility-first、CSS設計、クラス肥大化、デザイントークン、コンポーネント化の境界、レスポンシブ設計、ダークモード、tailwind.config、@applyの使い方に関する相談で必ず使うこと。ユーザーが「クラスが長すぎる」「CSS設計を統一したい」「デザインシステムを作りたい」と言った場合、Tailwindが技術スタックに含まれていれば適用する。