Studio.Design

Studio.Designとは？

Studio.Design（公式ページでの表記はStudioまたはSTUDIO）は、ブラウザ上で動くノーコードWebサイト制作ツールです。ページを視覚的にレイアウトし、内蔵のCMSでコンテンツを管理して、同社運営のホスティングに公開します。ホームページは、アイデアをWebサイトにする最も簡単で速いデザインツールで、コード不要、表現も完全に自由だとうたっています。

提供元はSTUDIO Inc.で、利用規約には東京都渋谷区恵比寿の所在地が記載されています。日本のテック系メディアは、2017年4月のβ版公開から約1年を経た2018年4月2日に正式ローンチしたと報じ、創業者として石井穰氏と甲斐啓真氏らの名前を挙げています。

日本語サイトは、ユーザー数90万人以上、公開サイト数22万件以上、導入企業数3万社以上をうたっています（2026年10月6日取得）。同社自身の数字で、第三者の集計ではありません。英語サイトと日本語サイトでは掲載範囲も異なり、英語ページは中核のサイト制作機能を米ドル価格で紹介し、日本語ページには円建て価格、Enterpriseプラン、多数の企業導入事例が加わります。

主な機能

デザインエディタ

• ボックスレイアウトとシンボル： ボックスを積み重ねてレイアウトを組み、余白はキャンバス上のドラッグ操作で調整します。繰り返す要素は再利用可能なシンボルにでき、レスポンシブの各ブレイクポイントもCSSではなく視覚的に調整します。
• チーム編集： 複数人で同時に編集でき、コンテンツ編集モードでは編集担当者がデザインを崩さずにテキストや画像を変更できます。コメントのスレッドもエディタ内にあります。
• フォント： 英語版のエディタ紹介ページは、900種類以上のフォントが追加料金なしとうたっています。日本語版の同ページはずっと多い9,200種類以上の無料フォントを挙げ、モリサワ（TypeSquare）、Google Fonts、カスタムフォント、システムフォントを含むとしています。2つの公式ページは食い違っています。
• 実データと埋め込み： デザインにNotionやAirtableのデータを取り込めるほか、iframeでGoogle MapsやYouTubeなどのサービスを埋め込めます。
• テンプレート： テンプレートストアには外部デザイナーによる無料・有料のデザインがあり、コードなしでカスタマイズできます。

CMS、ホスティング、フォーム、SEO

• CMS： プロパティ設定に至るまでのリアルタイム共同編集、アプリを閉じていても実行される予約公開、WordPressコンテンツのワンクリックインポートに対応します。
• 公開： ワンクリックで、サーバー設定なしにデザインを本番サイトにできます。全サイトに自動でSSLが付き、ホスティング紹介ページは稼働率99.9%をうたっています。
• フォーム： ドラッグ＆ドロップでフォームを配置して独自の項目を設定でき、送信内容はGoogle Sheetsに同期できます。スパム対策としてGoogle reCAPTCHAも使えます。
• SEO設定： リダイレクト、自動生成されるXMLサイトマップ、ページごとのタイトル・ディスクリプション・ファビコン・OGPタグの設定が、Google Search Console、Google Tag Manager、Google Analytics、HubSpotとの連携設定と並んでいます。

モーションとFigmaインポート

• Lottie： LottieボックスにdotLottieまたはLottie JSONのURLを指定でき、再生は自動再生、表示時に開始、ホバー時やクリック時に再生、スクロールやカーソル位置との同期から選べます。
• FigmaからWebサイトへの取り込み： Figma to STUDIOプラグインでFigmaのフレームをエディタにコピーします。Studioによると、取り込んだデザインは自動でレスポンシブになり、画像、アイコン、フォント、カラーも一緒に引き継がれます。

エディタ内のAIツール

ヘルプセンターには5つのAI機能が記載されています。画像AIは自然言語の指示で画像を編集し、参考画像で方向づけることもできます。テキストAIはプロンプトから文章の下書きや書き直しを行い、翻訳もできます。オートレスポンシブは完成したデスクトップ用レイアウトにブレイクポイント設定を適用し、レイヤー名変更は汎用的なレイヤー名を置き換えます。SEOライティングアシストは、ページ上のテキストからページタイトルとメタディスクリプションの下書きを作ります。

