ご注意
本記事は学習メモも兼ねているので、修正・加筆が発生します。
記事内容を鵜呑みにせず実際に手を動かしながら読んでいただくことをおすすめします。
STUDIO操作月：2025年4月時点
はじめに
ウェブサイトのノーコードビルダーといえば「STUDIO」と日本ではすっかり浸透しましたね。
アメリカにも進出しているので、今後の動向は要チェックです！
本業では一切STUDIOを使うことがなかったので、日本で普及しつつあるSTUDIOを知っておかないとやばいな、、、と感じていたところです。これまでは、WordPressやVanilla HTML+CSS+PHP、Astro、Next.js、Webflow、WixといったプラットフォームでWeb制作に携わってきました。
ということで、クライアントワークを想定し、STUDIO初心者の私が1からSTUDIOでの制作工程を勉強していきたいと思います！
まずは、アカウントの開設方法とクライアントへサイト移管についてまとめていきます。
自己紹介
約10年、Web業界に従事しています。
東京都内のWeb制作会社に総合職として新卒入社。サイト運用・更新時のカスタマーサポートとディレクションを4年半経験。国際結婚を機にロサンゼルスへ移住しました。就労ビザ取得後（現在は永住権ありです）、フリーランスのWebデザイナーとして活動。その活動の傍ら、現地のIT総合企業にWebディレクターとしても所属しています。
フリーランス側の事業を今後拡大していきたいので、今年2025年に法人化を目指して準備しています！
本題に戻ります。
STUDIOのアカウント開設は非常にシンプルでした。
Web制作の経験が浅い方でも直感的に進められる設計になっています。
登録手順をまとめてみました。
アカウントの新規登録手順
- STUDIOの公式サイトにアクセスし、右上の「ログイン／新規登録」をクリック
- アカウントを作成（現在以下3種類から登録方法を選ぶことができます）
登録を代行するなら3つ。管理しやすいのは上2つ。
基本は制作アカウント（自分の）で制作してクライアントアカウントを管理者として招待がスムーズ。
クライアントアカウント上で作業もできそうですが、複数案件持つと煩雑になりそうです。それはWebflowと一緒でした。
- Googleアカウント
- Facebookアカウント
- メールアドレス・パスワード直接入力（試していませんが、直接入力での登録の場合、別途メール認証が必要になると思います）
- 質問を回答
- Studioの利用目的を教えてください。
- あなたの職業・職種は次のうちどれですか？
- チュートリアル開始（4ステップでStudioの基本動作を覚えよう！）
ドラッグ操作の練習。所感としてはWebflowよりもかなりスムーズに操作ができる印象。
マージンをドラッグで設定できるのはめっちゃいい！
UIはごちゃついていないのでWebflowより見やすいかも？ただWebflowはショートカットキーが充実しているので、制作時はどんな操作感になるか楽しみです。
チュートリアルはスキップできるので、クライアント様がサイトビルダーに不慣れな方であればとりあえずスキップしてくださいと案内していいかもしれません。 - そのままサイトを作成するかダッシュボードに戻る
サイト（プロジェクト）移管方法
移管する（作ったサイトをクライアント様へ譲渡する）概念ではなく、制作サイト（プロジェクト）に管理者として招待する形でした。
ちなみにShopifyとWebflowはサイトをクライアントアカウントへ譲渡します。
- 対象のサイト（プロジェクト）にクライアント様をオーナー権限で招待（アカウントは事前に作成してもらうこと）
- クライアント様にて招待を承諾いただく
- 承諾確認後、クライアント様にて有料プランに加入・決済
- 決済後自動的に権限が「支払いオーナー」に変更される（「オーナー」よりも上位権限になる）
- 必要に応じてクライアント様にてこちらのアカウントを削除していただく。（自分で削除できるかもしれません）
ワークスペースは必要？
ワークスペースは今回ケースでは必要なさそうです。
複数サイトの支払いと権限を一元管理できる機能でした。採用サイトやメディアサイト、コーポレートサイトなど複数サイトを管理したいクライアント様だったらぴったりの機能です。
少し考え方は違いますが、Webflowにも似た機能があります。
クライアント様へのご案内内容
前述の手順をを踏まえると、クライアントには以下を事前に案内しておくと円滑に進みそうです。
Googleアカウントでサインアップしてもらう
アカウント作成はクライアント様自身で実施してもらいましょう。作成を代行してもメールアドレス認証がきっと入ると思うので結局クライアント様との連携が必要になると思います。Google Analytics等設定するためにGoogleアカウントを用意してもらうので、Googleアカウントサインアップが一番シンプルで管理しやすいです。
また、アカウント登録完了までの手順が多いので事前に操作を案内しておくと親切ですね。特にビルダーに慣れていないクライアント様はドラッグ操作でつまづく気がしました。その場合はスキップするか、一緒にやるのもいいかもしれませんね。
サイト移管の段取りを案内する
当たり前ですが、招待確認と支払いが発生するため、サイト公開が近づいたタイミングで事前に案内します。
制作に集中すると抜けがちなので、しっかり移管の段取りはおさえておきます。
まとめ
今回は、STUDIO初心者のWebディレクターである私が、クライアントワークを想定してアカウント開設の流れとクライアント様への移管方法を体験・整理してみました。
実際に触ってみた印象としては、STUDIOは想像以上にシンプルで直感的。Web制作に慣れていない方にも扱いやすく、今後さらに普及していく予感がしました。
一方で、クライアント様への案内やアカウント設計は事前にしっかり組み立てておくことで、制作フローがスムーズになります。特に複数案件を抱えるフリーランスや制作会社の方は、制作用アカウントとクライアントアカウントの分離運用を意識するといいですね。
今後も、STUDIOの使用感や制作の気づきをディレクター目線で発信していきます！