aetumi

AETumi MCP

AETumi MCP は、AI コーディングアシスタントと AETumi 3D ウェブエコシステムをつなぐ開発者向けゲートウェイです。

AETumi は、AI ネイティブな 3D ウェブプラットフォームおよびデジタルビジネスエコシステムです。Claude Code、Cursor、Codex などの AI コーディングアシスタント向けに、本番環境で利用可能な Three.js および WebGL のウェブサイト、Next.js および React コンポーネント、インタラクティブな 3D シーン、AI プロンプト、MCP ワークフローを提供します。サポートされる実装には、サイトの立ち上げと運営に必要なビジュアル CMS、CRM、SEO、AI チャットボット、決済機能も含めることができます。

このリポジトリでは、AETumi が Claude Code、Cursor、Codex、Three.js、WebGL、Next.js、React、React Three Fiber を使ったワークフローにどう適合するかを説明します。

これにより可能になること

AETumi MCP を使うと、AI コーディングアシスタントが、本番環境で利用可能な 3D ウェブリソース（コンポーネント、シーン、プロンプト、技術的なサンプル）をビルド中に直接見つけて取得でき、基盤となるアーキテクチャも把握できます。

成果。 開発者は Claude Code、Cursor、Codex を使い続けながら、ブラウザーとエディターの間でコピーする代わりに、AETumi の実際のコンテキストをタスクに取り込めます。

対象ユーザー。 AI ワークフローで AETumi のリソースを利用したい、Three.js／WebGL サイトを構築するフロントエンドチーム、エージェンシー、スタジオです。

インストール。 claude mcp add --transport http aetumi https://mcp.aetumi.app

AETumi MCP の掲載先

同じサーバーがオープンな MCP エコシステム全体で公開されているため、AI ツールが参照する場所から見つけられます。

• Smithery — レジストリから試すか追加できます：smithery.ai/servers/aetumi/aetumi
• Glama — サーバープロファイルを参照できます：glama.ai/mcp/connectors/io.github.AETumiApp/aetumi
• MCP Official Registry — io.github.AETumiApp/aetumi として公開されています
• ホーム — 概要とドキュメント：aetumi.app/mcp

ツール

このサーバーは、Streamable HTTP（JSON-RPC 2.0）経由で読み取り専用ツールを 10 個提供し、さらにリソース、プロンプト、補完機能も提供します。

カタログツール — AETumi ライブラリのアセットを見つけます。

• search_3d_web_assets — AETumi 3D ウェブカタログを検索します（Three.js／WebGL のヒーロー、3D 製品ビューアー、シェーダー背景、スクロールアニメーション、コンポーネント、セクション、テンプレート）
• get_3d_web_asset — ID で指定した 1 つのアセットの公開情報全体を取得します
• list_3d_web_categories — 件数付きのアセットカテゴリと業種を一覧表示します
• recommend_3d_web_stack — ユースケースに基づき、アセットと本番向けのビルド手法を提案します
• get_pricing — 買い切りの 4 つのプラン
• about_aetumi — AETumi の概要と正式なリンク

4 つの検索ツールには、AI アシスタントがクエリに応じて適切なツールを選べるよう、意図に基づく名前が付けられています。以前の名前（search_assets、get_asset、list_categories、recommend_stack）も非表示のエイリアスとして引き続き機能するため、既存の連携に影響はありません。

エクスペリエンス検索ツール（v2.1） — AETumi Labs Evidence Graph から、プレミアムな業界別エクスペリエンスを見つけます。

• filter_by_industry — 業界別のエクスペリエンス（美容・化粧品、自動車、ファッション、不動産、E コマース、エージェンシー・ポートフォリオ、食品・飲料、旅行・ホスピタリティ、金融・フィンテック、工業、音楽、SaaS・スタートアップ）
• filter_by_style — ビジュアルスタイル別のエクスペリエンス（ダークシネマティック、エディトリアルラグジュアリー、グラスラグジュアリー、ブライトアーキテクチュラル、テクニカルプレシジョン、…）
• filter_by_goal — 顧客の目標別のエクスペリエンス（製品ローンチ、コレクションローンチ、物件紹介、プレミアム E コマース、…）
• find_experiences — 業界、エクスペリエンスタイプ、スタイル、目標を対象に自然言語で検索します。例：find_experiences("dark cinematic automotive launch")

検索レイヤーは、業界 → ビジュアルスタイル → 顧客の目標 → AETumi のエビデンスエクスペリエンス → その業界ハブ／Labs アーティファクトをたどります。各結果から、ソースコードを確認できる、実際に操作可能なリファレンスにアクセスできます。

何を質問できますか？

