【解説】Studio.Dropの使い方とAI時代のWeb制作｜チャットでサイトを更新する

「サイトの文言を少し変えたいだけなのに、毎回制作者に連絡するのが申し訳ない」「依頼された側も、小さな修正のたびに手が止まってしまう」——サイトを納品したあとの更新は、発注者にとっても制作者にとっても負担になりがちです。2026年9月に発表されたStudio.Dropは、この「更新のめんどうくささ」に正面から向き合ったプラットフォームです。この記事では、Studio.Dropで何ができるのかを整理したうえで、AIでのサイト制作との違い、そしてこれからの制作者に求められる役割の変化までを解説します。なお本記事の内容は、150名以上が参加するノーコードコミュニティ「ノーコードサロン」に集まる制作現場の知見をもとに、実際に触れて分かったことを優先して整理しています。

結論：Studio.Dropは「作る道具」ではなく「更新を続ける道具」

Studio.Dropを一言でいうと、既存のWebサイトをAIで動かせる状態に変換し、チャットで更新し続けられるようにするプラットフォームです。Studio株式会社が2026年9月1日に発表し、現在はクローズドβとして招待制で提供されています。

ここで押さえておきたいのは、狙いが新規制作ではないことです。公式にも、URLを入力するだけで今のWebサイトをそのまま移行できる点が前面に出されています。つまり主な対象は、すでに公開されていて、更新が止まってしまっているサイトです。WordPressで作ったものの誰も触れなくなったサイト、制作会社に頼まないと1行も変えられないサイト。そうした資産を、もう一度動かせる状態に戻すための道具だと捉えると理解しやすくなります。

Studioそのものの基本的な考え方については、Studioの基本的な使い方もあわせて確認してください。

移行の入口3つ

公式では、Studio.Dropへの入口として次の3つが示されています。

出典：Studio公式「Agentic Web Platform「Studio.Drop」を発表。クローズドβ事前登録を開始」

入口1：URLインポート

公式の説明では「あなたのサイトのURLを入力するだけで、そのまま移行。サイトの構造から色・余白・語り口といったデザインの世界観までを読み取り、運用の軸を作ります」とされています。既存サイトを持っている場合の基本の入口です。

入口2：ファイルドロップ

「コードで作られたサイトやコンテンツも、アップロードするだけで動く形のまま取り込めます」とされています。URLで公開されていない制作物も持ち込めます。

入口3：プロンプト

「自然言語でのサイト制作にも対応。作りたいものを言葉で伝えれば、新しいサイトをゼロから立ち上げることもできます」とされています。既存サイトがなくても始められる入口です。

Studio.Dropでできること3つ

できること1：チャットで指示するだけでサイトが変わる

Studio.Dropの編集画面には、左側に縦長のチャット欄があります。ここに日本語で指示を書くと、サイトがその通りに変わります。実際に触れてみると、この手触りが一番大きな違いでした。

たとえば次のような指示がそのまま通ります。

• ボタンの色を青から緑に変えて
• トップの見出しを「初めての方へ」に変えて
• この画像をロゴとして追加して
• お問い合わせの文章をもう少しやわらかい言い方にして

出典：Studio公式「Agentic Web Platform「Studio.Drop」を発表。クローズドβ事前登録を開始」

公式ではこの機能をAI Editと呼び、「「新規でキャンペーンLPを作りたい」「ブログを立ち上げたい」など、日本語での指示でサイトを更新できます。大きな変更も、スピーディに形に」と説明されています。文言の修正だけでなく、ページの新規作成まで指示の範囲に入ります。

Studioの操作を知らない人でも、言葉にできれば変更できます。スマートフォンの音声入力を使えば、口頭で伝えるだけでサイトが更新されます。「どのボタンを押せばいいか」を覚える必要がなくなり、「何をどうしたいか」だけ伝えればよくなるという点が、従来の編集画面との決定的な違いです。

できること2：ノーコード編集とコード編集も残っている

