UNIT 04 · LEARN BY BUILDING
LPを作る前に、誰に何を伝えるか決める。
いきなり「いい感じに作って」と頼むのではなく、読む人と届けたい内容を決めてから制作を始めます。決めた内容は、lp_learning の中に brief.md という企画メモとして残します。
まだコードは書きません。何を作るか決めます。
今回は、架空の「SNS画像デザイン室」というサービスのLPを考えます。LPは、SNSなどから来た人にサービスを伝え、次の行動へ進んでもらうページです。
「誰の」「どんな悩みを」「どう助けるか」「次にどんな行動をしてほしいか」を決め、UNIT 03と同じ「内容を見せてもらう → 許可する → 自分で確かめる」の流れで、lp_learning の中に brief.md という企画メモを作ってもらう。
Macをお使いの方へ
この教材の操作手順と画面写真は、Windowsのパソコンで実際に操作して確かめたものです。Macでは、フォルダの場所や開き方、画面の一部が異なります。Macでの手順は、この教材では確かめていません。公式のデスクトップアプリを始めるもあわせて確認してください。
画面写真は、Windows 10 Home(22H2、64ビット)で2026年11月10日〜11日に撮影したものです。アプリは暗い色の表示です。名前・フォルダの場所・会話の履歴などが写る部分は灰色で隠し、説明に必要な部分だけを切り抜いています。黄色の枠は、ORIHATAが重ねた印です。
6つの欄で、作る内容を言葉にする。
例文を入れてあります。はじめは例文のままで進めるのがおすすめです(この教材の写真は、例文のままで撮影しています)。自分の商品がある人は、入力内容を置き換えても構いません。
YOUR BRIEF · 入力内容の確認
brief.md に書く企画の中身
- サービス名
- SNS画像デザイン室
- 誰に
- SNSで情報発信する個人事業主
- 困りごと
- 投稿画像を作る時間が取れず、発信が続かない
- 提供すること
- 発信内容に合わせたSNS投稿用画像を1枚ずつ制作する
- 大きな見出し
- 伝えたいことが、見た目でも伝わる。
- 補足文
- SNSで発信する個人事業主を、投稿画像づくりでサポートする架空のサービスです。
- 次の行動
- 「サービス内容を見る」→ 同じページの #service(サービス内容の説明)へ移動
6つの欄はすべて入力が必要です。空欄があると、STEP 03の依頼文を作らず、コピーボタンも押せなくなります。
送る前に、lp_learning と「手動」を画面で見る。
ClaudeアプリのCodeを開き、サイドバーの「新規作成」で新しいセッションにします。UNIT 03のSTEP 03と同じ方法で、「作業するフォルダを選択」→「フォルダを開く…」から lp_learning を選びます。
- 入力欄の下にlp_learningと出ているか見ます(写真1の左下の枠)。
- 入力欄の下の右側が「手動」になっているか見ます(写真1の右下の枠)。「自動」などになっていたら、押して「手動」を選びます(UNIT 03のSTEP 05)。
- 「このワークスペースを信頼しますか?」が出たら、UNIT 03のSTEP 04と同じように、自分で用意した lp_learning なら「ワークスペースを信頼」を押します。

新しいセッションでは、権限が最初「自動」になっていることがあります(UNIT 03の撮影時)。送る前に、毎回「手動」を確かめてください。
まだ作らせずに、作る予定の内容を見せてもらう。
STEP 01 の内容から作った依頼文を、Codeの入力欄に貼り付けて送ります。最後の3行で、ほかのファイルと start.md を変えないこと、まだ作らず、内容を先に見せることを頼んでいます。
lp_learningホームフォルダの中
start.mdUNIT 03で作った練習の前提メモ(変えない)brief.md今回作る企画メモ
図1 今回の作業のあとの lp_learning の中(ORIHATAによる概念図です。実際の画面ではありません)
現在選択している lp_learning フォルダの中に、 brief.md という企画メモのファイルを作成してください。 内容は次のとおりです。 # LP企画書(学習用) ## サービス名 SNS画像デザイン室 ## 対象読者 SNSで情報発信する個人事業主 ## 読者の困りごと 投稿画像を作る時間が取れず、発信が続かない ## 提供すること 発信内容に合わせたSNS投稿用画像を1枚ずつ制作する ## ファーストビューの見出し 伝えたいことが、見た目でも伝わる。 ## 補足文 SNSで発信する個人事業主を、投稿画像づくりでサポートする架空のサービスです。 ## 行動ボタン(1つ) 「サービス内容を見る」 → 同じページの #service に移動 ## 安全と範囲 - 学習用の架空サービス。実在の販売・受付は行わない - 実績、利用者の声、価格などを創作して掲載しない - まずはローカルで確認する。公開しない - 1工程ずつ、本人が承認・確認する ほかのファイルは作成・変更・削除しないでください。すでにある start.md も変更しないでください。 まず作成する内容を提示し、私の確認を待ってください。 まだファイルは作成しないでください。
送ると、Claudeが作る予定の内容を示します。写真2では、「まだファイルは作成していません」(上の枠)と作成先(下の枠)が書かれ、その下に brief.md の中身が示されました。

- まだ作っていないこと(許可の確認が出ていない)
- 作るのがbrief.md の1つだけで、作成先がlp_learning の中であること
- 中身が、STEP 01 で決めた内容と同じこと(実績・利用者の声・価格などが足されていない)
どれかが違っていたら、2通目を送らずに、直してほしいところを返信します。返事の最後に「作成してください」と返信するよう案内されることもありますが、この教材では次のSTEP 04の文を送ります。
内容でよければ作成を頼み、許可の確認を見て選ぶ。
内容でよければ、次のように返信します。
提示された内容で brief.md を作成してください。
権限が「手動」なので、書き込む前に「Claude に brief.md の書き込みを許可しますか?」と確認が出ます(写真3の上の枠)。その下に、書き込む内容が行番号つきで表示されます。