Studio.Assistant

Studio.Assistantは、デザインエディタとは別に専用の有料プランを持つAIサイト生成ツールです。入力した情報をもとに、サイトの情報設計からデザイン案までを生成し、デザインエディタに書き出して仕上げ、公開します。日本語の製品ページは、人が画面上で出力を調整する前提のツールと位置づけ、AIエージェントのようにワークフローを自律的に完結させるものではないと明記しています。

ガイド

Figmaデザインを取り込む

1. FigmaにFigma to STUDIOプラグインをインストールします。
2. ファイルを準備します。取り込みのコツでは、オートレイアウトの使用と、イラストや画像用のレイヤー名の先頭に <img> を付けることが推奨されています。
3. フレームを選択してコピーします。レイヤーの多いページはセクションごとに分けて取り込めます。
4. Studioのエディタにデザインを貼り付けて取り込みを完了します。

Studio.Assistantでサイト案を作る

1. 新規プロジェクトを作成（または既存のものを開き）、Assistantを選択します。
2. サイトの概要を入力します：名前、目的、カテゴリー、説明、現在のURL、写真検索用のキーワード。
3. コンテンツタイプのスライダーで、テキストと写真のバランス、文章の訴求の強さ、生成するページ数を設定します。
4. ロゴと画像素材をPNG、JPG、SVGでアップロードします。サイトのキーカラーはロゴから取得できます。
5. 「デザインを生成」を選択します。ページが順に表示され、生成中は既存のサイトが閲覧専用になります。
6. サイトマップ画面でページの追加、削除、並べ替えを行い、デザインエディタに書き出して細部を編集し、公開します。

活用例

• 1ページサイトとポートフォリオ： 有料プランはサイトの種類ごとに位置づけられ、Miniは1ページサイト、Personalはポートフォリオ、Businessはスタートアップ、Business Plusは成長期の企業向けです。StudioをLP制作ツールとして使った単体のキャンペーンページなら、Miniの上限である2ページと404ページに収まります。
• 大企業内のランディングページ： ベンダーの導入事例では、東日本旅客鉄道がjreast.co.jp ドメイン配下に複数のランディングページサイトを制作し、ワークスペースで多数の関係者の権限を管理しています。
• 複数の企業サイトの統合： 別のベンダー事例は、伊藤忠商事が14サイトの管理をStudioに一本化し、コストを40%削減したという見出しになっています。
• 制作会社や営業での提案： Studio.Assistantは営業担当者やディレクター向けに、デザイン案を素早く複数作り、提案の検討中に実際に動くWebサイトとして共有する用途で打ち出されています。
• WordPressからの移行： WordPressの投稿、固定ページ、カテゴリー、タグはXMLエクスポートから取り込めますが、デザインとサイト設定は引き継がれないため、移行後にページ構成、デザイン、CMS設定、URL、リダイレクトの確認が必要です。

導入事例の成果は、Studioが掲載した顧客自身の説明で、第三者の測定ではありません。

対象ユーザー

向いている人

• コードを書かずにサイトを公開したいデザイナー。2018年のローンチ時、共同創業者はターゲットを、単に何らかのWebサイトがほしい個人や小規模企業ではなく、デザインが専門でもコーディングのスキルがない事業者だと説明していました。
• グラフィックデザイナー、制作会社、UXデザイナー。ホームページの顧客ストーリーには、グラフィックデザイナー、制作会社、UXデザイナー、UXデザインを学ぶ学生が登場します。
• 企業やチーム、特に日本の利用者。日本語のFAQは、チームでの利用には権限管理や公開後の運用のためにBusinessまたはBusiness Plusを、より大規模な運用、監査やセキュリティの要件、個別サポートが必要な場合はEnterpriseを案内しています。

向いていない人

