【2019年9月】コーティングが不要になる？次世代Webデザインプラットフォーム「STUDIO」とは？
コーティング不要でイメージしたデザインがそのままWebサイトになってしまうと話題のSTUDIO。コーティングができないWebデザイナーにとって救世主的な存在になっていますが、現時点（2019年9月時点）で何ができるのか？どこまでなら対応できるのか？をまとめました。
STUDIOとは
STUDIOとは、STUDIO株式会社という日本企業が提供するデザインツールです。最大の魅力としてはコーディング作業が一切不要で、視覚的にドラッグ＆ドロップしてデザインするだけでWebサイト構築ができてしまうツールです。
HTMLやCSSの知識が一切不要でかつパワポ並みに簡単なインターフェイスでデザインできるのでWebデザイナー中心に人気を博しているツールです。
よく、視覚的にWebサイト構築ができるツールとしてWixやJindoが挙げられますが、自由にデザインができず、また公開した時に微妙に見た目が崩れるなどでなかなか本気で活用しようと思える方は少なかったと思いますが、STUDIOはこれらのツールと比較してかなり自由にデザインできるので本格的にWebサイト構築に使えるツールとなっております。まさに次世代ツールと言えるでしょう。
STUDIOの基本概要
STUDIOのできることについて説明します。
視覚的にデザインするだけでWeb公開できる
テキストや写真、ボックスをドラッグ&ドロップで配置できます。
また並び順や方向など細かい配置も決められ、かなり自由なデザインが可能です。イメージとしてはパワーポイントを作るような感覚でWebサイトを構築できます。
また、編集画面のインターフェイスが非常にシンプルで、配置が分かりやすいです。
無料のプランでほとんどの事ができる
STUDIOではWebサイト（プロジェクトごと）にプランが用意されています。
この類のデザインツールだとちゃんと使おうとすると有料プランに入らないと何もできませんが、STUDIOでは自由なデザインからサイトの公開まで全て無料でできます。
しかもサーバーも無料で使え、ドメインもSTUDIO指定のドメイン（末尾が〜.studio.design）であればこれも含まれます。
有料プラン（9ドル）では独自のドメインを設定したりGoogleAnalyticsのような分析ツールを使う場合のみ必要となってきます。
CMS（ブログ機能）は27ドルのプランとして今後リリースされるようです。
テンプレートのデザインクオリティが高い
コーポレートページからLPまで様々なテンプレートが用意されています。
非常にデザインのクオリティが高く、どのデザインもそのまま写真やテキストを差し替えて公開したいレベルです。
2019年9月現在で26のテンプレートが用意されており、日本向けのサイトデザインが特に多いです。
簡単にサイトの公開ができる
１クリックでWeb公開できてしまいます。
公開したページも後から簡単に編集できるので自由がききます。
STUDIOのココがスゴイ
STUDIOを実際に使っていて特にスゴイと思ったポイントを挙げていきます。
ライブプレビュー
編集がリアルタイムに瞬時にプレビュー表示されます。
また、プレビューページのURLを他の人とも共有でき、そうすることで編集内容をリアルタイムに確認し合えます。
レスポンシブ対応
各デバイスを想定した編集画面の切り替えが簡単にできます。
PC、タブレット、スマートフォンなど様々なデバイスに適した編集ができます。
それらの切り替えが非常にスムーズで、それぞれに余白やサイズの調整が適用できます。
今の時代インターネットをみるデバイスは様々で、PCのみを意識したサイトではスマートフォンで見た際に見た目が崩れたりします。
実際にインターネットユーザーの約７割がスマートフォンでインターネットを使っているという調査もあります。
リアルタイムにチャットで質問ができる
チャット形式でツールの質問などができます。
実際にやったところかなりレスポンスが早く、分かりやすく教えていただけました。
※対応はおそらく社員の方がやっており、365日24時間対応ではないです。
夜や休日に問い合わせると明日対応しますというメッセージになります。
また、トークルームは編集画面右側に表示されるので、編集作業をしながらトークするなんてこともできます。
コーティングを意識したデザイン調整ができる
Wixなどと大きく異なるポイントですが、HTML出力なども想定されているツールとなっているのでサイト公開した時の再現性が高いです。
例えば、コンテンツの位置やサイズの調整をpaddingやmarginで調整したり、コンテンツを固定位置にして配置順（z-index）を決めることが可能です。
レスポンシブ対応にする場合は特にその辺りを調整する必要があり、少し慣れが必要です。
この点から言うとWixなどと比べると多少難易度は高いという印象です。
ブラウザで使える（クラウド型）
アカウントにより様々なデバイスで編集作業ができます。
ログインすれば自宅のPCでも職場のPCでもどこでも作業できます。
※ブラウザはGoogle Chromeでのみ使用可能
また、Googleスプレットシートのように共同作業者という形で複数のアカウントで１つのプロジェクトを共同で編集できます。
拡張機能でMAPや動画も表示できる
iframeやRSSにより様々なサービスを使って拡張できます。
例えば、GoogleMAPやYoutubeの動画も表示できます。
STUDIOのデメリット
STUDIOのメリットを上記で述べましたが、実際にはSTUDIOでできることはいくつか制限があります。
なので、世の中にあるどんなWebサイトでも作れるかと言えばそうではありません。デメリットに関して記載します。
動きのあるようなデザイン（Javascriptのような）
例えばスクロール中にコンテンツが動くようなデザインやカルーセルバナー等は今の所表現できません。
※hoverは可能です。
CMS機能
CMS機能はWordPressに代表されるwebサイトやコンテンツを構築・管理・更新できるシステムです。
指定の管理画面でコンテンツの更新をしたりできるので知識がない人でも簡単に更新ができてしまいます。
STUDIOではこれがないので直接編集画面で手を加える必要があります。
なので、情報などを頻繁に更新するサイトではあまり向いていないかもしれません。
公開したサイトにSTUDIOのバナー（ロゴ）が表示される
画像のようなSTUDIOのバナーが左下に表示されます。
これは9ドルの課金プランに加入すると非表示にできますが、無料版では表示されてしまいます。
バナー自体はそこまで目立つものではないので気にならないレベルだと思います。まあここまで無料でなんでもできるのでこれは仕方ないポイントだと思います。
使いこなす難易度が他Webデザインプラットフォームと比べると高い
先ほどメリットとして述べたことでもありますが、STUDIOはコーティングを意識したデザインツールなので多少設計するにあたり計算も必要になります。
これは使っていれば慣れますが、最初は多少手こずります。
個人的にはちゃんとWeb設計できているんだなと感じ安心しますが。
これらを踏まえて、現状のSTUDIOでどんなサイトが作れるのか次の項で説明していきます。
STUDIOでの制作に向いているサイト
本章では結局のところどんなサイトがSTUDIOで制作するにあたり向いているか？という疑問を解消します。
例えば、下記のようなサイトです。
・コーポレートサイト（企業、リアル店舗など）
・ランディングページ（LP）
もちろんSTUDIOでできる範囲内でのサイトになります。
ただ、上に挙げたようなサイトであればSTUDIOの範囲内で十分だと思います。
デザインしてコーティングして、、とやるよりももしかしたらクオリティ的にも作業時間的に考えても向いているかもしれません。
このように簡易的なサイトはSTUDIO、凝ったサイトはコーティングしたサイトなど棲み分けもできるかなと思います。
実際にSTUDIOで作られたサイト（事例集）が公式サイトで見られるようになっています。
有名企業やクリエイターポートフォリオなど様々な事例が見られます。
STUDIOで実際に作られたサイトはこちら▼
STUDIOの今後の展望について
STUDIOの今後についてですが、現状できることに多少制限はありますが、徐々にできることがアップデートされています。
実際に2019年1月に「STUDIO2.0」という形でアップデートされており、今後3.0,4.0,5.0…とアップデートされていくことでしょう。
また、STUDIOの進化によりエンジニア不足が叫ばれるIT業界にとっては追い風となり、Webデザイナーやその他のビジネスマンまでにもその分野の扉が開かれていくでしょう。
まとめ
次世代デザインツールである「STUDIO」についての記事でした。
ツールとして使いこなすには多少慣れは必要ですが、非常に便利で今後期待できるツールです。
私自身STUDIOを使えるようになってから様々なホームページやLPを作るようになりました。
また、STUDIOは定期的に全国でワークショップをやっていたりYoutube、Slackなどでスキルアップできる環境が整っています。
是非一度使ってみてはいかがでしょうか。
