Artifacts とは
Artifacts は Claude の機能で、チャット内で「動くもの」を生成・編集できる仕組み。コード、HTML ページ、React コンポーネント、SVG 図解、長文ドキュメントなどを、その場で作って、その場で動かせます。
※ ChatGPT の Canvas、Gemini の Code 実行が類似機能。本記事は Claude Artifacts に絞る。
Artifacts の典型ユースケース
① プロトタイプ作成
「ログイン画面のサンプル HTML を」と頼むと、Claude が右ペインに動く HTML を生成。その場でクリック・編集ができる。
② 図解の自動生成
「組織構造を SVG 図にして」「フローチャート描いて」と頼むと、編集可能な SVG が生成される。
③ ミニアプリ
「家計簿アプリの簡単な見本」と頼むと、React コンポーネントが生成され、実際に動く。エンジニアでなくてもプロトタイプを試せる。




