Studio.Dropを使ってみた|プロンプト1つでサイトを作成、料金・無料トライアル・向き不向き【2026年10月】

Studio.Dropを使ってみた|プロンプト1つでサイトを作成、料金・無料トライアル・向き不向き【2026年10月】

Studioは、技術がなくてもおしゃれなサイトが作れるノーコードツールです。そのStudio株式会社が、2026年9月に新サービス「Studio.Drop」を発表しました。今あるサイトをAIで取り込むことも、新しく作ることもでき、そのあとの更新までAIに話しかけるだけで進められます。

Studio.Dropの試用に参加して、実際にサイトを取り込んだり、シンプルなプロンプトを送って、架空のコーヒー焙煎所のサイトを作ったりしてみました。スクロールで月がコーヒーカップに変わる演出から、お問い合わせフォームまで、指示だけで形になりました。

MEMO:料金はStandardが月額4,980円(公開100ページまで)、Proが月額29,800円(ページ数の上限なし)で、無料トライアルは14日間です。

※Studio.Dropは2026年10月時点でクローズドβ(招待制)です。料金や仕様は今後変わる可能性があります。

Studio.Dropとは?Studioとの違い

Studio.Dropは、AIとの対話で、サイトを取り込んだり、作ったりして、更新・運用していくサービスです。始め方は3通りあります。

  • 運用中のサイトのURLを読み込んで、そのまま引き継ぐ
  • プロンプトを送って、新しく作る
  • ファイルをドロップして取り込む

ちなみに従来のStudioは、自分で画面を操作して作るノーコードツールです。Studio.Dropとは別のサービスで、料金体系も別です(従来のStudioには無料プランがあり、有料は年払いで月額590円〜)。SNSでは、Studioで作ったサイトに自分で決済をつないで、商品を販売している人も見かけます。

Studioトップページ
Studioの公式トップページ

Studioで販売する場合の決済サービスや手数料は、Studio(スタジオ)+決済サービスとは?料金・手数料・評判をまとめて解説でまとめています。

試用に参加するには

Studio.Dropの公式サイトから、クローズドβの「ウェイトリスト」に申し込みます。

Studio.Dropトップページ
Studio.Dropの公式トップページ

「今すぐ申し込む」を押すと申し込みフォームが表示されます。

Studio.Dropのウェイトリスト
Studio.Dropのクローズドβウェイトリスト申し込みフォーム

申し込みフォームで入力するのは、次の項目です。

  • 対象サイトのURL(必須)
  • 氏名、メールアドレス、職種(必須)
  • Xアカウント(任意)
  • Webサイトで実現したいこと(6つの選択肢から、当てはまるものをすべて選ぶ。必須)
  • 利用規約・プライバシーポリシーへの同意(必須)

初心者の方は、「対象サイトのURL」の欄で迷うかもしれません。すでにサイトを持っていないと、申し込めないように見えるからです。

わたしは、ちょうど企画もののサイトを考えていたので、取得したばかりのドメインを入力しました。サーバーに設定しただけで、サイトはまだない状態でしたが、クローズドβに招待してもらえました。9月1日に登録して、試用のリンクが届いたのは9月18日です。

Studioで独自ドメインを使う場合のメールやサーバーの設定は、Shopify・Studioで独自ドメインを使うときのメール設定とサーバー選び完全ガイドでまとめています。

招待の基準は公開されていないので、必ず届くとは言えません。ただ、「Studio.Drop 招待されない」で検索しても困っている声は見当たらなかったので、気軽に申し込んでみてもよさそうです。

なお、10月6日にStudioから届いたメールによると、ウェイトリストの登録者は2,000名以上で、登録した順に案内しているとのことです。

同じメールには、Studio.Dropを実際に触るオフラインのワークショップ「Open Hour」のご案内もありました。Studio株式会社のオフィス(東京都目黒区)で、火曜の18時から20時に開催され、参加費は無料、定員は先着50名です。次回は10月27日の回が予定されています(2026年10月15日時点)。
持ち物はパソコンと、取り込んでみたいサイトのURLです。参加した方には、クローズドβの先行案内が届くという特典もあります。オンラインでの申し込みに不安がある方は、Open Hourで直接相談してみるのもよさそうです。

