概要
AIアシスタントをAvonni MCPサーバーに接続し、Avonni Skillsをインストールして、平易な言葉のプロンプトからExperience Siteページ上のAvonniコンポーネントを作成・更新します。
🚧 早期アクセス。 Build with AI は段階的に展開され、リリースごとに改善されています。わかりにくい点、足りない点、壊れている点はありますか？ お知らせください: あなたのフィードバックが、次に改善する内容を直接形作ります。
やりたいことを平易な言葉で伝えるだけで、AI アシスタント（Claude、Cursor、または GitHub Copilot）が、Experience Site のページに実際に動作する Avonni コンポーネントを追加します。これを可能にする 2 つのツールがあります。
🧠 Avonni MCP サーバー
アシスタントに、44種類すべての Experience Cloud コンポーネントについて、プロパティ、相互作用、スタイリングまで含めた、正確で常に最新の知識を提供するホスティング済みのドキュメントサービス。
🛠️ Avonni Skills
サイトページへの Avonni コンポーネントの追加方法と、正しく設定する方法をアシスタントに教える、ステップごとのワークフロー。
要するに、skills はエージェントに何をすべきかを伝え、MCP は何が真実かを伝えます。 片方だけを使っても結果は悪くなります。両方インストールしてください。
なぜ両方必要なのか
AI アシスタントは公開データで学習しているため、Avonni に関する知識は不完全で古くなっています。放っておくと、プロパティ名を捏造したり、相互作用の種類を推測したり、Experience Builder が拒否するページ内容を生成したりします。見た目はそれらしくても、実際には動きません。
この 2 つのツールは問題の異なる半分を解決します。
Avonni MCP
知識。 正確なコンポーネントのドキュメント、相互作用、スタイリングを Experience パッケージに加え、 Dynamic, Flow、および LWC パッケージ。
もうプロパティ名や相互作用名を捏造することはありません。アシスタントは推測ではなく、実際の設定を参照します。
Avonni Skills
プロセス。 各 Avonni アーティファクト種別の作成・更新のためのワークフローに加え、 avonni-architect、複数アーティファクトのユースケースを調整する
アシスタントは有効なページ内容を生成し、場当たり的に進めるのではなく、正しい手順に従います。
今日の高速さ、明日の保守性
AI アシスタントは、ポータル機能をカスタムコードとして高速に構築することもできます。違いはデモの後に現れます。 カスタムコードは永続的な保守責任があり、顧客向けサイトではそのリスクは公開されます。 Avonni コンポーネントはその罠を回避します。
✍️ コードではなく設定
プロンプトから、どのコンポーネントを使うか、どのデータを使うか、どの相互作用を使うかといったページ内容が生成されます。サイトのブランドはデザイン・トークンを通して反映されます。顧客の目の前で実行されるカスタム JavaScript はありません。
🛡️ 複雑さの保守は Avonni の役割
Data Table、Kanban、Calendar などはすべてマネージドパッケージ内にあり、テスト済みで、バージョン管理され、リリースごとに更新されます。パッケージを更新すれば、AI が作成したものは動き続けます。
🧩 サイトのビルダーは引き続き主導権を握る
AI が構築するのは通常の Experience Builder ページであり、チームが手動で設定しているものと同じコンポーネントを使用します。誰でも開いて理解し、発展させることができます。
アシスタントが生成するもの
この avonni-experience-components skill は、サイトページのコンテンツファイルで動作します。ページに Avonni コンポーネントを追加し、そのデータ、外観、相互作用を設定します。デプロイはまだ行われません。ファイルを確認し、通常の手順でデプロイしたあと、Experience Builder でページを開いて結果を確認し、サイトを公開します。
単一のコンポーネントから完全なユースケースまで
実際の要件は、1つのアーティファクトだけで終わることはめったにありません。 avonni-architect skill は、ビジネス成果を計画へと落とし込み、依存関係の順序に従って適切なスキルを呼び出すため、すべての要素が互いに正しく結び付けられます。
このセクションで
最終更新
役に立ちましたか？