Claudeのアーティファクト入門 〜暮らしを助ける小さな道具を作ってみよう〜

はじめに

「自分にちょうどいい、シンプルな自己管理アプリがあったらいいのに」——そう思ったことはありませんか。続けたい習慣をチェックするだけのトラッカー、自分の支出項目に合わせた家計メモ、読んだ本を記録するリスト。市販のアプリは多機能すぎたり、逆に欲しい項目が足りなかったりで、なかなか“ちょうどいい一品”には出会えないものです。

そんな“自分好みの小さな道具”を、プログラミングなしで作れてしまうのがClaudeの「アーティファクト（Artifacts）」です。Claudeが作ったものを会話の隣の専用パネルに表示し、その場で見て・触って・共有できる機能で、ちょっとしたアイデアを「日常生活を助ける小さな道具」に変えるのが得意です。

• そもそもアーティファクトとは何か
• Anthropicがなぜこの機能を作ったのか（思想）
• できること・できないこと（2026年時点の最新仕様）
• 日常生活で役立つ作例

1. そもそもアーティファクトって何？

1.1 一言でいうと

アーティファクト（Artifacts）は、Claudeが作ったものを、会話の隣の専用パネルに表示して、その場で見て・触って・編集できる機能です¹。

文章・コード・Webページ・図・小さなアプリなどを、チャットの流れに埋もれさせず、独立した「作業スペース」として扱えるのがポイントです。

1.2 身近な比喩で

イメージとしては、チャット相手が目の前で小さな道具をこしらえてくれる「作業台」のようなものです。

• ふつうのチャットは、口頭で相談しているだけの状態
• アーティファクトは、相談しながら隣の作業台で実物を組み立て、その場で動かして見せてくれる状態

「おしゃべり」が「ものづくり」に変わる、と考えると分かりやすいです。

1.3 どんなものが作れる？

作れるものは多岐にわたります。代表的なものは次の通りです¹。

1.4 いつからある機能？

意外と歴史は浅く、2024年に登場してから猛烈な勢いで進化してきました。主な歩みは以下の通りです。

2. なぜAnthropicはこれを作ったの？（思想）

機能の「何ができるか」だけでなく「なぜ作ったのか」を知ると、使いどころの勘が働くようになります。

一言でいえば、Anthropicの狙いは「Claudeを“会話するだけのAI”から“一緒に作って、誰とでも共有できる相棒”へ広げること」です。鍵になるのは「作る」「協働」「共有」の3つで、以降の節はその具体的な現れと考えると読みやすくなります。

2.1 「おしゃべり相手」から「一緒に作業する場所」へ

Anthropicはアーティファクトを、Claudeが会話型AIから協働作業環境（collaborative work environment）へ進化する一歩だと説明しています³。

ただ質問に答えるだけでなく、ユーザーと並んで成果物を作り、磨いていく相棒になる、という方向性です。

2.2 「オンデマンドのチームメイト」構想

Anthropicは公式ブログで、将来的にはチームや組織が知識・ドキュメント・進行中の作業を1つの共有スペースに集約し、Claudeがいつでも呼べるチームメイトとして加わる未来を描いています³。

アーティファクトは、その「共有できる成果物」の最初の一歩という位置づけです。

2.3 「コードのシェアボタン」

独立系開発者のSimon Willison氏は、公開機能が加わったアーティファクトを「コードのシェアボタン」と表現しました⁴。作ったものをリンク1つで誰にでも渡せる手軽さが、この機能の本質を言い当てています。

2.4 単なる出力から「ミニアプリの工房」へ

登場時は「コードを綺麗に表示する側パネル」でしたが、約1年半をかけてミニアプリのプラットフォームへと育ちました³。

その証拠に、登場から2025年中頃までで、ユーザーが作ったアーティファクトは5億個を超えています⁵。

3. アーティファクトでできること

ここからが本題です。今のアーティファクトでできることを6つに分けて整理します。

3.1 いろいろなものを「実物」で作れる

1.3で挙げたとおり、文章・コード・Webページ・React製アプリ・図・SVG・ダウンロード資料まで作れます。しかも、その場でレンダリングされて動くので、完成形をすぐ確認できます¹。

3.2 その場で編集・やり直せる（バージョン履歴）

会話で「ここをこう直して」と言えば、アーティファクトが更新されます。さらに版が自動的に保存され、バージョンセレクターで過去の版に戻せます¹。エラーが出ても「Try fixing with Claude」ボタンで修正を試せます（ただし必ず直る保証はありません）。

3.3 リンク1つで共有・公開できる

公開ボタンを押すと共有用リンクが発行されます。受け取った人はClaudeアカウントを持っていなくても閲覧でき、アカウントがあれば remix（自分用のコピーを作って編集）できます⁶。

3.4 AIを埋め込んだアプリを作れる

アーティファクトの中に、Claude自身の頭脳を組み込めます。アプリの中からClaudeに問い合わせて、その答えを使う——AI入りのアプリをノーコードで作れる、という機能です³⁷。

呼び出し方は登場時から変わってきました。整理すると次の通りです。

