外注前に、自分で叩き台を作る。ノーコードAI「Framer」で発注コストと内製の見極めをつける

アイキャッチ: 外注前に、自分で叩き台を作る — ノーコードAI「Framer」で発注コストと内製を見極める

執筆者:

カテゴリ:

採用ページを1枚作りたい、展示会告知のLPが要る、補助金採択の告知ページを社内外に出したい——こういう「小さいけど急ぎのWebページ」が発生するたび、一人DX担当は制作会社への発注か、自分でどうにかするかの二択に迫られていないでしょうか。発注するにしても「イメージをうまく伝えられず、提案が的外れに返ってきて手戻りになる」のはよくある話です。

Framerが公式に提供するAIサイト生成機能は、この「発注前にイメージを形にする」工程をノーコードで済ませられるツールです。以下、Framer公式サイト(Framer AIFeaturesPricing)の内容を、実務での使いどころに翻訳します。

動画: Framer公式YouTubeチャンネル「Generation, layout, and styling with Framer Agents」(英語)

1. 何をしてくれる機能か

Framerの実際の編集画面。右側のAgentパネルにプロンプトを入力すると、AIがページのレイアウト変更や画像差し替えを実行し、編集内容が左のキャンバスに反映される
出典: Framer公式サイト「Framer AI」(2026-07-08時点の実画面・英語UI)
  • プロンプトで「作りたいページ」を説明すると、AIエージェントが編集可能なページ(レイアウト・コピー・ビジュアル込み)を生成する(Framer AI
  • 生成後はキャンバス上でレイアウト・セクション・ビジュアルスタイルをAIに指示して直接調整できる
  • 「コントラスト不足・タイポ・alt属性の欠落・SEO上の問題・スタイルの不統一」をAIが自動で検出して修正提案するサイト審査機能がある(同上)
  • CMS(コンテンツ管理)機能を備え、Notion・WordPress・外部APIからのコンテンツ取り込みにも対応(Features
  • SEO関連(メタデータ・ソーシャルプレビュー・URL管理)を一元管理でき、パフォーマンス面では Core Web Vitals 実測値として LCP 1.1秒・INP 95ミリ秒・CLS 0.01 を公称(同上)
  • ホスティング込みで稼働率99.99%を公称。Claude Code・Cursor・GitHub等の外部AIツールからサイト操作する連携も用意されている(同上)

「デザインツール」ではなく「要件を言葉で伝えると動くページが返ってくる」設計になっている点が、Webデザインの専門知識がない一人DX担当にとっての実務的な違いです。

2. 使い方

作りたいページの目的・要素(例:「新商品の告知ページ。ヒーロー画像・特長3点・問い合わせボタンが欲しい」)をプロンプトとして入力すると、AIエージェントが編集可能なページ案を生成します。そこからキャンバス上で文言修正やレイアウト調整を加えていく流れです。ローカライズ機能(Auto Translate)を有効にすると、既存ページの多言語展開もAIが自動翻訳で追随します(Auto Translate ヘルプ)。Framer公式ヘルプによると、Localization機能は238言語・地域変種に対応しています(対応言語一覧)が、この一覧ページから日本語(Japanese)が明示的に含まれるかは今回のページ取得では確認しきれませんでした。日本語ページの多言語運用を検討する場合は、自社サイトのロケール設定画面で対応言語を直接確認してください。

3. 料金プラン(2026-07-08更新・日本円表示)

プラン 月額(月払い) 月額(年払い時) AIクレジット CMSコレクション 帯域幅 備考
Free ¥0 ¥0 500(お試し) 1GB Framerドメインのみ
Basic ¥1,540 ¥1,027 1,000/月〜 2 50GB カスタムドメイン無料
Pro ¥4,620 ¥3,081 3,000/月〜 10 100GB ステージング環境あり
Enterprise 個別見積もり カスタム カスタム カスタム エディター数などカスタム

Framer Pricingより・2026-07-08確認。追加エディター席は月払い¥3,080/月・年払い¥2,054/月。AI機能の利用は月次の「クレジット」制で、上位のクレジット枠を選ぶと月額も上がります)

訂正(2026-07-08): 公開時の本記事は「料金ページに日本円表示はなく米ドル建てのみ」と記載していましたが、現在の公式料金ページは日本語環境からのアクセスで日本円表示になることを確認しました。プラン内容もAIクレジット制を前提とした構成に変わっているため、上表を現行の公式表示に合わせて更新しています。契約前に必ず公式ページの最新表示をご確認ください。

Framer公式料金ページの実際の画面(年払い表示)。Free・Basic・Proの3プランと各プランのAIクレジット数・CMSコレクション数・帯域幅が表示されている
出典: Framer公式サイト「Pricing」(2026-07-08時点の実画面・年払い表示)

4. 一人DX担当の業務でどう変わるか

一般的なWeb制作の工程は「要件定義→デザイン初稿→レビュー・修正→実装→公開」と進みますが、一人DX担当が最も消耗しやすいのは「要件定義」を言葉だけで制作会社に伝えきれず、初稿が的外れに返ってきて手戻りが発生する部分です。

  • 発注前の”叩き台”としての使い方: プロンプトを打ち込むだけで、ラフなページ案がその場ででき上がります。これを「こういうイメージで作ってほしい」という視覚化された発注仕様書として制作会社に渡せば、初回提案の的外れ度が下がり、修正往復の回数を減らせる可能性があります
  • 小規模ページの内製化: 採用ページ・単発イベント告知・補助金採択のお知らせ等、更新頻度が低く独立したページであれば、Framerだけで公開まで完結できる場合があります。月額約¥1,000(年払い時)〜で、社内稟議のハードルも低めです
  • ただし全部を内製に置き換えられるわけではない: 会社全体のブランド一貫性、複雑な業務システム連携、SEO設計の全体最適が絠む本格的なコーポレートサイト刷新は、専門家の設計判断が引き続き必要な領域です。Framerは「発注前の可視化」と「小さく完結するページ」を担う道具、という位置づけで捉えるのが実務的です

5. 次の一手

「このページ、Framerで内製できる規模なのか、それとも制作会社に頼むべき規模なのか」は、実は制作の現場を知らないと切り分けが難しい判断です。見誤ると「内製したが結局作り直しで外注した」「逆に小さな案件を高い制作費で発注してしまった」という二種類の損が起こり得ます。

「うちのこのページ、内製と外注どちらが合うか」を一度整理したい方は、無料30分のヒアリングで具体的に検討できます。無料30分ヒアリングの詳細はこちら


開示: 本記事はFramerの紹介記事です。Framerには公式に紹介報酬プログラム(エージェンシー向けに紹介1件あたり最大50%のコミッションを公称。Framer for agenciesアフィリエイトリンクの仕組み)が存在しますが、First CH合同会社は執筆時点(2026-07-07)でこのプログラムへの登録手続きを完了していません(poc-plan.md G0’チェックリストのPartnerStack/Impact等アフィリ基盤登録が未完了のため)。本文中のリンクはすべて公式サイトへの直接リンクであり、アフィリエイトリンクではありません。登録完了後、アフィリエイトリンクへ差し替える場合は改めてPR表記(プロモーションを含む旨の明記)を追加します。また、First CH合同会社自体もWeb制作を受託する事業者であり、本記事の「内製 or 外注の見極め」という切り口には利益相反となりうる要素が含まれる旨をここに明記します。

コメント

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です