# 作成モード
サイトをどう変えたいかを、一文で伝えるだけです。たとえば「自分のメッセージの幅を狭くして」のように書きます。そのサイトの AI が変更を作り、Voyager が中身を確かめてからインストールします。コードの知識はいりません。いまのページから離れる必要もありません。Gemini、AI Studio、ChatGPT、Claude、DeepSeek、Kimi で使えます。
できあがったものを「作品」と呼びます。作品は小さなプラグインで、このブラウザの中にだけ保存されます。いつでもオフにしたり、削除したりできます。
作成モードの入口は 2 つあります。1 つは、ページ上の [Voyager パネル](./panel.md)にある **作成** タブです。もう 1 つは、Voyager ポップアップの **マイ作品** カードです。ポップアップとは、ブラウザのツールバーにある Voyager のアイコンを押すと開く小さな画面のことです。
## ページ上で作成する
いちばん手早いのは、変えたい AI サイトの上で作る方法です。そのサイトで Voyager パネルを開き、**作成** を選びます。
**何を変えますか？** の欄に一文を書きます。たとえば「自分のメッセージの幅を狭くして、サイドバーを隠す」です。書けたら **このページで作成** を選びます。
Voyager がそのサイトで新しいチャットを開き、依頼を入力欄に入れます。内容を読んでから、ご自身で送信してください。Voyager が代わりに送信することはありません。入力欄にすでに文字があるときは、Voyager はそれに触れません。先に送信するか消すよう、お知らせします。
AI が返信すると、その下に Voyager のボタン **確認してインストール** が出ます。
そのボタンを選ぶと、パネルに一覧が出ます。作品が何を変えるのか、どのサイトで動くのか、そして **確認しておくこと** の内容です。納得したら **インストールしてオン** を選びます。変更はすぐに表れます。いらなくなったら、パネルの **機能** タブでオフにします。
もう一度変えたいときは、同じチャットで AI に続けて伝えます。
- **新しいバージョン**: AI の新しい返信の下に **更新を確認** が出ます。中身を確かめてから **更新してオン** を選びます。古い返信には **以前の版** と表示されます。
- **インストール済み**: インストールした返信には **インストール済み** と表示されます。
- **このチャットだけ**: ボタンが出るのは、**このページで作成** で始めたチャットだけです。ほかのチャットでは、下の「ポップアップから作成する」の方法を使ってください。
## AI にページの作りを見せる
**作成** タブにはスイッチが 1 つあります。**このページの構造をテキストなしで添えて、AI が実際のページに合わせて書けるようにする** です。最初からオンになっています。
- **添えるもの**: ページの作りです。どんなボタンや入力欄、メッセージの欄があって、どこに並んでいるか、ということです。これがあれば、AI は当て推量で作らずにすみます。
- **添えないもの**: ページ上の文字は一切添えません。チャットの内容も添えません。ページのアドレスや、アカウントの情報も添えません。
- **自分で確かめる**: **添える内容を見る** を選ぶと、AI に送られる内容をすべて見られます。
- **添えたくないとき**: スイッチをオフにします。依頼に入るのは、あなたの一文だけになります。
## Gemini でのモデルの通知
Gemini では、いくつかのモデルから選べます。Flash と Flash-Lite は軽いモデルで、たいていうまく動く作品を作れません。新しいチャットでそのどちらかが使われそうなときは、**作成** タブの上部でお知らせします。
- **どうすればいいか**: 通知に、もっと向いているモデルの名前が出ます。Gemini のモデルメニューでそのモデルに切り替えてから、**もう一度確認** を選びます。
- **別の方法**: 通知の中の **ローカルエージェント用にコピー** を選ぶと、パソコンにあるコーディング用のアシスタントに作業を任せられます。[自分でプラグインを作る](./write-a-plugin.md)を見てください。
- **作成は止まらない**: これはお知らせにすぎません。**このページで作成** はそのまま使えます。
## インストールできないとき
AI は、いつも一度でうまく作れるとは限りません。うまくいかなかったときは、返信の下に理由が一行で出ます。たとえば「どのサイトで使うかが書かれていません」です。
- **直してもらう**: 返信の下の **AI に修正を頼む** を選びます。Voyager が問題点を入力欄に書き込むので、あなたが送信します。
- **直ったら**: AI が直した版を送ると、その下にまた **確認してインストール** が出ます。
- **その間は何も変わらない**: インストールしていない作品が、ページを変えることはありません。
## インストールしたあと
インストールしたものは、すべて **マイ作品** にあります。
- **パネルでは**: **機能** タブの中の **マイ作品** のグループです。作品ごとに 1 行あり、それぞれにスイッチがあります。
- **ポップアップでは**: Gemini と AI Studio ではカードの 1 つです。並べ替えていなければ、**クラウド同期** のすぐ下にあります。ポップアップ上部の **移動先** から、そこへ飛べます。ほかのサイトでは、プラグイン一覧の下にあります。
- **削除**: その行のゴミ箱アイコンを選び、確認します。元には戻せません。
- **別のブラウザで使う**: ポップアップの **マイ作品** で、その作品の **エクスポート** を選ぶと、ファイルが 1 つできます。そのファイルを、別のブラウザでインポートします。
- **みんなと共有する**: ほかの人の役にも立ちそうなら、Voyager に入れてもらうよう提案できます。やり方は[プラグイン貢献ガイド](./plugin-contribution.md)にあります。
### 自動チェック
パネルを開くたびに、Voyager は作品がいまのページで何かしているかを確かめます。
- **ここでは効いていない**: 作品がオンなのに、このページで変えるところが見つからない場合です。その行に **オンですが、このページに当てはまる要素がありません** と出ます。サイトのデザインが変わったあとによく起こります。
- **ページが固まった**: コードを実行する作品のせいで、ページが固まった場合です。Voyager はもうその作品をオフにしていて、行に理由が出ます。
- **直してもらう**: どちらの場合も **修正を頼む** が出ます。選ぶと、Voyager が新しいチャットを開き、問題を書き込みます。内容を読んで送信できるよう、パネルは閉じます。
## Voyager の配色を変える
作品で、Voyager 自身の色を変えることもできます。そう伝えるだけです。たとえば「Voyager を Nord の配色にして」と頼みます。
- **変わるもの**: Voyager のパネル、メニュー、ダイアログ、画面に出る小さなお知らせ、タイムラインの色です。ライトモードでもダークモードでも変わります。
- **変わらないもの**: サイト自身の色と、Voyager がサイトのページに直接書く文字です。こうして、文字がサイトの背景にまぎれて読めなくなるのを防いでいます。Voyager ポップアップの色も変わりません。
- **元に戻す**: その作品をオフにすると、色が元に戻ります。
## ポップアップから作成する
新しいチャットを開きたくないときは、ポップアップの **マイ作品** から始めます。別のチャットや別の AI に作ってもらいたいときも同じです。プラグイン一覧のいちばん下にある **自分で作る** を押すと、そこへ移動します。
**何を変えますか？** の欄に一文を書きます。その下の **サイト** には、いま開いているサイトが最初から入っています。別のサイト向けに作るなら、切り替えてください。
**このチャット用にコピー** を選びます。コピーされた文章を、そのサイトの AI チャットに貼り付けて送信します。
AI が返信したら、返信を丸ごとコピーします。それを **AI の回答を貼り付け** に貼り付けて、**回答をチェック** を選びます。
作品が何を変えるのかを、Voyager がわかりやすい言葉で伝えます。**インポート** を選んだら、プラグイン一覧でオンにしてください。この方法で追加した作品は、最初はオフになっています。
この方法では、Voyager が自分から何かを送ることはありません。文章を貼り付けるのも、返信を持ち帰るのも、あなた自身です。
## コードを実行する作品
ほとんどの作品は、見た目を変えるだけです。でも、それだけでは足りない依頼もあります。たとえば、メッセージの数を数える、クリックしたときに何かをする、といった依頼です。そうした依頼には、AI がコードを実行する作品を作ります。確認画面では、**コードを実行** の印が付きます。
### オンにする
- **まず中身を見る**: 確認画面には、作品が動くサイトと、コードの全部が出ます。この作品は、そのページ上のものをすべて見られます。チャットの内容も見られます。見たものをよそへ送ることを、Voyager は止められません。信頼できるものだけをオンにしてください。
- **インストールしてオン**: オンになるのは、いま見たその版だけです。あとで AI が新しい版を作っても、もう一度見るまではオフのままです。このスイッチは、このデバイスにだけ効きます。
- **最初に一度だけのブラウザ設定**: こうした作品を動かすには、ブラウザで Voyager に許可を出す必要があります。**Voyager の詳細ページを開く** を選びます。そこで **ユーザー スクリプトを許可**（Allow User Scripts）をオンにします。戻ってきたら **オンにしました** を選びます。
- **使えるブラウザ**: パソコンの Chrome か Edge で、バージョン 133 以降です。Safari、Firefox、スマートフォンでは、インストールされたまま一時停止します。見た目だけを変える版を、AI に頼むこともできます。
### 自分で管理する
**マイ作品** では、コードを実行する作品ごとに状態が出ます。**オン（このデバイスのみ）**、**オフ**、**一時停止中** のどれかです。一時停止中のときは、理由も出ます。
- **すべて止める**: **マイ作品** のいちばん下にある **コードを実行する作品をすべて停止** を選びます。また動かすときは **再開** を選びます。
- **すでに開いているページ**: ページを再読み込みするまで、作品は動き続けます。**このページを再読み込み** を選ぶと、いまのページを再読み込みします。
- **ページが固まったとき**: こうした作品のせいでページが固まると、Voyager がそれらをオフにします。次にページを開いたとき、どの作品だったかをお知らせします。
## できること、できないこと
- **できること**: ページの見た目を変えること。たとえば幅、文字の大きさ、色です。いらない部分を隠すこと。設定にスイッチやスライダーを足すこと。Voyager の色を変えること。一部のサイトでは、Voyager に元からある機能をオンにすることもできます。たとえば数式コピーやタイムラインです。
- **コードが必要なこと**: クリックで何かをする、数を数える、ページの内容を読む、といったことです。上の「コードを実行する作品」を見てください。
- **どの作品にもできないこと**: ほかのサイトで動くことと、Voyager 自身の設定を変えることです。こうした依頼には、AI がそう伝えます。そのうえで、できるかぎり近いものを作ります。
## 詳しいしくみ
ここからは、裏側のしくみを知りたい人向けです。使うだけなら、読み飛ばしてかまいません。
- **作品の正体**: ローカルプラグインです。プラグインのマニフェストとスタイル（CSS）でできています。手で書く方法、ルール、配色を変えるためのカラー変数は、[自分でプラグインを作る](./write-a-plugin.md)にあります。
- **AI が読むもの**: 依頼には、そのサイト用の Voyager の説明ページへのリンクが入っています（例：`https://voyager.nagi.fun/create/claude.md`）。AI は JSON のコードブロック 1 つで返信します。Voyager がボタンを出すのは、メッセージにこのリンクがあるチャットだけです。そのため、ポップアップから作るときは、AI がリンクを開ける必要があります。
- **ページ構造**: Voyager が認識できるページ要素とその数、そして最新の返信と自分の最新メッセージのまわりの要素ツリーです。テキストと URL は含みません。ID、メールアドレス、長い数字のように見える属性値も取り除きます。
- **モデルの通知**: Voyager は、新しいチャットで使われるモデルを読み取ります。[デフォルトモデル](./default-model.md)がオンなら、そのデフォルトをもとに判断します。パネルに戻ってきたときにも、もう一度確かめます。
- **自動チェック**: Voyager が見るのは、作品のスタイルとページの変更が、いまのページで対象を見つけるかどうかだけです。ホバーやフォーカスの状態と、組み込み機能を呼ぶだけの作品は数に入りません。
- **コードの実行**: Chrome のユーザー スクリプトを通して、作品が指定したサイトでだけ実行します。Chrome 138 より前は、そのスイッチは `chrome://extensions` 上部の **デベロッパー モード** です。