Artifacts / Canvas

ざっくり言うと

呼び名はサービスごとに違いますが(Claude = Artifacts、ChatGPT = Canvas、Gemini = Canvas)、「AI の出力を別ウィンドウで開いて、一緒に編集する」というコンセプトはほぼ同じです。

イメージ

正確には

Claude の Artifacts(Anthropic)

Anthropic のヘルプセンターによると、Artifacts は Claude が生成したコード・ドキュメント・その他のコンテンツを表示・操作するための専用ウィンドウとして説明されています。会話の横に独立したペインで開き、文書・コード・図・Webページ(HTML)・SVG などを扱える、と整理されています。

Anthropic は Artifacts を、Claude の出力を「単なる会話」から「ユーザーと一緒に作り上げる作業スペース」へ拡張する位置づけの機能、として紹介しています。

ChatGPT の Canvas(OpenAI)

OpenAI の発表「Introducing canvas」では、Canvas は 「文章とコードを書くための新しいインターフェース」 と紹介されています。チャットの横に開く別ウィンドウで、AI とユーザーが同じドキュメントを一緒に編集できる、という設計です。

文章では「長さ調整・読みやすさレベルの変更・推敲・絵文字追加」など、コードでは「コードレビュー・ログ追加・コメント挿入・他言語への変換」といったショートカット操作が用意されている、と公式に明記されています。

Gemini の Canvas(Google)

Google の Gemini ヘルプによると、Canvas は Gemini と一緒にドキュメントやコードをリアルタイムで作成・編集するためのインタラクティブなスペースとして説明されています。文書のドラフトや、HTML・React などのコードをプレビュー付きで作ることを想定した設計です。

3者に共通する特徴

機能	中身
別ペイン表示	チャットとは別ウィンドウに「文書 / コード / プレビュー」を切り出す
部分編集	「ここだけ直して」がチャット指示でできる(全文再生成しない)
バージョン管理	過去の版に戻せる(各社で実装は異なる)
プレビュー	HTML / React / マークダウン などをその場で見た目確認できる

どんなときに使う?

逆に、短い質問への即答(「東京の人口は?」など)や、チャット内で完結する雑談には不向きです。編集ペインを開くほどの作業物がないと、機能を持て余します。

注意点

やってみよう

似た周辺機能として、コードを実際にサーバーで動かす Code Interpreter や、複数ステップを自動でこなす AI エージェント もあります。Artifacts / Canvas は「人間と AI が一緒に1つの作業物を磨く」役割なので、これらと使い分けるとさらに便利になります。