Back

Studioスタートガイド｜メリットと使い方を解説

Studio

2024.10.31

Updated:2024.12.24

Studioガイド

Studioの特徴からアカウント登録方法、サイトを作成するまでのステップを紹介します。

本記事は、ノーコードWeb制作プラットフォーム「Studio」を初めて利用する方のためのスタートガイドです。Studioの特徴からアカウント登録方法、サイトを作成するまでのステップをご紹介しています。

Studioの特徴

Studioは、コードを書かずにWebサイトの構築・公開・運用が完結するノーコードWeb制作プラットフォームです。7,600種類以上のフォントと、ドラッグ&ドロップで自由自在にデザインできる直感的なデザインエディタで、簡単に美しいWebサイトを作成できます。

2024年9月時点で公開サイト数は10万サイト、ユーザー数は50万人を突破しました。官公庁や上場企業、スタートアップなど、あらゆる企業・組織で活用されています。

誰もがデザイナーになれるデザインエディタ

Studioの最大の特徴は、プロが認めるデザイン性の高さと、ノーコードならではの直感性と効率性を兼ね備えた「デザインエディタ」です。

ドラッグ&ドロップだけで、書体やアニメーションまでこだわった高品質なデザインのWebサイトが作れます。

テキストと画像を入れるだけで更新できるCMS機能

デザインエディタに加え、コンテンツの作成・管理を行う「CMS」機能も提供しています。HTMLタグの入力も一切不要で、テキストや画像を入力するだけでコンテンツの公開が可能です。

例えばコーポレートサイトのお知らせやブログサイトの記事など、頻繁なコンテンツ更新・運用が必要なケースで役立ちます。

＞詳しくはこちら：更新性の高いノーコードCMS

SEO対策もコンテンツごとに設定可能

Webサイト制作において欠かせないSEO対策も簡単です。

各コンテンツに対してタイトルや説明文、ファビコン、OGPなどの要素を直感的に設定できるため、検索エンジン最適化を効率的に進められます。

安心して利用できるサポート体制

Studioではユーザーの課題や目的に応じて、さまざまなサポートを提供しています。

基本操作・用語・仕様についてまとめている「ヘルプセンター」では、困りごとや気になることを検索すれば、今の自分に必要なヒントを探すことができます。チャットサポートはStudioにログインしているユーザーが利用できる窓口で、チャットボットによる自動応答と有人オペレーターによる個別サポートがあります。

また、Studioのユーザーが参加する「Studio Community」では、ユーザー同士でStudioの使い方について意見交換したり開発チームへリクエストを行ったりすることもできます。

サポート窓口の詳細や使い分け方は、以下の記事をご参照ください。

＞詳しくはこちら：Studioユーザーの「困った」を解決する、サポート窓口活用術

ビジネスでStudioを活用するメリット

制作・運用コストの最適化

ノーコードでWebサイトが作成できるため、コーディングにかかる制作工数や費用の削減が可能です。新規事業のリリースと同時にサイトを公開したい場合など、スケジュールやリソースに限りがある場合でも柔軟に対応できます。

削減した分の制作コストや運用リソースをマーケティング等の他の業務に充てることで、事業成長を加速させることができます。

《構築・運用コストの最適化事例について》

保守・管理コストの削減

StudioではSSL/TLS証明書を自動的に発行し、更新しています。手動でのSSL証明書の更新作業をせず、常に安全な暗号化通信を維持することができます。

またWebサイトを公開・運用するために必要なサーバーを独自に提供しているため、レンタルサーバーを別途用意する必要はありません。オープンソース型CMSの場合は公開後にも定期的なアップデートが必要ですが、Studioなら保守管理のコストをかけずに高度なセキュリティを維持することができます。

＞詳しくはこちら：Studioのセキュリティ対策

《保守・管理コストの削減事例について》

Webサイトの世界観をこだわって再現できるStudioの表現力。毎月10時間かかっていたセキュリティ対応の工数もゼロに：富士通株式会社様

外部ツール連携でさらに機能を拡張

有料プランでは、外部ツール連携によってさらに機能を拡張することも可能です。

例えばGoogle Analytics、Google Tag Manager、Google Search Consoleなどの外部ツールと連携することで、ユーザーの行動や検索順位を詳しく分析できるため、Webサイトを改善するための具体的な対応が可能になります。

《Apps連携の種類 ※一部》

Googleタグマネージャー
Google Analytics
Googleサーチコンソール
HubSpot Tracking (Beta)
チャネルトーク
Intercom　ほか

＞詳しくはこちら：外部アプリとの連携機能

まずは無料アカウント登録｜メールアドレスの入力だけでOK

サインアップページにアクセス
https://app.studio.design/ja/signup
メールアドレスとパスワードを入力
ログインに使用するメールアドレスとパスワードを入力します。
メールアドレスを確認
登録後、すぐに確認メールが送信されますので、届いたメール本文の「メールアドレスを確認する」をクリックします。クリック後、受信確認が完了すれば登録完了です。

※FacebookアカウントやGoogleアカウントでも登録が可能です。FacebookまたはGoogleを選択した場合は、各サービスの認証画面の指示に従って登録を進めます。

※詳しい作成手順とトラブルシューティングについては、Studioヘルプセンターのアカウント新規登録をご覧ください。

Studioのfreeプラン（無料）で使える機能（2024年11月時点）

freeプラン（無料）で使える機能の一例をご紹介します。freeプラン（無料）でもサイトの制作・公開・運用までオールインワンでご利用可能です。

すべてのデザイン機能：ドラッグ&ドロップによるレイアウト作成、テキスト編集、画像挿入
CMSアイテム公開（最大100件まで）：ブログ記事や商品情報などのコンテンツアイテムの作成・管理・公開
ライブプレビュー機能：変更したデザインをリアルタイムで反映・確認
バージョン管理機能（24時間）：デザイン変更履歴の管理・復元
フォーム機能：問い合わせフォームなどの基本的なフォーム機能
アナリティクス機能（30日間）：サイトのPV数やインサイトの確認・分析
公開機能：「.studio.site」ドメインでの公開

Studioサイトの作成方法

アカウント登録が完了したら、さっそくWebサイトを作ってみましょう。

Studioでは、Webサイトのデザインやデータを管理するファイルのことを「プロジェクト」と呼んでいます。Webサイトを新しく立ち上げる際は、まずプロジェクトを作成する必要があります。

まずはテンプレートを活用してみよう

短期間でサイトを準備したい場合、テンプレートの活用がおすすめ。テンプレートはあらかじめデザインが用意されているひな形のようなものです。

Studioでは、ハイクオリティなWebサイトテンプレートが購入できる「Studio Store」を運営しています。幅広いラインナップの中から、サイトのカテゴリや利用用途に沿ったテンプレートを購入できます。

テンプレートはテキストや画像の変更だけでサイト公開が可能で、自由にデザインをカスタマイズすることもできます。

具体的な作成手順

ログイン後に表示されるプロジェクト一覧ページから、画面右上にある [+ 新しいプロジェクト]をクリックします。
ページ下部にスクロールするとテンプレートの一覧を表示できます。使用するテンプレートを選択したら「このテンプレートではじめる」をクリックして、任意のプロジェクト名を設定しましょう。

※プロジェクト名は後から変更可能です

サイトを公開するまでの流れについて、より詳しい情報が知りたい方はヘルプページの「はじめに | Studio Help」をご参照ください。数分で読める10記事でStudio利用開始〜公開までに最低限必要な情報をまとめています。
Studio利用時に知っておきたい用語をまとめたヘルプページ「Studio用語集 | Studio Help」もあわせてご活用ください。