Claude Artifactsの活用方法:小さなツールを作り、確認する手順
この記事はAIの支援を受けて原文を翻訳したものです。専門用語や数式は原文とあわせて確認してください。
要点: Claude Artifactsを使うときは、作る対象、入力値、結果、確認方法を併せて書いてください。文書や小さなツールの草案を受け取ることと、他の人に見せられる結果を作ることの間には修正と確認が必要です。以下の学習計画ツールは説明用の企画例で、実際の生成・試験結果ではありません。
1. Artifactsで何を依頼するか決める
Artifactsは会話の横で開き、変更や再利用ができる成果物です。公式案内は文書、デザイン、ダッシュボード、小さな対話型ツールなどを例に挙げています。提供方法と機能の条件は変わり得るため、Artifactsの公式文書を現在の画面と併せて確認してください。
最初の題材は、数字の入力が少ない計画表、説明カード、公開資料だけを使うクイズなど、結果を確認しやすい対象を選ぶとよいでしょう。最初から会員管理、決済、複数サービスへの接続まで頼むと、完成状況の判断が難しくなります。主要機能を一つ先に決め、必要な機能を追加してください。
2. 架空の例:学習時間の配分ツール
一日の学習時間を科目ごとに分けるツールを作ると仮定します。入力は総学習時間と科目別の比率、出力は各科目に配分した時間です。「かわいい学習アプリ」という依頼より、何を入力し何を表示するかが明確です。先に計算規則を文章で定めれば、画面修正時にも基準を維持できます。
공부 시간을 나누는 작은 도구를 Artifact로 만들어 줘.
입력: 전체 시간(분), 국어·영어·수학 비중.
출력: 과목별 시간과 전체 합계.
비중 합계가 100이 아니면 이유를 보여 주고 계산하지 마.
전체 시간이 0 이하이거나 비어 있으면 입력 안내를 보여 줘.
정수 분으로 표시하되 반올림 차이가 있으면 따로 설명해 줘.
실제 학습 효과를 보장하는 표현은 넣지 마.
먼저 계산 규칙과 확인할 예시를 보여 줘.
この質問の重要な部分は色や配置より、エラー処理と合計です。比率の合計が誤っている場合に自動調整するか計算を中断するかは異なる規則なので、望む方法を選び明示してください。配分時間は計画を整理する数値で、成績の向上を意味しません。
3. 生成後は一度に一種類ずつ修正する
最初の結果に「もっとよくして」とだけ頼むと、計算とデザインが一緒に変わる場合があります。「入力欄名を韓国語に変え、計算方法は維持して」「エラー案内を入力欄の下に表示して」「モバイルで表が切れないよう配置を調節して」のように修正目的を分けてください。
修正前に維持する項目を書けば変更を比べやすくなります。例えば合計確認、空の値の処理、丸めの案内を維持し、文字サイズだけを変えます。文書にも同じ原則を適用できます。日付と事実を維持して題名と段落だけを直すよう依頼してください。
4. 見栄えのよい結果と正しい結果を区別する
学習ツールの確認入力として、合計120分、比率25・25・50を入れる場合を考えてください。単純な比率計算による期待値は30・30・60分です。これはこの記事で定めた計算例で、生成ツールが実際にこの値を出したという意味ではありません。利用者は結果画面と期待値を直接比べる必要があります。
- 空欄、0、負数、数値でない値で案内が適切か確認します。
- 比率の合計が99または101なら、定めた規則で処理するか確認します。
- 総時間が小さい場合、丸め後の合計がどう表示されるか調べます。
- 携帯電話サイズの画面で入力と結果を読めるか確認します。
- 更新や再度開いた後、保存されると思った情報が実際に残るか確認します。
保存の有無は成果物の実装と機能条件に応じて確認する必要があります。画面に入力欄があるだけでデータが永続的に保存されると仮定しないでください。説明にも確認済みの機能だけを書くとよいでしょう。
5. 共有前にアクセス範囲と内容を確認する
草案には仮の名前や内部資料が入る場合があります。共有前に個人情報、作業メモ、未確認の主張やリンクを探して整理してください。共有相手に与える権限と相手が見られるものは、公式の共有案内と実際の共有画面で確認します。
小さなツールを公開するときは、目的、入力例、計算規則、既知の制限を短く付けると読者が判断しやすくなります。「正解を教える学習ツール」より「入力した比率に応じて学習時間を配分する計画ツール」が実際の機能を正確に説明します。共有後も修正内容と確認日を記録してください。
6. 文書と小さなツールのどちらを作るか選ぶ
Artifactsで同じ内容を複数の形にできても、目的に合う結果を選ぶ方がよいでしょう。読者が決まった説明を見るのか、数字を変えて結果を比較するのか先に分けてください。固定した学習計画を伝えるなら文書が簡単で、入力に応じて計画を変えるなら小さなツールを検討できます。
| 目的 | 依頼する結果 | 完了の判断基準 |
| 使用手順を伝える | 短い案内文書 | 必要な手順と例外が入っている |
| 数値に応じて計画を変える | 入力と結果があるツール | 計算規則とエラー処理が正しい |
| 発表で説明する | 内容を分けた発表資料 | 一画面で読む分量が適切 |
| 配置・色を確認する | デザインの草案 | 対象画面のサイズと文言が合う |
公式文書は文書・発表・デザイン用テンプレートとアカウントごとの提供条件を区別しています。Artifactsの使用には関連するコード実行・ファイル生成機能の条件も調べる必要があります。この内容は前の公式リンクで確認できますが、特定アカウントで全テンプレートが使えるという意味ではありません。

