この記事で分かること：未経験の会社員が、AIを使ってLP（ランディングページ）やHP（ホームページ）を「作って納品する」副業の全体像。使うツール・収益モデル・始めるまでの準備・よくある不安をまとめた入口記事です。各ステップの詳細は末尾のリンク先を参照してください。本記事の情報は2026年6月時点です。料金・ツールは変動しますので、契約前に必ず公式で最新情報を確認してください。
目次
- 結論：AIでLP/HP制作副業はどんな人に向くか
- 「作って納品」とは何か——全体像を3分で
- 使うAIツール一覧（比較表）
- 制作から納品までの5ステップ
- 収益モデル：制作費＋月額保守で継続収益に
- 始める前の準備（アカウント・費用・環境）
- 最短の始め方3ステップ
- 注意点と安全設定
- スタート前チェックリスト
- よくある不安・FAQ
結論：AIでLP/HP制作副業はどんな人に向くか
AIエージェントとデザインAIの進化で、コードが書けない未経験の会社員でも、LP/HPを作って中小事業者に納品する副業が現実的になりました。この副業が向く人の条件は以下の通りです。
- 「手を動かして成果物を作る」副業がしたい人
- 月5万〜20万円の範囲で収益を積み上げたい人（目安・規模による。保証ではありません）
- 単発でなく月額保守で継続収益にしたい人
- AI操作は慣れていないが、1〜2週間の学習時間を確保できる人
逆に、「すぐ大きく稼ぎたい」「学習をすっ飛ばしたい」という場合は期待値と合わない可能性があります。AIが実装を担ってくれる分、品質確認・顧客対応・価値提案の部分は人間が担うことに変わりありません。
詳細な受注から納品・月額保守の手順は、実践パッケージ（有料）にまとめています。
「作って納品」とは何か——全体像を3分で
「作って納品」副業の流れはシンプルです。
- クライアント（中小事業者・個人店）からLP/HPの制作を受注する
- AIツールを使ってデザイン・コードを生成し、完成物を作る
- Vercelなどで公開URLを発行し、納品する
- 以後、月額保守（文言・画像の更新・障害対応等）で継続収入を得る
2026年時点の最大の変化は「AIエージェントが実装を担える」こと。ChatGPTで構成を作り、v0やFigma Makeでデザインを生成し、Claude CodeやAntigravityで動くコードに仕上げるまでが、コーディング経験なしでもこなせるようになりました。
ただし、AIが生成した成果物の動作確認・クライアントとの要件確認・品質責任は人間が持ちます。「AIが作るから何もしなくていい」ではありません。
使うAIツール一覧（比較表）
制作フローで登場する主要ツールを整理します。料金は2026年6月時点の目安です。契約前に必ず各公式で最新情報を確認してください。
| 用途 | ツール | 料金目安 | 特徴 |
|---|---|---|---|
| 構成・コピー設計 | ChatGPT（GPT-5.5） | 無料〜Plus 約$20/月 | LPの構成案・キャッチコピー・本文下書きを生成 |
| UI生成（コード付き） | v0 | 無料〜Pro 約$20/月 | React/Next.js+Tailwindのコードを含むUIを生成。最短の実装入口 |
| デザイン生成 | Figma Make | Figmaプランに含む | Figmaのデザインをそのまま実装につなげやすい |
| AIエージェント実装 | Claude Code | Claudeプランに含む（従量） | 指示だけで複数ファイルを跨いだ実装・修正を自律実行 |
| AIエージェント実装（無料入口） | Google Antigravity | 個人は無料プレビュー | 計画→実装→検証を自律実行。未経験の入口として使いやすい |
| 公開・ホスティング | Vercel | 無料〜Pro 約$20/月 | GitHubと連携して1コマンドで公開。カスタムドメインも設定可 |
各ツールの詳細は v0ツールページ・Claude Codeツールページ を参照してください。
制作から納品までの5ステップ
ここでは架空のカフェ「陽だまり珈琲」のLP制作を例に、流れを説明します。各ステップの詳細な操作手順は LP/HP作り方詳細記事 を参照してください。
- STEP 1 — 構成設計（ChatGPT）： 「陽だまり珈琲のLP構成を作って。ターゲット：30代会社員。目的：来店予約。セクション構成と各セクションのコピー例も出して」とChatGPTに依頼し、ヒーロー/特徴/お客様の声/アクセス/CTAの骨子を固める。
- STEP 2 — UI生成（v0 または Figma Make）： STEP 1の構成をv0に貼り付けて「このLP構成でモダンなUIを生成して。カラーは暖色系で」と指示。React/Tailwindのコードとプレビューが出力される。詳細は v0の使い方 を参照。
- STEP 3 — エージェント実装（Claude Code / Antigravity）： 生成コードをGitHubに置き、Claude CodeまたはAntigravityに「お問い合わせフォームをWeb3Forms連携で実装して。バリデーションつき。デザインは既存に合わせて」と指示。
- STEP 4 — 動作確認： ローカルで起動し、フォーム送信・スマホ表示・表示速度を自分で確認。AIの生成物は必ず人間が検証する。
- STEP 5 — 公開・納品（Vercel）： GitHubリポジトリをVercelに接続してデプロイ。カスタムドメインを設定して公開URLをクライアントに納品。
受注の取り方・ヒアリングシート・見積り書は 受注ガイド2026 にまとめています。
収益モデル：制作費＋月額保守で継続収益に
「作って納品」副業で稼ぎ続けるカギは、単発で終わらせず月額保守をセットにすることです。
| 収益の種類 | 相場目安（2026年6月・規模による） | 内容 |
|---|---|---|
| LP制作（1ページ） | 3万〜15万円（目安） | 構成〜公開まで一式。規模・クオリティによる |
| HP制作（複数ページ） | 10万〜50万円（目安） | トップ＋複数ページ。規模・機能量による |
| 月額保守 | 1万〜5万円/月（目安） | 文言・画像更新・障害対応・SEO微調整 等 |
注：上記はあくまで目安です。実際の単価はクライアントの規模・要件・あなたの実績によって大きく変わります。保証額ではありません。
月額保守5クライアントで月5万円というように、積み上げ型の収益になります。最初の1〜3件は実績づくりのため低価格から入り、ポートフォリオができたら単価を上げていくのが現実的な道筋です。
収益化の詳細な設計（契約書・価格設定・交渉の進め方）は 実践パッケージ（有料） に収録しています。
始める前の準備（アカウント・費用・環境）
副業スタートに最低限必要なものを整理します。
- アカウント（無料で可）：ChatGPT（無料枠）、Vercel（無料枠）、GitHub（無料）、Google Antigravity（個人無料プレビュー）
- 有料ツール（月数千〜2万円台が目安）：ChatGPT Plus（約$20/月）、v0 Pro（約$20/月）。最初は無料枠で試し、受注が決まったタイミングでアップグレードする人が多い
- 作業PC：最近の普通のPCなら問題なし。ローカルでのNode.js実行環境（npm）があると捗るが、Antigravityならブラウザのみでも可
- 副業確認：会社の就業規則で副業が禁止されていないか確認する。年間所得20万円超は確定申告が必要
最短の始め方3ステップ
- 自分用のLPを1枚作る：「陽だまり珈琲（架空のカフェ）のLP」という題材でChatGPT→v0→Vercelの一連を一度通す。受注前に自分で完成物を持つことが信頼につながる
- 作例をSNS・クラウドソーシングで公開する：制作した実物URLをクラウドワークス・ランサーズのプロフィールやXに掲載。「こんなものが作れます」を見せるのが最速の集客
- 最初の1件を低価格で受注する：3万円前後の案件から始め、受注〜納品〜月額保守の一連を経験する。実績とフィードバックが次の単価アップにつながる
受注先の探し方・プラットフォーム比較は 受注ガイド と LP/HP制作プラン を参照してください。
注意点と安全設定
- AIの生成物をそのまま納品しない：ファクトチェック・動作確認・デザインの最終確認は人間が行う。最終責任は制作者が持つ
- 機密情報をAIに渡さない：クライアントの顧客データや社外秘情報をChatGPTやClaude Codeに入力しない。業務利用ならTeamプランや社内ガイドラインを確認する
- Claude Codeの安全設定：PCのファイル操作を任せる場合は
.claude/settings.jsonのdenyリストで危険なコマンドを制限する。詳細は Claude Codeツールページ を参照 - 著作権：AIが生成した画像・コードの商用利用条件は各ツールの規約による。納品前に必ず確認する
スタート前チェックリスト
- ☐ ChatGPTのアカウントを作成し、LP構成案を1つ生成してみた
- ☐ v0またはAntigravityで簡単なUIを1枚生成してみた
- ☐ GitHubアカウントを作成した
- ☐ Vercelにサインアップし、テスト用ページを公開してみた
- ☐ 架空テーマでLP1枚を最後まで作って公開URLを得た
- ☐ 会社の就業規則で副業が禁止されていないか確認した
- ☐ 月額保守の価格設定イメージが決まっている（目安で可）
- ☐ 作り方詳細記事を読んだ
よくある不安・FAQ
コードが全く書けなくても本当に大丈夫？
はい。v0が生成するコードをコピペする・AntigravityやClaude Codeに指示するだけで動くものが作れます。ただし、エラーが出たときに何が起きているかを理解する最低限のリテラシーは必要です。最初のうちは「エラー文をClaude Codeに貼り付けて直してもらう」という手順で対処できます。
最初の受注はどこで取ればいい？
クラウドワークス・ランサーズがハードルが低く、実績ゼロでも提案できます。知人・友人の店舗やフリーランス向けのSNS（X）からの問い合わせも有効です。詳しくは 受注ガイド2026 を参照してください。
稼げるまでどのくらいかかる？
個人差があります。スキル習得に1〜2週間、初受注まで1〜2ヶ月、月額保守が複数件積み上がるまで3〜6ヶ月というケースが多いようです（本人申告ベース。保証値ではありません）。
月額保守はどうやって設計するの？
制作単価とセットで提案するのが基本です。「月1万円で文言・画像の更新を月2回まで対応」という形が入りやすいです。契約書の雛形や価格設定の詳細は 実践パッケージ（有料） に収録しています。
v0とClaude Codeはどちらを使えばいい？
UI生成の起点はv0が速く、複数ファイルを跨いだ実装修正はClaude Codeが得意です。両方を使い分けるのが現実的です。未経験の入口にはAntigravity（個人無料）も有力な選択肢です。詳細は v0の使い方 と Claude Codeページ を参照してください。
出典・参照：Vercel 公式（vercel.com）、v0 公式（v0.dev）、Claude 公式（claude.ai）。本記事の情報は2026年6月時点のものです。料金・機能・提供状況は変動しますので、契約前に必ず各公式サイトでご確認ください。