---
url: "/ja/weblify/ai-agents.md"
description: "Weblify用のHypermatic Agent Skillをインストールして、Codex、Claude Code、Grokなどの対応エージェントに正しいWebサイトのワークフローを教えます。"
---

# AIエージェントでWeblifyを使う

> Weblify用のHypermatic Agent Skillをインストールして、Codex、Claude Code、Grokなどの対応エージェントに正しいWebサイトのワークフローを教えます。

Hypermatic Agent Skillsは、AIエージェントにWeblifyの簡潔な手順書を提供します。Weblifyのスキルは、サイト全体のエクスポート、選択レイヤーのコードのインスペクト、Webサイトのインポート、ローカルでの編集、デプロイを区別し、エージェントがそれぞれの結果を正確に報告できるようにします。

- [Hypermatic Agent Skillsをインストール](https://hypermatic.ai/): ターミナル用のインストーラーか、ターミナル不要のプロンプトをコピーします。1回のインストールで、Hypermaticの12個のプラグインのスキルがすべて入ります。

## Weblifyのスキルをインストールする {#install-the-weblify-skill}

1. [Hypermatic Agent Skills](https://hypermatic.ai/)を開きます。
2. ターミナル用のコマンドをコピーするか、ターミナル不要のプロンプトをコピーしてエージェントに貼り付けます。
3. インストール済みのスキルに`hypermatic-weblify`が表示されていることを確認します。
4. タスクにWeblifyのスキルを使うよう、エージェントに依頼します。

## スキルでできること {#what-the-skill-can-help-with}

- 完全な静的HTML・CSSのWebサイトを作成、プレビュー、監査、エクスポートする。
- 選択したFigmaレイヤーを、HTML、Tailwind、React、Vueのコードとしてインスペクトする。
- 公開サイトやログインが必要なサイトのコンテンツを、安全にFigmaにインポートする。
- 生成したコード、ローカルのブラウザでの確認、実際のデプロイを区別する。

## Quick Actions {#quick-actions}

サポートされている繰り返しのタスクは、プラグインのパネルを表示せずに[WeblifyのQuick Actions](/ja/weblify/automation/parameters)で実行できます。リファレンスには、プレーンなフィールドの例、選択に関する要件、機械可読なレジストリが含まれています。インストール済みのプラグインのQuick Actionsの一覧から、サポートされているアクションを選んでください。結果は、通常の通知、ドキュメントの変更、保存されたファイルとして返されます。

## プロンプトの例 {#example-prompts}

- `Use the Weblify skill to audit and export this responsive Figma page.`
- `Use the Weblify skill to inspect this component as React code.`
- `Use the Weblify skill to validate the exported static website locally.`

## 承認と確認 {#approval-and-verification}

エージェントはワークフローを案内できるほか、依頼した変更を承認すれば、利用可能なFigma、ブラウザ、ファイルシステム、コンピューター操作のツールを使って作業することもできます。クリップボードからのインポート、メタデータの修復、リポジトリの編集、デプロイは、それぞれ別の操作です。生成されたZIPやローカルのプレビューは、Webサイトがデプロイされた証拠にはなりません。

## トライアルの上限 {#trial-limits}

Weblifyがトライアル回数を使い切ったと表示した場合、エージェントは再試行をやめ、[Weblifyの料金と購入オプション](https://www.hypermatic.com/weblify/#pro)を案内する必要があります。決済とライセンスの有効化はご自身で行い、Weblifyが有効になったらエージェントに伝えてください。

## スキルを最新に保つ {#keep-the-skill-current}

[Hypermatic Agent Skills](https://hypermatic.ai/)に戻り、**Update**コマンドを使って、Weblifyの最新の安定版の手順をインストールします。