Studioは定期的にオンラインでの講座やオフラインイベントを開催しています。一度イベントに申し込んでおくと、こうした案内が届くようになるので、とてもおすすめです!

今あるサイトを取り込む(WordPressで試した)

運用中のサイトのURLを入れると、そのまま取り込めます。このブログ「哲学カフェ」(WordPress)を通常モードで試したところ、取り込みは約23〜30分でした。
デザインも記事も、見た目はほぼ再現されましたが、お問い合わせフォームだけは移りませんでした。
手順はこんな感じです。画面中央の入力欄にURLを入れて「このサイトをインポート」ボタンをクリックします。

Studio.DropでURLを取り込むところ
「このサイトの所有者です(またはコンテンツを複製する権利があります)。」をチェックする必要があります。

するとこのような画面が現れます。Studioはこういう画面でも、細部までとても美しくデザインされています。

Studio.Dropでインポート中

全部で145ページ、高速モードを有効にすると10分くらい早く取り込めましたが、時間帯や混雑で違ってくるかと思います。

当サイトをStudio.Dropでインポートしたところ

ちなみに「AIが行ったこと」を開くと何をやったのか、詳細な項目が表示されます。

おそらく、シンプルなサイトであれば、もっと短時間で取り込めるでしょうね。

なお、従来のStudioを使っている方には気をつけていただきたいことがあります。Open Hourのイベントページに、旧基盤のStudioで作られたサイトは、現在取り込みに対応していないという注意書きがありました。Studioのサイトを持っている場合は、新基盤に移行してから取り込む必要があるとのことです。

簡単な文言修正も頼んでみた

取り込んだサイトで、AIに文字の置き換えも頼んでみました。銀行名の変更(住信SBIネット銀行からドコモSMTBネット銀行へ)を頼むと、AIは実行前に、全体で31か所を見つけて、「置き換える15か所」「判断が必要な10か所」「置き換えない6か所」に分けて見せてくれました。

ここでわかったのは、メタディスクリプションやタグ、タイトル、画像のALTなど、細かい項目まで指示する必要がある、ということです。まとめて一気に直すより、確認しながら少しずつ進める使い方の方が、今の時点では現実的かもしれません。

銀行の名前が変わった経緯は、BASEの振込手数料を減らす|銀行を変えるだけで年間1万円差でも触れています。

プロンプト1つで、サイトを作ってみた

題材は、架空のコーヒー焙煎所「月白珈琲焙煎所」です。店名も住所も人物も、すべて架空です。

最初に送ったプロンプトは次のとおりです。ブランド、ファーストビューの動き、本文、守ってほしいことの4つに分けて書いています。

このプロンプトはREIKOが提示したサンプルをもとにわたしが作っています。

架空の小さなコーヒー焙煎所「月白珈琲焙煎所」のサイトを作ってください。
写真がなくても成り立つように、イラストや図形はSVGとCSSで表現してください。