現在のコードは、おおまかに次のような形です。

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11

const res = await fetch("https://api.anthropic.com/v1/messages", {
  method: "POST",
  headers: { "Content-Type": "application/json" },
  body: JSON.stringify({
    model: "claude-...", // その時点の最新モデルを指定
    max_tokens: 1000,
    messages: [{ role: "user", content: "今日の献立を3つ提案して" }],
    // 必要なら Web検索ツールやMCPサーバーも渡せる
    // tools: [{ type: "web_search_20250305", name: "web_search" }],
  }),
});

どちらの方式でも、仕組みの「おいしいところ」は共通です。

• 作った人のAPIキーは不要（環境が自動で処理してくれる）
• 共有された相手がアプリを使うと、その人自身のClaude利用枠が消費される³
• だから「1万人に使われても作者の費用はゼロ」

ひとつ注意したいのは、ここで fetch できる宛先はAnthropicのAPIなど用意されたものに限られる点です。任意の外部サイトのAPIを自由に叩けるわけではありません（くわしくは4.3を参照）。

この「Claudeの中でClaudeを呼ぶ」構造は、英語圏では Claudeception（クロードセプション）と呼ばれて話題になりました⁴。

3.5 外部サービスとつなげる（MCP連携）

Model Context Protocol（MCP）を使うと、Google Calendar・Gmail・Slack・Notion・Asanaといった外部サービスを読み書きするアプリを作れます¹³。自作のMCPサーバーにもつなげます（Pro以上のプラン）。

3.6 データを覚えておける（永続ストレージ・Live Artifacts）

2025年10月から、アーティファクトごとに最大20MBのデータを保存できるようになりました³。保存方式は2種類あります¹。

さらに2026年4月のLive Artifactsでは、開くたびに連携先（Gmail、Stripe、Shopifyなど）から最新データを取り込んで自動更新するダッシュボードが作れるようになりました。

4. できないこと・気をつけること

便利な一方で、限界やクセもあります。ここを押さえておくと、がっかりせずに使えます。

4.1 「履歴が残らない」って本当？（最新事情）

「アーティファクトは履歴を残せないのが弱点」とよく言われますが、これは時期によって答えが変わります。

つまり「履歴を残せない」は昔の話で、今はだいぶ改善されています。ただし、保存まわりには次の落とし穴が残っています¹。

• 永続ストレージが効くのは公開済みのアーティファクトだけ（開発・テスト中は保存されない）
• 無料プランは永続ストレージ非対応（Pro・Max・Team・Enterpriseが必要）
• 公開を取り消すと、保存していたデータは完全に削除される
• 保存できるのはテキストのみ・1つあたり20MBまで（画像などのバイナリは不可）

4.2 公開・ホスティングの代わりにはならない

アーティファクトはあくまでプレビュー環境です。本格的なWebサービスとしてデプロイ・ホスティングする用途には向きません。本番運用したいなら、コードを取り出して別の開発環境に持っていく流れになります。

4.3 サーバー・データベース・自由な外部APIは基本ナシ

アーティファクトは、制限されたブラウザのサンドボックス内で動くフロントエンドのコードです。サーバーサイドのコード実行、データベース接続、Node.jsの実行はできません。任意の外部APIを自由に叩くこともできません（MCPや、3.4で触れたAnthropic APIへの fetch といった用意された経路を除く）。

4.4 ファイルは基本「1枚もの」

出力は単一ファイルが基本です。複数ファイルに分割した大規模なプロジェクト構成には向きません。

4.5 プランによって使える機能が違う

基本機能は無料プランでも使えますが、永続ストレージ・MCP連携といった発展機能はPro以上のプランが必要です。「同じことができない」となりがちなので、共有する相手のプランも意識しておくと安心です。

5. どんなものを作るのがオススメ？

「日常生活を助ける小さな道具」と相性のいい作例を集めました。どれも実際によく使われていると紹介されているものです¹。

うまく作るコツ

• いきなり全部を一気に頼まない。まず一番シンプルな版を作り、機能を1つずつ足していく方が、結果的に速くて壊れにくいです¹
• 「チャットボット」ではなく「自分専用の開発環境」だと思って付き合うと、得られるものが大きくなります¹

まとめ

• アーティファクトは、Claudeが作ったものを会話の隣で見て・触って・共有できる「作業台」
• Anthropicの狙いは、Claudeを「おしゃべり相手」から「一緒に作業する相棒」へ進化させること
• できることは年々増え、今ではAI入りアプリ・外部連携・データ保存までこなすミニアプリ工房になっている
• 「履歴が残らない」という弱点は昔の話。今はバージョン履歴や永続ストレージでかなり解決（ただし公開済み・有料プランなどの条件あり）
• 注意点はデプロイ不可・バックエンド不可・要検算・プラン差など。クセを知れば怖くない
• 日常生活の小さな道具づくりとは、とても相性がいい

特別な開発環境もアカウント登録（閲覧側）も要りません。あなたの暮らしの中にある「ちょっと面倒」を思い浮かべて、まずはひとつ、小さな道具を作ってみてください。

参考文献