Claude アーティファクト でポートフォリオを作る位置づけ
Claude アーティファクト は、会話から独立したページを書き出す仕組みです。書き出したページには専用の URL が発行されます。相手は Claude のアカウントなしで開けます。
公式のヘルプはこう書いています。「Claude は、まとまった独立した内容を、会話の本流とは別の専用の枠であなたと共有できます」。書き出せる中身は幅広く届きます。Web ページ、対話の資料、ドキュメント、図表、簡単なアプリまでです。書き出したページはチャット右側のパネルで直接手直しできます。
対応プランは Free、Pro、Max、Team、Enterprise の全部です。2026 年 7 月 13 日の更新で、公開共有が全プランに開放されました。Free の利用者でも、公開の URL を発行できます。ポートフォリオのように、費用を抑えて初回の公開まで持っていきたい制作物に向いています。
用途は幅があります。個人のアーティストが作品を並べる一枚もの。映像作家が案件別に見せる複数ページ。スタジオが所属クリエイターと過去の案件を束ねる会社案内の代わりのページ。Web 制作会社に発注する前の方向性を固める下地としても機能します。
無料で公開できる範囲
Free で使える範囲を先に整理します。書き出し、公開の URL の発行、外部への配布までは Free で完結します。費用は発生しません。作品ページと案件事例を並べる出口までは無料で組めます。名刺や SNS に URL を載せる運用まで届きます。
読み手の入力の履歴を成果物のページに残す永続保存は、Pro 以上の機能です。案件の相談窓口を成果物の中に置いて反応を残したい場合は、Pro を選びます。ここは Free では組めません。
無料で作れる範囲は、初回のポートフォリオを立ち上げる場面で足ります。個人のイラストレーターや写真家、駆け出しのデザイナーの初回運用に向きます。案件が増えて相談窓口を成果物に埋め込む段階で Pro に切り替える。この順番が扱いやすい形です。
ポートフォリオに向く三つの型
作り方の型を三つに整理します。個人の作品集、スタジオ紹介、案件事例集の三つです。
個人の作品集
写真、映像、イラスト、グラフィック、UI の作品を、縦に並べます。頭にプロフィールと得意領域、下に作品のサムネイルと短い説明、末尾に連絡先。営業の前に URL を渡す下地として動きます。イラストレーターや写真家、UI デザイナーの初回ポートフォリオに向く型です。
スタジオ紹介
所属クリエイターの一覧、代表作、得意な領域、依頼から納品までの流れを並べます。会社案内の代わりとして、コーポレートサイトを構える前でも外部への提示が成立します。
案件事例集
過去の案件を、依頼元、期間、体制、成果物、当時の課題と対応の順で並べます。案件ごとに 1 枚の別ページとして書き出し、束ねる索引の 1 枚だけを公開する構成も組めます。企画会議に持ち出す下地としても向きます。
三つの型は排他ではありません。個人の作品集の末尾に案件事例を並べる混ぜ方も自然に取れます。
制作の四段の手順
流れを、下地、作品、プロフィール、書き出しの四段に整理します。
一つめ 下地
ページ全体の骨組みを Claude に書き出させます。用途、読み手、載せる中身、色と書体の基準を短い文で渡します。下書きの 1 ページが出ます。この一段目で骨組みが決まると、残りの往復が減ります。
二つめ 作品
書き出された下地に、実際の作品と説明を差し込みます。並び順、サムネイルの大きさ、説明文の長さを直します。目に見える要素の話で Claude に伝えます。
三つめ プロフィール
経歴、得意領域、実績、連絡先を整えます。読み手が案件を頼む判断で見る場所です。素直に読める言葉で置きます。
四つめ 書き出し
公開の URL を発行します。パネル右上の共有の操作から公開すると URL が出ます。相手は Claude のアカウントなしで開けます。
四段は順に一回で進むというより、二つめと三つめを往復してから四つめに移る進み方が自然です。書き出しの後も、更新のたびに同じ URL の中身が置き換わります。
下地に渡すブリーフ 七つの要素
下地を書き出させる前に、ブリーフを七つの要素で整えます。名義、読み手、目的の行動、載せる作品の種別、ブランドの基準、避けたい表現、参考の URL。この七つです。
名義。 個人の氏名か、スタジオの名称かを一文で書きます。個人は活動名も併記します。
読み手。 想定する属性、案件を頼む立場、この URL に到達した経路の三点で書きます。プロデューサー、代理店、直接の企業窓口のどれを主に想定するか。ここで載せる文言が変わります。
目的の行動。 相手にとってほしい行動を動詞で書きます。「問い合わせフォームに進む」「返信のメールを書く」「上長に転送する」といった具体の動詞です。
載せる作品の種別。 写真、映像、イラスト、UI などの領域と、公開できる本数、掲載の可否の三点で書きます。
ブランドの基準。 色の 16 進コード、書体の名前、写真の質感の三点で書きます。個人でも基本の色と書体を先に決めておくと、一発目の見た目が安定します。
避けたい表現。 業界で使い古された言い回し、直訳調のフレーズ、他者の受け売りに聞こえる形容を並べます。
参考の URL。 方向性が近い他者のポートフォリオを 3 本前後で挙げます。
七つをまとめて Claude に渡し、「以下のブリーフに沿って、ポートフォリオサイトの下地を 1 枚で書き出してください」と続けます。右側のパネルに骨組みが開きます。
作品ページの整え方
作品を差し込む工程では、サムネイルの見せ方と、下の説明文の書き方の二つが要点です。
サムネイルは、作品ごとに縦横の比率を揃えます。並びの見え方が落ち着きます。写真と映像を混ぜる場合は、映像に冒頭の一枚を静止画として置き、再生の操作は後段に寄せます。作品の点数が多い場合は、領域別に見出しを立てます。各領域の中で年月順に並べる形が読みやすい形です。
下の説明文は、案件名、依頼元、期間、体制、担当領域の五点を短く並べます。個人の制作物として出す作品は、依頼元の欄を「個人制作」とします。案件名や依頼元を出せない場合は、業種と規模だけを書く並びにします。
説明文の長さは、一つの作品で 3 行前後に収めます。長い文章を並べると、作品への視線が逸れます。詳細を伝えたい案件は、案件事例のページに切り出します。
作品の順序は、頭に最新か、頭に代表作を置くかの二択です。読み手が最初の一つだけを開いて判断する前提で組みます。頭の作品を「これが読み手に届いてほしい一つ」として選びます。
プロフィールと連絡先の見せ方
プロフィールの並びは、氏名または名義、活動領域、経歴の要点、得意な仕事、連絡先の五段が基本です。
氏名または名義は、ページの頭に大きく置きます。読み方の揺れがある名義は、ふりがなを添えます。活動領域は、写真、映像、UI といった大枠と、案件で受けている仕事の粒度を一文で書きます。「ブランドの広告写真と Web の撮影を軸に、映像の絵作りも担う」といった書き方です。
経歴の要点は、これまで組んだ相手、担当した仕事の中心、独立や設立の年月を、時系列で三点前後に絞ります。長い経歴の全文を並べるより、案件を頼む判断につながる要点を選びます。得意な仕事は、依頼を受ける場面で伝えている領域と、直近で伸ばしている領域の二つに分けて書きます。
連絡先は、メールアドレス、返信の目安、対応言語の三点を置きます。返信の目安を書くと、相手が問い合わせる心理の壁が下がります。相談窓口を別にしている場合は、その旨を短い一文で添えます。
Team と Enterprise の組織で公開する場合は、外部共有の可否が組織の管理者の設定で決まります。個人のアーティストが Free で使う場合は、自分の判断で公開の URL を発行できます。
案件事例ページの組み方
案件事例のページは、依頼元、期間、体制、成果物、当時の課題と対応、公開できる素材の順で並べます。1 件を 1 ページとして書き出す構成が扱いやすい形です。
依頼元は、公開の可否を先に相手と確認します。公開できない場合は、業種、規模、地域の三点で書きます。期間は、着手と納品の年月を並べます。体制は、担当した役割と、組んだ相手の役割を並べます。個人で完結した仕事も、その旨を明記します。
成果物は、書き出す媒体、本数、公開の URL または画像の順で並べます。公開の URL がある案件は、この欄に置きます。当時の課題と対応は、依頼元が抱えていた状況と、対応で決めた方針、実際に動いた工程を、短い段落で書きます。過度な形容を避け、事実の並びで書きます。案件を頼む判断の材料になります。
案件事例のページは、それぞれ個別の URL として書き出し、索引の 1 ページから内部リンクでつなぐ構成にします。索引のページだけを公開しておき、事例のページは相手に URL を直接渡す運用も組めます。公開範囲を、案件ごとに調整できる形です。
Claude アーティファクト の対話性を使うと、事例のページの中に、対応前後の比較や、選んだ選択肢の理由をたどれる要素を差し込めます。読み手が触れる部分を残すことで、事例が「読み物」から「たどれる資料」に変わります。
公開共有と URL の運用
パネル右上の共有から公開すると、URL が発行されます。URL を知っている相手は Claude のアカウントなしで開けます。公開の可否は、公開する前に一段の判断を挟む段取りにします。
2026 年 7 月末に、公開の URL を発行した一部の共有会話と成果物が、検索の対象として拾われる事例が報じられました。ポートフォリオとして公開するページは外部への提示を想定した内容です。それでも、案件事例に載せる情報の一部(依頼元、金額、社内の判断の細部)は、公開の前に必ず相手の同意を確認します。
公開の URL は、名刺、メール署名、SNS の bio、案件の応答メールに載せる出口として使います。同じ URL の中身を更新するたびに新しい状態が反映されるので、URL そのものは長く使えます。
更新の頻度は、新規の作品が入るごとに小さく更新する形と、四半期にまとめて更新する形の二通りに分かれます。個人のアーティストは前者、スタジオは後者が組みやすい形です。
Team と Enterprise の組織で作った成果物は、既定では組織の中だけで共有されます。外部共有そのものを管理者が制御できます。組織の中で完結する状態を既定にし、外に出すときだけ判断が挟まる設計が組みやすい形です。
更新運用と版の管理
ポートフォリオは、一度公開して終わりの制作物ではありません。新規の作品、実績の更新、連絡先の変更、案件事例の追加が、日常の運用で続きます。
Claude アーティファクト で公開したページは、同じ URL の中身が置き換わる形で更新されます。開いたままの相手のブラウザにも変更が届きます。メールや SNS で告知した URL が、そのまま最新の版を指します。差し替えのたびにファイルが増えて、どれが最新か分からなくなる状態を避けられます。
Pro、Max、Team、Enterprise の各プランでは、永続保存で読み手の操作の履歴を成果物のページに残せます。案件の問い合わせに使う入力の記録などを、成果物の中で保持したい場面で使えます。Free では使えません。運用の設計を先に決める必要があります。
Team と Enterprise で組織のメンバーが複数のポートフォリオを扱う場合は、共有した成果物からその成果物を作った会話の添付にも共有相手が触れられます。取り扱いに気をつけたい書類を含む会話から作った成果物は、公開の前に会話を分けておきます。
Claude Skills と Claude Design との使い分け
ポートフォリオを作る場面では、Claude アーティファクト、Claude Skills、Claude Design の三つが揃って実務が回ります。役割の分担を整理します。
Claude Skills は、自分の名義、得意領域、案件の書き方、避けたい表現を Claude に読ませておく仕組みです。SKILL.md にまとめておくと、どこから頼んでも同じ判断で書き出しが揃います。ポートフォリオの更新のたびに、基準を伝え直す手間が消えます。
Claude Design は、複数の版面を並べて視覚で仕上げる編集の場です。作品の並び順、余白、色の細かい調整を、目で見ながら整える工程に向きます。アーティファクト で書き出した下地を、最終の見え方に近づけるところで動きます。
Claude アーティファクト は、会話の流れからポートフォリオを書き出して、そのまま共有できる 1 枚を作るところです。Skills が「基準を持たせる」、Design が「視覚で仕上げる」、アーティファクト が「動くページとして書き出して渡す」。この三分担で覚えておくと、日々の更新で迷わなくなります。
実務の流れは、Skills で自分の基準を読ませ、アーティファクト でポートフォリオを書き出し、必要なら Design で最終の見え方を整えます。この順で動かすと、公開の速さと質の両方が上がります。
関連の記事として、Claude Artifacts ブランドチーム活用ガイド|UI 試作から資料共有までの実務 がハブに当たります。姉妹の記事に、Claude Artifacts でランディングページを作る実務ガイド、Claude Artifacts でブリーフの入力フォームを作る手順、Claude Artifacts で Recraft のブランドブックを組む、Claude Artifacts でスライド 作成|提案書とピッチと社内資料を URL 一本で配る手順 を並べています。
FAQ
Q1. Claude アーティファクト でポートフォリオサイトを無料で作れますか
A. 作れます。Free、Pro、Max、Team、Enterprise の全プランで書き出しと公開ができます。2026 年 7 月 13 日の更新で公開共有が全プランに開放されたので、Free の利用者でも公開の URL を発行して、社外の相手に URL 一本で渡せます。読み手の入力の履歴を残す永続保存が要る場合は Pro 以上を選びます。
Q2. 独自ドメインは使えますか
A. アーティファクト の公開の URL は、共有した相手が Claude のアカウントなしで開けますが、独自ドメインでの提供は原則の使い方には含まれません。名刺、メール署名、SNS の bio には アーティファクト の URL を直接置く形が基本です。独自ドメインを使う設計にしたい場合は、書き出したページを別の Web ホスティングに移す構成を組みます。
Q3. 作品の点数が多い場合はどう見せますか
A. 領域別に見出しを立て、各領域の中で年月順に並べます。案件事例は 1 件を 1 ページとして別に書き出し、索引の 1 ページからつなぐ構成が組みやすい形です。頭の一つで判断される前提で、頭に置く作品を意識して選びます。
Q4. 案件事例に載せる依頼元の情報はどこまで書けますか
A. 公開の可否は依頼元と先に確認します。公開できない場合は、業種、規模、地域の三点で書きます。金額や社内の判断の細部を載せる場合は、事前に相手の同意を必ず取ります。事例のページを公開せず、相手に URL を直接渡す運用も組めます。
Q5. Team と Enterprise の組織で個人のポートフォリオを扱えますか
A. 扱えますが、外部共有の可否は組織の管理者の設定で決まります。組織の設定で外部共有を有効にした場合のみ、メンバーが公開の URL を発行できます。組織の中で閉じた運用が既定なので、外に出すときは管理者の承認を通す段取りを組みます。
情報源
- What are artifacts and how do I use them? (Claude Help Center)
- Publish and share artifacts (Claude Help Center)
- Claude Code now supports artifacts (Claude Blog)
- Build with Artifacts (Claude Blog)
- Use live artifacts in Claude Cowork (Claude Help Center)
- Custom visuals in chat and Cowork (Claude Help Center)
- Skills (Claude Product Page)
- Claude.ai / Artifacts overview