画面が以前の説明と異なる場合は成果物の生成時期と種類を確認してください。現在の公式文書は過去に作ったlegacy artifactsと新しい成果物の動作を区別しています。古い成果物の書き出し・共有ボタンを新作業でも期待するより、今開いている成果物の公式案内を適用する必要があります。
7. 学習ツールの仕様をもう少し具体的に書く
先のツールに実際の計画を入れるなら、時間の単位、空の値の処理、小数点の表示を定める必要があります。以下はこの記事で作った詳細仕様です。コピーしてから科目と入力範囲を自分の状況に合わせて変えて使えます。
공부 시간 배분 도구를 만들어 주세요.
목적: 오늘 사용할 시간을 과목별로 나누어 보는 계획용 초안.
사용자: 한국어를 읽는 초보자. 설명은 화면에 짧게 표시.
입력:
- 전체 공부 시간: 분 단위의 양의 정수.
- 세 과목의 비중: 각각 0~100의 정수.
계산:
- 비중 합계가 100일 때만 계산.
- 배정 시간 = 전체 시간 × 해당 비중 ÷ 100.
- 내부 계산에는 표시용 반올림 전의 값을 유지.
- 소수점 한 자리 반올림은 화면 표시 단계에서만 적용.
- 전체 합계는 반올림 전 과목별 계산값을 합한 뒤 표시.
- 반올림한 표시값을 다음 계산이나 합계 계산에 다시 사용하지 않음.
- 표시된 과목별 시간의 합계와 전체 시간이 다르면 표시 반올림 차이를 안내.
- 정수로 바꾸는 기능은 이번에는 만들지 않음.
처리:
- 빈칸이나 잘못된 값은 입력 위치별로 이유 표시.
- 오류가 있는 동안 이전 계산 결과는 '이전 결과'라고 표시.
- 과목 이름과 전체 합계를 결과에 같이 표시.
범위:
- 로그인·외부 연결·데이터 저장은 이번 요청에 포함하지 않음.
- 실제 학습 효과나 추천 비중을 보장하지 않음.
먼저 구현할 동작 목록과 아래 사례의 기대값을 정리해 주세요.
내가 그 규칙을 읽은 뒤 화면 초안을 만들어 주세요.
整数への丸め規則が未定なら、最初の版で小数第一位の結果を表示する選択も可能です。この場合も各行を丸めて表示すると行別表示値の合計が総時間と異なる場合があります。内部計算値を維持し、表示差を案内する規則を仕様に入れてください。整数表示が必須なら、余りの分をどの順序で配分するかも別途定める必要があります。
架空の確認例として、合計1分に比率33・33・34を適用すると丸め前の値は0.33・0.33・0.34分です。各値を小数第一位で表示すると0.3・0.3・0.3分となり表示値の合計は0.9分ですが、丸め前の合計は1分です。画面には合計1.0分とともに「表示の丸めにより科目別表示値の合計が全体より0.1分少なく見えます」と説明できます。これは執筆者が計算した確認用の例で、実際のArtifactの実行結果ではありません。