チャットだけがすべてではありません。Studio.Dropには、従来通りマウスで要素を動かして整えるDesign Mode、HTML/CSSを直接触れるDeveloper Modeも用意されています。チャットで大枠を作り、細部はDesign Modeで整える、といった併用ができます。

出典：Studio公式「Agentic Web Platform「Studio.Drop」を発表。クローズドβ事前登録を開始」

Design Modeは公式で「Studioで培ったノーコード編集の感覚で、サイトを見たまま編集。文字の大きさや余白のひとつまで、思い通りに仕上げられます」と説明されています。これまでStudioを触ってきた人なら、操作感はそのまま持ち込めます。

この構成には意味があります。チャットは「何をしたいか」が明確なときに速い一方、数ピクセル単位の調整や、微妙な余白の詰め方は、手で触ったほうが早い場面もあるからです。用途によって持ち替えられる設計になっています。

できること3：外部のAIエージェントからも動かせる

Studio.DropはMCPに対応しており、Claude CodeやCodexといった外部のAIエージェントから直接サイトを操作できます。Studioの画面を開かずに、普段使っているAIとの会話の中でサイトを更新できるということです。

出典：Studio公式「Agentic Web Platform「Studio.Drop」を発表。クローズドβ事前登録を開始」

公式の説明では「ClaudeやCodexなど普段使いのAIエージェントとサイトを接続。サイト編集や記事の更新はもちろん、データ分析やフォーム管理など、WebサイトのあらゆるタスクをAIとの対話の中で実行できます」とされています。編集だけでなく、分析やフォーム管理まで射程に入っている点が特徴です。

この点は制作者側にとって特に大きな変化です。AIを使った制作の考え方については、StudioとAI（Claude Code）の使い分けで整理しています。実際にAIでLP制作に挑戦した記録はCodexでLP制作に初挑戦した記事にまとめています。

これまでのAIサイト制作との違い2つ

違い1：これまでは「作る」ためのAIだった

これまでもAIでWebサイトを作ることはできました。プロンプトを書けばコードが生成され、それを配置すればサイトになります。ただし、この方法には前提条件がありました。生成されたコードを読めること、どこに何を置けばいいか分かること、公開の手順を知っていることです。つまり、ある程度の技術的な素養がないと扱えませんでした。

加えて、AIで作ったサイトは「作ったあと」が弱いという課題がありました。一度出来上がったものに手を入れようとすると、また同じだけの知識が必要になります。作るのは速くなっても、運用が続かないのです。

違い2：Studio.Dropは「更新し続ける」ためのAI

Studio.Dropが変えたのは、この後半部分です。生成して終わりではなく、公開されたサイトに対してチャットで指示を出し続けられます。コードを読む必要も、ファイルを置き換える必要もありません。

もう一つ重要なのは、操作する人を選ばない点です。AIでのサイト制作は、これまで制作者側の効率化の話でした。Studio.Dropは、発注したクライアント自身が触れるところまで射程に入っています。ここが本質的な違いです。

クライアントが自分で更新する時代に制作者がやること3つ

変化1：「作る」の価値は相対的に下がる

正直に書くと、サイトを一度組み上げる作業そのものの価値は、これから下がっていきます。チャットで指示すれば形になるなら、そこに以前と同じ金額を払う理由は弱くなるからです。これは受け入れるしかない変化です。

ただし、これは仕事がなくなるという話ではありません。価値が集まる場所が「作る瞬間」から「作ったあとの時間」へ移るということです。

変化2：価値が移る先は「伴走」

クライアントが自分で更新できるようになると、次のような困りごとが必ず出てきます。

• どう指示すれば思った通りに変わるのか分からない
• 変えてはいけない箇所を触ってしまった
• デザインの統一感が崩れてきた
• スマートフォンで表示が崩れていることに気づかなかった
• 公開前に何を確認すべきか判断できない

AIは指示通りに動かせますが、その変更が事業にとって正しいかどうかは判断しません。出来上がったものを見て違和感に気づくには、デザインの知識と制作の経験が必要です。ここが人の仕事として残ります。