• ネットショップや会員制サイト。必要な機能をStudioは非対応として挙げています。
• サイトのコードを他所へ持ち出したり、タブレット・スマートフォンで編集したりする必要がある人。どちらもヘルプセンターで不可とされています（プラットフォームと制限事項を参照）。

プラットフォーム

• 編集環境： デザインエディタとプロジェクトのダッシュボードは、デスクトップ版Google Chromeのみに対応します。他のブラウザは非対応で、タブレットやスマートフォンでは編集できません。
• サイトの公開先： Freeプランはstudio.site のアドレスで公開され、Studioのバッジが表示されます。有料のプロジェクトプランでは独自ドメインを使えます。
• 連携： 日本語のFAQはGoogle Analytics、Google Tag Manager、Search Console、reCAPTCHA、Meta Pixel、チャットツールを挙げ、直接対応していないツールもGoogle Tag Managerや埋め込みコードで連携できる場合があるとしています。
• カスタムコード： 埋め込みボックスはHTML、CSS、JavaScriptに対応し、有料プランではサイト全体または個別ページのheadやbodyにコードを挿入できます。
• 言語： Studio.Assistantのインターフェース、チャット、生成テキストは日本語と英語に対応します。

価格

Studioの料金はアカウント単位ではなくプロジェクト単位で、プロジェクトごとに個別のサブスクリプションがあり、1つのプロジェクトで作成・公開できるWebサイトは1つだけです。以下の価格は、2026年10月6日に取得した英語版の料金ページによります。

料金ページには、全金額が該当する税を含むこと、年払いで20%以上節約できることが記載されています。表以外では、Personalにパスワード保護、Businessに基本的な権限設定、無制限のアナリティクス、リダイレクト、Business PlusにCMSアイテム15,000件、高度な権限設定、カスタムヘッダー、アクティビティログが加わります。2026年7月のプロダクトアップデートでは、月間訪問者数に上限がないと発表されました。

その他の料金とプラン

• カスタムプロキシのアドオン： Business Plusのプロジェクトは月額$290で追加でき、既存ドメインのサブディレクトリ配下でStudioのページを配信できます。カスタム証明書と301リダイレクトにも対応します。
• ワークスペース： プロジェクトプランとは別に課金されます。無料のワークスペースは最大3プロジェクトまで、Teamは年払いで1メンバーあたり月額$14（最低3名で$42から）、月払いで1メンバーあたり$18（$54から）です。
• 円建て価格： 日本語の料金ページでは、年払いの月額がMini ¥590、Personal ¥1,190、Business ¥3,980、Business Plus ¥9,980、月払いではそれぞれ¥1,290、¥1,720、¥5,460、¥12,900で、カスタムプロキシは月額¥39,800です。
• Enterprise： 日本語の料金ページにはあり、今回確認した英語版にはありません。問い合わせ制で、ページ数とCMSアイテム数は無制限、SLA 99.9%、360日分のアクティビティログ、IPアドレス制限、銀行振込での支払いに対応します。
• Studio.Assistant： 月払いではStarterが月額¥24,800、Proが月額¥99,800、年払いではそれぞれ月額¥19,800と¥74,800で、いずれも税込みです。どちらも14日間の無料トライアルから始まります。トライアルは初回の契約のみが対象で、登録から14日後に自動で課金が始まります。
• ドメイン： 日本語のFAQによると、月額料金はサイトの制作と公開のみが対象で、独自ドメインの取得費用やインターネット接続費用は別途かかります。

請求のルール

• 支払いはクレジットカードまたはデビットカードです。
• 年払いから月払いへの切り替えには対応していません。プロジェクトをいったんFreeに戻してから月払いプランを契約する必要があります。

Studio.Designの代替ツール

• WordPress： Studio自身のFAQは、違いを保守の手間として説明しています。WordPressはテーマやプラグインで柔軟に拡張できる一方、サーバー、アップデート、セキュリティの管理は自分で行う必要があり、Studioはサイト制作、CMS、フォーム、SEO、ホスティングを1つの環境にまとめています。これはベンダー自身の比較で、第三者の比較ではありません。
• Wix、Squarespace、ペライチ： ローンチ時、共同創業者はこれらのサイト制作サービスが部分的にStudioの競合になり得ると述べ、同じ記事はSTUDIOが最も意識している競合としてWebflowを挙げています。
• Framer、Webflow、WebWave、Dorik： ある製品ローンチ用プラットフォームは、これらをStudio.Designの類似製品として掲載しています。