8. 架空の入力表で計算とエラーを確認する
以下の値は執筆者が上の仕様を基準に計算した期待結果です。Claudeの生成画面から得たテスト結果ではありません。実際の成果物をこの表と比較して動作を確認してください。
| 入力 | 仕様に基づく期待結果 | 探す誤り |
| 120分 / 25・25・50 | 30.0・30.0・60.0分 | 科目の順序が変わっていないか |
| 45分 / 20・30・50 | 9.0・13.5・22.5分 | 小数の値が抜けていないか |
| 100分 / 0・40・60 | 0.0・40.0・60.0分 | 0%の科目が誤ってエラーにならないか |
| 120分 / 25・25・40 | 合計90なので計算を中断 | 比率を自動変更しないか |
| 総時間が空欄 | 時間入力の案内 | 空欄を0として計算しないか |
正常入力だけでは画面がよくできていると感じがちです。値を消したり比率合計を変えたりして計算ボタンを押す流れを確認してください。特に新入力にエラーがあるのに以前の結果が現在の結果として残ると、利用者が誤読する場合があります。その際は表示規則の修正を依頼する必要があります。
전체 시간을 지웠을 때 기존 120분 결과가 그대로 보입니다.
기존 결과는 유지하되 '이전 결과: 현재 입력은 미완성'으로 표시하세요.
현재 입력이 유효할 때 계산한 결과와 구분해 주세요.
계산식과 과목 순서는 바꾸지 마세요.
수정 후 빈칸 → 정상 값 → 비중 합계 오류 순서로
살펴볼 항목을 목록으로 알려 주세요.
実際のエラー報告では、入力したものと表示画面を書く必要があります。上の文言はエラー修正依頼を説明する架空の例です。未観察の現象を発生済みのエラーとして送らず、「この条件を処理するか確認して」に変えて依頼してください。
9. 共有版と作業中の草案を区別する
- 仕様と結果が同じか正常・エラー入力で照合します。
- 架空の名前と資料、内部メモを画面と説明から探します。
- 使用目的、入力単位、計算規則を短く案内します。
- 現在の成果物が提供する書き出し形式や共有方法を選びます。
- 共有範囲とアクセス権限を読み、受信者が開ける環境かを別途確認します。
ツールを説明する文書も併せて作れます。「入力例を一つ、不正入力の処理、保存の有無、既知の制限を4段落にまとめて」と頼むと、伝達資料の草案を受け取れます。保存を実装していなければ保存されると書かず、実装済みでも実際の保存と再度開く動作を確認する必要があります。
企画と使用でよくある追加質問
出力形式を先に指定するべきですか? 別のアプリで変更する目的なら、必要形式を先に書き、実際の提供状況を比較してください。色から修正してもよいですか? 色は自由に変えても、エラー表示と計算基準が同時に変わらないよう維持条件を付けてください。アプリへの接続が必要ですか? 固定の入力だけで計算するツールは外部接続なしで企画できます。接続が必要な作業は対象資料と読み書きの目的を別途定めてください。
よくある質問とミスの解決
Artifactsが見えない場合は? アカウントで機能を使う条件と設定を公式文書で確認し、必要な成果物の種類を質問に直接書いてみてください。エラーが出た場合は? エラーの文言、発生した入力、期待結果を併せて伝えます。共有すれば完成したサービスですか? 実際の使用と運用に必要な機能を別途確認する必要があります。草案の生成だけで確認が終わるわけではありません。
公式の出典と確認日
公式文書確認日:2026年10月3日。画面と提供条件は後に変わることがあります。
本文の理解を助けるために制作したオリジナルイラストです。
Tistoryの原文 ↗