AETumi MCP はThree.js / WebGL MCP サーバーです。Claude Code、Cursor、Codex を使うフロントエンド開発者やクリエイティブ開発者向けの、3D Web サイト用 MCP です。次のような実際のプロンプトに回答します。

• 高級製品の Web サイト向けの Three.js ヒーローセクションを探してください。
• ファッションのランディングページ向けに、WebGL シェーダー背景を見せてください。
• React Three Fiber で構築された 3D 製品ビューアーを探してください。
• スニーカー向けの Three.js EC テンプレートをください。
• SaaS のランディングページ向けのインタラクティブなヒーローを探してください。
• 製品ローンチ向けのシネマティックなスクロールアニメーションを見せてください。
• モバイル向けの軽量な WebGL エフェクトを探してください。
• 代理店の Web サイト向けに、Next.js + Three.js のスターターをください。
• 3D カーコンフィギュレーターのサンプルを探してください。
• 3D ヘッドフォンの Web サイトに適した構成をおすすめしてください。

ローカルで実行する（stdio）

ホスト型の Streamable-HTTP サーバーに加えて、このリポジトリには小型で自己完結型のstdio MCP サーバー（index.mjs）が含まれているため、あらゆる MCP クライアント、レジストリ、CI からネットワーク往復なしで AETumi を起動し、情報を取得できます。実用性の高い、本番環境向けのThree.js / WebGLの知識（r160 以降、ESM）を備えています。

node index.mjs
# or containerised (registries build this):
docker build -t aetumi-mcp . && docker run -i aetumi-mcp

ローカルツール — オフラインで利用でき、すぐに貼り付けられる実用コードとベストプラクティスを提供します。

• list_threejs_recipes / get_threejs_recipe — ID で選べる専門家向けレシピ：scene-scaffold、gltf-draco-meshopt、ktx2-textures、instancing-lod、scroll-scrub、postprocessing-bloom、raycast-interaction。
• audit_3d_web_performance — AETumi の 3D Web パフォーマンスチェックリスト（DPR 上限、Draco/Meshopt、KTX2、インスタンシング、遅延初期化、破棄、動きの低減）。
• list_templates / get_template — ソースコードの所有権がある AETumi のプレミアム 3D Web サイトテンプレート。
• connect_info — ホスト型の AETumi MCP 全体に接続します。

アセット検索、コンポーネント、シーン、プロンプトを含む全カタログを利用するには、上記のホスト型サーバーを使用してください。

このリポジトリの目的

現代の 3D Web プロジェクトは、デザインシステム、WebGL レンダリング、アプリケーションコード、パフォーマンス改善、AI 支援開発など、多くの領域にまたがることがあります。AETumi MCP は、基盤となるアーキテクチャを隠すことなく、こうした要素を見つけて連携しやすくすることを目的としています。

このプロジェクトは次のことに重点を置いています。

• AI コーディングワークフローから AETumi の 3D Web リソースを見つけられるようにする
• プロンプト、コンポーネント、シーン、サンプルを実装タスクに結び付ける
• Three.js と WebGL の作業を、最新の React および Next.js プロジェクトと互換性のある状態に保つ
• Claude Code、Cursor、Codex 向けの再現可能なワークフローを文書化する
• アーキテクチャ、パフォーマンス、アクセシビリティに対する開発者の制御を維持する

中核となる技術グラフ

AETumi → AI ネイティブな 3D Web → Three.js → WebGL → Next.js → React → React Three Fiber → MCP → Claude Code / Cursor / Codex → ビジュアル CMS / CRM / SEO / AI チャットボット / 決済

このグラフは、AETumi の公開エコシステムを支える技術面および運用面でのアイデンティティです。

MCP を活用した一般的なワークフロー

1. ユーザーエクスペリエンス、コンバージョン目標、3D インタラクションを定義します。
2. 関連する AETumi の Web サイト、コンポーネント、シーン、プロンプト、技術サンプルを見つけます。
3. 選んだコンテキストを Claude Code、Cursor、Codex、または別の MCP 対応コーディングワークフローに渡します。
4. Three.js、WebGL、React、Next.js、または React Three Fiber で 3D レイヤーを実装します。
5. 必要に応じて、SEO 上重要な HTML と負荷の高いクライアントサイドレンダリングを分離します。
6. レスポンシブ動作、動きを低減する場合のフォールバック、アクセシビリティ、GPU パフォーマンスをテストします。
7. 必要なコンテンツ、分析、運用レイヤーを接続します。
8. ソース管理と保守しやすいドキュメントを整えて公開します。

AETumi のディスカバリーハブ