制限事項

• コードの書き出し不可： ページのHTMLは直接編集できず、Studio.DesignにはサイトのHTMLコードを書き出す手段がありません。
• ネットショップや会員限定ページは不可： 日本語のFAQは、会員限定ページとECをStudioの非対応機能として挙げています。
• パスワードはサイトごとに1つ： 閲覧者ごとに異なるパスワードは割り当てられず、設定できるのはサイト全体で1つのパスワードだけです。
• 上限超過のフォーム回答は非表示： プランの上限を超えた回答は、プランをアップグレードするまでダッシュボードにもメール通知にも表示されません。
• ダウングレードでコンテンツが非公開に： 下位プランの上限を超えるコンテンツがあってもダウングレードは予約できますが、上限を超えるCMSアイテムや機能は非公開になります。
• 返金なし： 契約成立後のプランは、誤ってアップグレードした場合も含めて返金されず、自動更新されたプランは解約も返金もできません。
• AIの利用上限： AI機能には実行回数の上限があり、超えると一定期間使えなくなります。
• Figmaインポートの注意点： タブレットやモバイルのサイズで作ったFigmaデザインはデスクトップサイズとして認識されます。複数ページに対応するページモードはベータ版で、予期しない動作をすることがあります。
• AI生成は1人で作業： Studio.Assistantでの作業は1人ずつ行う設計で、デザインエディタに書き出した後は通常の共同作業に戻ります。
• サポートの範囲： チャットサポートはStudioに関する問題が対象で、他社サービスやデザインの相談は対象外です。

プライバシーとコンテンツの権利

• データの保存場所： Studioは日本と米国にあるGoogle Cloud Platformのサーバーで稼働しており、個人情報はどちらの国に保存される可能性もあります。
• AIの学習： ヘルプセンターは、Studio.Assistantで作成したサイトやコンテンツがAIの学習に使われることはないと明記しています。今回のレビューで確認したページでは、エディタの画像AIとテキストAIについて同様の記載は見つかりませんでした。
• コンテンツのライセンス： コンテンツの権利は利用者に残りますが、規約はSTUDIOに対し、サービスの提供、改善、宣伝のためにそれを利用する取消不能・永続的・全世界的なライセンスを付与しています。
• 事例掲載： STUDIOは、利用者のWebサイトを自社サイトやマーケティング資料に掲載することがあります。
• 年齢と準拠法： 利用者は居住地の成年年齢に達しているか保護者の同意を得ている必要があり、EUでは最低16歳です。米国外の利用者の準拠法は日本法です。

よくある質問

Q1. Studio.Designで作ったサイトのコードは書き出せますか？

いいえ。Studio.DesignにはHTMLの書き出しも直接編集の機能もありません。埋め込みボックスでカスタムコードは追加できますが、サイトはStudioのホスティングに残ります。

Q2. iPadやスマートフォンでStudio.Designのサイトを編集できますか？

いいえ。編集にはデスクトップパソコンのGoogle Chromeが必要で、タブレットやスマートフォンでは編集できません。

Q3. Studio.Designは無料ですか？

デザインツールと最大50ページを使えるFreeプランがありますが、Studioのバッジが表示され、公開先はstudio.site のアドレスに限られます。独自ドメインはMiniプランから使えます。

Q4. Studio.Designは私のコンテンツをAIの学習に使いますか？

Studio.Assistantについては、作成したサイトやコンテンツがAIの学習に使われることはないとヘルプセンターに記載されています。エディタのその他のAI機能については、確認したページで同様の記載は見つかりませんでした。

Q5. 返金は受けられますか？

原則として受けられません。Studioは購入後のプラン料金を、誤ってアップグレードした場合も含めて返金しないため、次回の請求を避けるには更新日より前にプランをダウングレードする必要があります。