- ファイル名がbrief.mdで、書き込み先がlp_learning の中かを見ます。
- 表示された内容が、STEP 03で見せてもらった内容と同じかを見ます。
- よければ「一度だけ許可」を押します。違っていたら「拒否」を押し、直してほしいところを返信します。
今回の書き込みだけを許可します。この教材ではこれを選びます。
今回の書き込みをさせません。内容や場所が違うときに使います(押したあとの動きは、この教材では確かめていません)。
この確認で見えたボタンは、撮影時(UNIT 04)は「拒否」と「一度だけ許可」でした。UNIT 03の撮影時は「常に許可」「一度だけ許可」「許可して Auto に切り替え」が並んでいました。表示はアプリの版や状況で変わることがあります。どの場合も「一度だけ許可」を選びます。
許可すると、Claudeが brief.md を作り、結果を知らせます。右側の欄の「成果物」にも brief.md が出ました(撮影時)。
写真4のように、作業の途中で英語の短い文(Claudeの作業のメモ)が表示されることがあります。返事の言い方も毎回変わります。大切なのは、作ったのが brief.md だけで、start.md など、ほかのファイルを変えていないと書かれているかです。それもSTEP 05で、自分の目で確かめます。
エクスプローラーで、2つのファイルを見る。
AIの「作成しました」だけで終わらせず、実際のフォルダを確かめます。
- UNIT 03と同じ方法で、エクスプローラーのアドレス欄に
%USERPROFILE%と入れてホームフォルダを開き、lp_learningをダブルクリックします。 - 一覧にbriefとstartの2つがあれば成功です(写真5の枠)。
- start の更新日時が、UNIT 03で作ったときのまま(今日より前の日時など)になっていることも見ます。

撮影では、start の更新日時は前の日(UNIT 03で作った日時)のままでした。中身を見たいときは、右クリックして「プログラムから開く」→「メモ帳」で開けます(この操作の画面は撮影していません)。開いたら、何も変えずに閉じます。
Claudeに任せる
作る予定の内容を示すこと、brief.md の作成、できたファイルの報告。
自分で確認する
作業場所が lp_learning か、権限が「手動」か、作るのが brief.md だけか、中身が決めた内容と同じか、start.md が残っているか。
うまくいかないときの対処。
STEP 01 に空欄があります。案内が出ている欄を入力してください。「例文に戻す」を押すと、例文に戻ります。
依頼文の欄の文をマウスで選んでコピーし、Codeの入力欄に貼り付けます。
何も送らずに、サイドバーの「新規作成」で新しいセッションにして、UNIT 03のSTEP 03の方法で lp_learning を選び直します。
まだ作る段階ではないので「拒否」を押し、「まず作成する内容を提示し、私の確認を待ってください。」と返信します(この教材の確認では、1通目で許可の確認は出ませんでした)。
2通目を送らずに、違うところを伝えて直してもらいます。実績・利用者の声・価格などが足されていたら、消すように頼みます。
入力欄の下の右側が「手動」か確かめます。違っていたら「手動」に戻します(UNIT 03のSTEP 05)。できた brief.md の中身は、エクスプローラーとメモ帳で確かめます。
UNIT 03の画面の説明では、そのセッションは確認が求められなくなります。入力欄の下の表示を確かめ、「手動」に戻すか、新しいセッションで始め直します(戻したあとの動きは、この教材では確かめていません)。
前に作ったものかもしれません。上書きさせずに、いったん止めて、エクスプローラーとメモ帳で中身を確かめてから決めます。
開いているのが lp_learning か、アドレス欄で確かめます。Claudeの返事や許可の確認に出ていた作成先も見直します。別の場所にできていた場合は、消したり動かしたりせずに、そのことをメモして止めます。
同じ操作をくり返さず、いったん止めます。表示された文章と、自分がした操作をメモして、公式のヘルプを確かめます。
公式資料:デスクトップアプリを始める。サービスの仕様や画面は変わることがあります(2026年11月11日に確認)。
企画メモができたら、ここを確認。
手を動かしたことに加えて、なぜそうするのかを言えるかを確かめます。言えないものがあれば、そのSTEPを読み直してください。
チェックはこの画面上の自己確認用です。Codeの実行結果を自動で調べているわけではありません。
確かめの問題(答えは押すと開きます)
Q1. STEP 01 の欄を1つ空にしました。依頼文はどうなりますか?
依頼文は作られず、コピーボタンも押せません。空欄のままの不完全な企画メモを作らないためです。案内の出た欄を入力します。
Q2. 1通目の返事に、頼んでいない「利用者の声」が足されていました。どうしますか?
2通目を送らずに、足された部分を消して、決めた内容のとおりにするよう返信します。この教材の架空のサービスでは、実績・声・価格を作りません。
Q3. Claudeの返事の言い方が、写真と少し違いました。失敗ですか?
失敗ではありません。返事の言い方は毎回変わります。まだ作っていないこと、作るのが lp_learning の中の brief.md だけであること、中身が決めた内容と同じであることを確かめます(STEP 03)。
完成した brief.md を読ませて、最初のLP画面を作ります。企画内容を毎回長く書き直す必要がなくなります。

