Claude Codeのartifactsで成果をリアルタイム共有

ターミナルで動くAIコーディングの成果が、その場で共有できるWebページになる。

Anthropicは2026年6月18日、Claude Code向けの新機能「artifacts」をベータ公開しました。セッション中のコード解析や調査結果を、組織内限定のインタラクティブなWebページとして公開し、作業が進むたびに同一URLで自動更新できます。ステータス会議や長文の説明に頼らず、チームで進捗を追える点が大きな変化です。

この記事でわかること

• artifactsが解決する課題と、従来のClaudeチャット版との違い
• 作成手順と、デバッグ・PRレビューなどの活用例
• Team・Enterprise向けの利用条件と制限事項

https://code.claude.com/docs/en/artifacts

artifactsとは何が変わったか

artifactsは、Claude Codeのセッション成果をclaude.ai上の非公開URLに公開する機能です。ページはブラウザで開き、セッションが続く間はその場で更新されます。Anthropicの説明では、PRウォークスルー、システム解説、ダッシュボード、リリースチェックリストなどを「ライブで共有可能なビジュアルページ」に変換できるとされています（公式ドキュメント）。

ClaudeのWebチャット向けartifactsは2024年夏に登場し、コードスニペットや簡易アプリの公開に使われてきました。今回のClaude Code版は、ターミナルやデスクトップアプリで動くエージェントの作業を、そのままチーム共有のページに変換する点が新しいです。エンジニアが調査中に見ている内容を、関係者が同じ画面で追えるようになります。

なぜ必要になったか

Claude Codeは2025年5月に一般提供され、エンジニアリング現場での利用が広がっています。一方、エージェントの作業結果はターミナル内に留まり、チームへの共有はスクリーンショットや口頭説明に頼る場面が多くありました。SD Timesの報道でも、インシデント調査やサービスリファクタリング、長期データ分析のようなセッションでは、完了を待つか、途中経過を別途まとめる必要があったと指摘されています（参考）。

artifactsは、この「共有の手間」を減らすための機能です。データソースの接続やインフラ構築を別途行わず、セッションがすでに持つ文脈からページを組み立てます。

セッション文脈をそのままページ化する仕組み

Claude Codeは、会話履歴、接続ツール、対象コードベースの情報をまとめて参照できます。artifactsはこの文脈を使い、1枚のHTMLページを生成します。

たとえばインシデント調査では、失敗しているテストと該当関数、モニタリングツールから取得したエラー急増、セッション内の原因分析を1ページにまとめられます。エンジニアがログを追うたびにページが再公開され、共有リンクを開いているメンバーは更新をリアルタイムで確認できます。公開のたびにバージョンが記録され、過去版への復元も可能です。

新規作成時はClaude Codeが許可を求め、承認後にURLが表示されます。ターミナルからは Ctrl+] で直近のartifactを再表示できます。自動でブラウザを開きたくない場合は、環境変数 CLAUDE_CODE_ARTIFACT_AUTO_OPEN=0 で無効化できます。

使い方とプロンプト例

セッション中に「artifactを作って」と依頼するか、視覚的な出力を求めれば作成できます。公式ドキュメントでは、次のような依頼が例示されています。

• PRレビュー用：「このPRをdiffに注釈を付けてウォークスルーするartifactを作って」
• ダッシュボード：「先週のデプロイ失敗をサービス別にまとめたダッシュボードartifactを作り、調査中も更新して」
• インシデント対応：「タイムライン、疑わしいコミット、エラー率チャートを含むインシデントページを作り、進捗に合わせて再公開して」

スライダーやトグルで値を調整できるページ、複数案を並べて比較するページ、チェックリスト形式で作業進捗を追うページなども作成できます。プロジェクトの CLAUDE.md にカラーやフォントなどのデザインシステムを書いておくと、生成ページの見た目をブランドに合わせやすくなります。

共有はページヘッダーのShare操作から行います。初期状態では作成者だけが閲覧でき、組織内の特定メンバーまたは全員に公開できます。組織外への公開設定はありません。

チャット版artifactsとの違いと制限

公式ドキュメントは、artifactを「作業の記録であり、アプリケーションではない」と明記しています。バックエンドを持たない静的ページのため、フォーム入力の保存、閲覧時の外部API呼び出し、複数ルートの提供はできません。本番運用向けの社内ツールが必要な場合は、自社インフラへのデプロイが前提です。

セキュリティ面では、厳格なContent Security Policy（CSP）が適用されます。外部ホストからのスクリプト、スタイルシート、フォント、画像の読み込みや、fetch・XHR・WebSocketはブロックされます。CSSとJavaScriptはインライン化され、画像はdata URIで埋め込む形が基本です。レンダリング後のページサイズは16MiB以下に制限されています。

利用条件と管理者向け設定

artifactsはベータ段階で、Claude TeamおよびEnterpriseプラン向けに提供されます。Free・Proプランでは利用できません。

CMEK（顧客管理暗号化キー）、HIPAA、Zero Data Retentionが有効な組織では利用できません。Agent SDK、GitHub Action、MCPサーバー経由のセッションではデフォルトで無効です。

管理者はclaude.aiの管理画面から組織全体の有効・無効を切り替え、保持期間やロール単位のアクセス制御を設定できます。公開・共有・削除は監査ログに claude_artifact_* イベントとして記録されます。

チーム開発の共有フローが変わる

Claude Codeのartifactsは、AIエージェントの作業を「見える化」して組織内で共有する機能です。デバッグやPRレビュー、インシデント対応など、進行中の作業をそのままページに残せる点が実務での価値になります。Team・Enterprise向けという制約はありますが、エンジニアリングチームの情報共有コストを下げる実用的なアップデートと言えます。