「長文テキストやコードが流れて邪魔」「直接編集したい」…不満を一発で消すClaudeの正解
コードやHTML、Markdownなどの成果物を独立表示！Claudeの「アーティファクト」機能の利点と設定手順をご紹介します。専用画面でのプレビューやリアルタイム編集で作業効率を爆速化させましょう。
イチオシスト
※記事内で紹介した商品を購入すると、売上の一部が当サイトに還元されることがあります。
え、指示するだけでWebサイトが右画面に立ち上がるの!?Claudeの「アーティファクト」の凄さ（※画像出典：Anthropic）
チャット中にAIが長いテキストや複雑なプログラムを書き出すと、会話が流れてしまって見づらいですよね。そんな不満を解消するのが、Claudeの「アーティファクト（Artifacts）」機能です。コードやドキュメント、Webアプリなどの成果物を、チャットとは別の専用ウィンドウ（サイドパネル）にスッキリと並べて表示。その場での編集や確認、ダウンロードなどの一連の操作を格段に快適にします。
生成された成果物をチャット画面と分離して閲覧・編集できる「Artifacts」
プログラミングコードのコピーや、生成されたHTML・Markdown資料を直接プレビュー確認しながら微調整したい場合に「アーティファクト」機能が最適です。概ね15行以上の重要で自己完結したコンテンツ（コード、SVGイラスト、Webサイトのプロトタイプ、文書など）が生成された場合、チャットの流れを邪魔することなく画面右側に専用ウィンドウが自動展開されます。これにより、会話を継続しながらコードの閲覧や実行プレビュー、ファイルのダウンロードをスムーズに行えます。
設定画面からの機能有効化や画面上での編集を行う「設定と呼び出し手順」
利用するには、画面左下のメニューから「設定」＞「機能」を開き、「コード実行とファイル作成」等の関連設定を有効化しておきます。準備が完了した状態でチャット欄に「〇〇のWebサイトを作成して」などと指示すると、右側にアーティファクトウィンドウが起動します。ウィンドウ内のテキストやコードの一部を直接選択して修正指示を出したり、コードをリアルタイムで再生成させたりすることも可能です。
アイデアを言葉にするだけで、目の前に動きのあるアプリや美しいドキュメントを即座に形作ってくれます。
※アーティファクトの生成やプレビュー表示には対応する機能設定が有効になっている必要があります。動作環境や対応フォーマット、利用制限の詳細はAnthropic公式ヘルプをご確認ください。
＜出典＞
アーティファクトとは何か、どのように使用するのか？ | Anthropicヘルプセンター
)
※記事内における情報は原稿執筆時のものです。サービスのアップデートに伴い、画面デザインや機能仕様が一部異なる場合があります。
※記事内容は執筆時点のものです。最新の内容をご確認ください。