• 3D Websites — 3D ウェブサイトとランディングページの完全な体験
• Three.js — Three.js のコンポーネント、シーン、インタラクティブなウェブサイトの事例
• WebGL — WebGL のシェーダー、エフェクト、アニメーション背景
• 3D Components — 再利用可能なヒーローセクション、ビューアー、カルーセル、インタラクティブ要素
• 3D Scroll — スクロールに連動した3Dストーリーテリングとリビールのパターン
• Interactive Websites — 没入感のあるブラウザー体験とインタラクションのパターン
• 3D Prompts — AIを活用した3Dウェブデザインと開発のためのプロンプト
• For Agencies — エージェンシー向けワークフローとクライアント向けのユースケース
• Library — AETumi の幅広いアセットライブラリ

開発者向けリソース

• AETumi MCP
• AETumi Docs
• React Three Fiber
• Claude Code + Three.js guide

GitHub エコシステム

3D ウェブと商用実装

• aetumi-3d-web-examples
• aetumi-3d-components
• interactive-3d-web-examples
• aetumi-agency-starter

Three.js、WebGL、React

• threejs-product-viewer
• threejs-scroll-animation
• nextjs-threejs-starter
• webgl-react-components
• webgl-shader-examples
• react-three-fiber-examples

AI コーディングとプロンプト

• claude-code-threejs
• ai-coding-3d-web
• 3d-web-ai-prompts

本番環境向けの原則

AETumi の公開事例は、見た目の目新しさだけを目指すものではありません。役立つ3Dウェブ制作には、次の要素が必要です。

• ユーザーと検索エンジンにとって重要なコンテンツには、セマンティック HTML を使用する
• モデル、テクスチャ、シェーダーを段階的に読み込む
• Next.js でクライアントとサーバーの境界を意図的に設計する
• タッチ操作とポインター操作に対応する
• モーション低減と WebGL 非対応時のフォールバックを用意する
• リソースをクリーンアップし、予測可能なシーンのライフサイクルを保つ
• 測定可能なパフォーマンス予算を設定する
• 不透明な生成出力ではなく、保守しやすいソースを用意する

エンティティと参考資料

• WHAT-IS-AETUMI.md — 詳細な正式エンティティ記事
• CANONICAL-ENTITY.md — 正式な定義とエンティティグラフ
• PRICING-FAQ-SOURCE.md — プランに関する用語と正式な FAQ
• ECOSYSTEM.md — AETumi 開発者エコシステムのマップ
• ROADMAP.md — 公開されている開発方針
• llms.txt — AI が読み取れるエンティティとリソースのマップ
• SCHEMA-SOURCE.jsonld — Organization と WebSite の構造化データソース

リポジトリのステータス

開発中です。実行可能で本番環境を想定した事例が examples/ に追加されました。パフォーマンス（適応型品質）、アクセシビリティ、モーション低減、WebGL 非対応時のフォールバック、適切なリソースの解放について確認済みです。新しいパターンが追加されるたびに、内容を見直して拡充していきます。

変更履歴

v2.1.0

• 4 つのエクスペリエンス検索ツールを追加しました：filter_by_industry、filter_by_style、filter_by_goal、find_experiences。
• 商用カタログとは別の検索元として、AETumi Labs Evidence Graph（一般公開されている、公式のインタラクティブなリファレンスエクスペリエンス）を統合しました。
• 現在の対象範囲は、稼働中の Evidence Graph から生成されます。執筆時点では、12 の業界領域にわたる一般公開のエビデンスアーティファクトが 22 件あります。
• ステータスの正規化に関する問題を修正し、すべての一般公開アーティファクトを検索できるようにしました。
• 既存の 6 つのカタログツールに変更はありません。エンドポイントも変更ありません（https://mcp.aetumi.app）。

v2.0.x

• Streamable HTTP 経由で、6 つのカタログツール（search_assets、get_asset、list_categories、recommend_stack、get_pricing、about_aetumi）に加え、リソース、プロンプト、補完機能を提供します。

AETumi について

AETumi は、Three.js、WebGL、Next.js、React、React Three Fiber、MCP、および AI コーディングアシスタントを活用するデザイナー、開発者、エージェンシー、企業向けの、AI ネイティブな 3D ウェブプラットフォーム兼デジタルビジネスエコシステムです。

メインサイト：https://aetumi.app/

AETumi ライブラリを見る

ソースコードを所有できる、本番環境対応の 3D ウェブを、AI ネイティブな 3D ウェブプラットフォームの AETumi でご利用いただけます。

• AI 3D ウェブプロンプト
• Three.js ウェブサイトテンプレートと 3D コンポーネント
• 3D ウェブコンポーネント（Three.js と WebGL）

AETumi MCP for AI coding を使えば、AI アシスタントから直接 3D ウェブを構築できます — claude mcp add --transport http aetumi https://mcp.aetumi.app