■ ブランド
- 住宅街にある、10席ほどの焙煎所兼カフェ。落ち着いた大人の常連が多い。
- 書体は見出しに明朝体(Google Fonts の Zen Old Mincho など)、本文はゴシック体。
- 色は生成り(#F3EEE4 前後)と深い焦げ茶(#3B2A20 前後)。差し色に淡い月色(#E8D9A8 前後)を少しだけ。
- 余白を広めにとり、静かで温かい印象にする。

■ ファーストビュー(スクロールに連動するアニメーション)
スクロール量に合わせて次の順に進める。動画は使わない。
1. 焦げ茶の背景に、細い三日月が浮かんでいる
2. 三日月が少しずつ満ちて、満月になる
3. 満月がコーヒーカップの形に変わり、湯気が立ちのぼる
4. 「今日の一杯を、ゆっくり。」のコピーと、「メニューを見る」ボタンが出る
- 動きを減らす設定(prefers-reduced-motion)では、最後の場面を静止表示にする。

■ 本文
- メニュー: 焙煎所について/メニュー/豆の販売/お知らせ/アクセス/お問い合わせ
- コーヒー豆6種(名前・産地・味の特徴・価格)をカードで並べる
- お知らせは3件。エディターの「記事」で追加・編集できるようにする
- アクセスは、住所・営業時間・定休日を表にする(住所は架空)
- お問い合わせフォーム(お名前・メールアドレス・内容)。送信内容が「Forms」に届くようにする

■ 守ってほしいこと
- 店名・住所・人物はすべて架空にする。
- PCとスマホの両方で崩れないこと。横スクロールを出さない。
- 見出しの前は広くあける。注意書きは小さく、色を変える。

まず作る内容のプランを見せてください。私が「進めて」と言ったら作ってください。

最後の一文のとおり、いきなり作らせず、先に制作プランを出してもらいました。

出てきたのは、「サイト構成」「デザイン」「ファーストビュー」「掲載内容」「操作性」の5項目です。プロンプトに書いていない404ページ(URLが間違っていたり、ページが削除されていたりするときに表示されるページです。)や、キーボード操作・文字のコントラストへの配慮も、入っていました。

Studio.Dropで制作プランを提示される
無料トライアルの期限が近づくと、メッセージが表示されます。

内容を確認して「進めてください」と返すと、サイトができあがりました。できあがるまでの時間は、約3分でした。

できたサイトには、スクロールで三日月が満月になり、さらにコーヒーカップへ変わる演出、豆6種のカード、お知らせ3件、アクセスの表、お問い合わせフォームが入っています。お知らせは、エディターの「記事」から追加・編集できます。

スクロールに合わせて、三日月が満月になり、コーヒーカップに変わります。架空のサイトです。

なお、ここでは写真は使わず、テスト用にあえてシンプルなレイアウトにしています。

そのあと、パソコン表示で見出しの改行位置が不自然だったので「月のように、」「静かに満ちる時間。」の2行にするよう頼むと、直してくれました。(動画は修正後のものです。)

あわせてプレビュー用のURLを使ってスマートフォンでも表示をチェックしました。改行を変えると、文字と月のバランスが気になったので「20pxくらいに縮めてもらえますか」と、数字で具体的に指示しました。「少し」だと何度も直すことになりそうだったからです。

スマートフォンでの表示を修正しているところ
指示はパソコンで行います。

以下は、修正前と修正後です。文字色が違って見えるのは、スクリーンショットを撮ったタイミングの違いによるものです。これは比較的画面が小さいiPhone SEでの表示なので、もっと画面が大きいスマートフォンであればまた違って見えます。

スマートフォンで見たときに、余白が多いと感じたところ
スマートフォンでの余白を詰めたところ

念のため、プレビューでお問い合わせフォームから「送信する」ボタンを押してみましたが、送信はされず、下記のページが表示されました。無料トライアル中はサイトを公開できないため、実際に送信を受け付けられるのは有料プランで公開したあとのようです。

Studio.Dropのお問い合わせフォーム
Studio.Dropのお問い合わせフォームに送信をしたときに表示された画面

作ってみて、Studioは白紙からプロンプトで作るより、取り込みから始めることを勧めているように感じました。今の時点では、よくできたプロンプトを探すより、ある程度形にした自分のサイトを取り込んでカスタマイズする方が楽だと思います。白紙から作る方法も、AIの進化を考えると、すぐに簡単になりそうですね。

料金と14日間の無料トライアル

料金は2プランです。無料トライアルは14日間です。

プラン月額(税込)対象
Standard4,980円公開100ページまで
Pro29,800円ページ数の上限なし

試用の申し込み時に予約したオンライン説明会(Google Meet)で、担当の方に確認した金額です(2026年9月時点)。

無料トライアルは、プロジェクトを新規作成すると始まります。作成画面には、「カード不要の14日間無料トライアルが始まります。プランは課金を始めるときに選びます。」と表示されます。

画面の右上に、期限が表示されます。10月6日に新しく作ったプロジェクトには、「無料トライアルは2026年10月20日までです」と出ました。以前に作ったプロジェクトとは期限が違うので、プロジェクトごとに数えられているようです。

AIは、プランごとの月の枠(クレジット)の中で使えます。くわしくは次の節で説明します。

AIの料金は?利用量には上限がある

AIを使う量は、「クレジット」で管理されています。プロジェクトごとの月の枠で、毎月1日(UTC)にリセットされます。日本時間では、1日の朝9時です。トークン数は非公開で、ProはStandardの約6倍とのことです。

枠を使い切ると、性能の低いAIに切り替わって編集を続けられます。さらに一定量を使うと翌月まで停止しますが、手動での編集と公開は、停止中もできます。

自分で契約しているAIを使う場合は、APIキーを登録するのではなく、MCPで接続します。Claude CodeやCursorなど、MCPに対応したツールなら、月額契約のまま使えます。追加料金はありませんし、Studio.Dropのクレジットも消費しません。(Studioのご担当者による情報です。クローズドβのため、今後変わる可能性があります)

Studio.Drop内で使うAIモデルは、画面で「高性能」「標準」「軽量」の3段階から選べます。わたしの画面では、どれもGPT系のモデル名が表示されていました。

Studio.Dropで利用しているAIモデル

おっ!全部わたしのモデルじゃないか。

実際はClaudeさん含め色んなモデルを利用していると聞きましたよ!
なお、↑の左の円のアイコンで、今月あとどのくらい使えるかの目安がわかります。

どんな人に向いている?

作りたいもの判定理由
LP・数ページの紹介サイト○指示だけできれいに作れた(架空の焙煎所)
お店や教室の案内サイト○お問い合わせフォームも作れた
ページ数をどんどん増やすサイト(ブログなど)△(費用に注意)Standardは公開100ページまで。超えるとProの月額29,800円。記事を増やしていく使い方は、公式でも紹介されている

WEBデザイナーとしてのわたしの感想

今回試した範囲では、LPやお店の案内サイトを作る用途で使いやすさを感じました。哲学カフェのように記事を増やし続けるサイトなら、記事が増えたときの費用を考えて、わたしはWordPressを選びます。ただ、費用がかかっても、AIに話しかけて更新できるほうが楽だと感じる方には、Studio.Dropをおすすめします。

WordPressは以前より使いやすくなりましたが、どうしても苦手に感じる人は一定数います。実際に、クライアントからのお仕事で、更新が楽で費用も安いという理由から、WordPressではなくStudioで作ることを提案し、快諾していただいたこともあります。

Studio.Dropなら、大きな修正をしなければ、プランに含まれるAIの枠で足りそうなので、別にAIを契約する必要もありません。更新を苦手に感じるクライアントには、選択肢のひとつとして提案できそうです。

まとめ

  • Studio.Dropは、いまあるサイトを取り込んだり、新しく作ったりして、そのあとの更新までAIとの対話で進められるサービスです。
  • 料金はStandardが月額4,980円(公開100ページまで)、Proが月額29,800円(ページ数の上限なし)。クレジットカード不要で、14日間無料で試せます。
  • 2026年10月時点はクローズドβで、ウェイトリストに登録して招待を待ちます。
  • LPや数ページの紹介サイトに向いています。ページ数が多くなるサイトは、Proプランの費用も含めて検討するとよさそうです。
  • 今の時点では、白紙からAIに指示して作るよりも、Studioの新基盤などで先にサイトの形を作り、それを取り込んで調整する方が取り組みやすいのでは、とわたしは予想しています。

今後の予定

今回はStudio.Dropだけを試しました。今後は、Claude DesignやClaude Code(MCPで接続)なども使って比べてみる予定です。
もしリクエストがあれば、お気軽にメッセージをくださいね!