具体的には、AIに渡すデザインルールを整える、触ってよい範囲と触らない範囲を切り分ける、公開前のチェック項目を用意する、月に一度は第三者の目で品質を見る、といった関わり方です。納品して終わりではなく、更新し続ける体制をクライアントと一緒に作る仕事になります。

案件の進め方や納品の実務については、Studioでサイト制作案件を納品する方法もあわせて参考にしてください。

変化3：Studioを使ってきた経験はそのまま強みになる

Studio.Dropが出たことで、これまでのStudioの知識が無駄になるわけではありません。むしろ逆です。AIが作ったレイアウトの違和感に気づけるのも、運用しやすいCMS構造を設計できるのも、クライアントがつまずく場所を先回りできるのも、Studioを触ってきた経験があるからです。

AIは作業を進められますが、出てきたものが良いかどうかの判断はできません。判断できる人が、これからより必要とされます。ノーコードの学習全体像はノーコードWeb制作の独学ロードマップで整理しています。

つまずきやすいポイントと対処法3つ

対処法1：指示が曖昧だと意図と違う結果になる

「いい感じにして」のような指示は、期待と違う結果になりがちです。対象と、どうしたいかをセットで伝えると精度が上がります。「トップのボタン」「文字を大きく」のように、場所と変更内容を分けて書くのがコツです。

対処法2：変更範囲が広がりすぎることがある

サイト全体に対する指示は、意図しない箇所まで変わることがあります。最初は1ページ、1要素から試して、変化の範囲を確かめながら進めるのが安全です。

対処法3：クライアントに渡す前にルールを決めておく

そのまま渡すと、統一感が崩れる原因になります。色やフォントの指定、変更してよいページの範囲、公開前に相談してほしい変更の種類を、あらかじめ文書にしておくとトラブルを避けられます。この「渡し方の設計」自体が、これからの制作者の仕事です。

よくある質問5つ

質問1：Studio.Dropは今すぐ使えますか

2026年9月時点ではクローズドβとして招待制で提供されています。公式サイトで事前登録を受け付けており、順次案内される形です。

質問2：今あるStudioのサイトはどうなりますか

従来のStudioがなくなるわけではありません。Studio.Dropは既存サイトを取り込んでAIで動かせる状態にするもので、Studioで作ったサイトの運用方法の選択肢が増えたと捉えるのが実態に近いです。

質問3：WordPressのサイトも移行できますか

公式には、URLを入力するだけで今のWebサイトをそのまま移行できるとされています。更新が止まったWordPressサイトは主要な想定対象の一つです。ただし複雑な機能を持つサイトほど確認事項は増えるため、移行後の検証は必要です。

質問4：クライアントが自分で更新すると、制作者の仕事は減りませんか

細かな修正の代行は減ります。一方で、指示の出し方の設計、デザインルールの整備、品質チェック、公開前の確認といった仕事が増えます。単価の付け方を「制作費」から「運用支援」へ組み替えられるかどうかが分かれ目になります。

質問5：デザインの知識がなくても使えますか

操作という意味では使えます。ただし、出来上がったものが適切かどうかの判断には知識が要ります。作れることと、良し悪しを見極められることは別の能力です。

まとめ

Studio.Dropは、チャットで指示するだけでサイトを更新できるプラットフォームです。狙いは新規制作ではなく、更新が止まったサイトを動かし続けられる状態にすることにあります。

この変化によって、サイトを組み上げる作業そのものの価値は下がります。同時に、AIが出したものを見極め、クライアントが安心して運用できる状態を作る仕事の価値は上がります。制作者の役割は「作る人」から「一緒に運用し続ける人」へ移っていきます。

ノーコードサロンでは、150名以上のメンバーがStudioでの制作ノウハウや、AIを組み合わせた運用の進め方を日々共有しています。Studio.Dropのような新しいツールが出たときも、実際に触った人の知見がコミュニティ内に集まります。学び方に迷ったときや、案件での判断に悩んだときに相談できる場として活用いただけます。