私は元々10年くらいWEBデザイナーとしてデザインからコーディングまで色々お仕事してきました。
最近は管理職となりもう5年くらいはデザインなんてしちゃいない。もうデザイナーなんて名乗るのはおこがましい身分でございますが、そんな私が「元デザイナー」「元コーダー」視点で最近ナウいサービスを触ってみるシリーズ。
今回は、元コーダー視点で「Studio」を使ってみて分かった、良かった点・イマイチだった点をまとめてみました。
■Studioとは
Studioは、コードを書かずにWEBサイトの構築、公開、運用ができるプラットフォームです。
とりあえず無料でさくっと趣味のページを創りたい・ブログなど機能を入れてしっかりページ運用したい、どちらの要望も叶えてくれます。
基本情報
-
読者層：
これからStudioを使ってサイト制作する方、気になってるけど、どーなん？って方 -
Studio歴
利用歴：3か月くらい（そのうちゴリっと使ったのは１か月くらい）
利用量：CMS（ブログ）機能含めた７サイト：計85P作成
ちなみに、上記に記載している通りStudio歴は浅いです。ヒヨッコです。
とりあえず触った感想・ビギナー視点での内容となりますので一部勘違いや語弊があるかもしれない事ご了承ください。
「いやいや！これは出来るよ！」「それは間違っている！」などあれば、ぜひコメントお願いします。
推しポイント
凄い機能は色々あるんですが「他のサービスにもあるんだろうな」みたいな機能の紹介は省きます。
幅広い料金プラン、そして安い
個人で楽しみたい程度のサイトなら、「Free」の無料プランがあります。
独自ドメインは使えないけど、50ページまで作れるのは有難い。
ブログ機能もちょっと欲しいな！であれば、「Mini」プランで月590円。やっす。
ブログは100投稿までOK(厳密には異なりますが）、独自ドメインでの公開もできます。
ただ2Pしか公開できないのはちょっと痛いかも。（うまく料金設定しているなと思う）
もう少しページも作りたい、であれば月1,190円の「Personal」プラン。
企業でも、取り急ぎ会社のHPつる・製品のLP作りたい、とかであればこのプランで十分です。
■Studio料金プラン
（私が現役の頃だと、サイトを乗せるサーバーのレンタル費用だけで安くて月500円～900円くらいでした。サーバー費用＋サイトもノーコードで作れるって考えると、ほんと安い）
タグの構造が見る・自分で組み替えれる
これが実は私が一番いいなと思ったポイントです。
以前、ノーコードでWEBサイトが作れるサービスをいくつか使ったことがあるんですが
HTMLのsectionやdivのネストっていうのかな、構造がユーザーは触れないものがほとんどでした。（今はどうなってるか知らんが）
なので、作り終わった後にHTMLのソースを見ると、それはもうグッチャグチャ。
「なんでこんな構造になるんや…」と気持ち悪さを感じずにはいられませんでした。
Studioは、この構造もユーザーが動かせるので、以前感じた「気持ち悪さ」がないのが嬉しい。
例えば、「これは１つの要素だからsectionやdivに入れておきたいな」と一般的というより自分のコーディングポリシー的なのが適用できます。
あとdivなどの要素（ボックス）に対して名称もつけれるので、後で見返した時にも非常に分かりやすい。
CMS機能が細かい所まで設定できる
CMS機能＝ブログ機能です。
作ったページに、CMS機能で作った内容を表示させることができます。
このCMS機能が結構汎用的。
お知らせ機能という割と一般的な使い方から、例えばQ&A、企業や製品のページだとユーザー事例など、色々と使いどころが出てきます。
またカテゴリーやタグも設定し、記事と紐づけることもできます。
紐づけることで、そのカテゴリーによって表示させる内容を変える。といった動的な動きが実装できます。
例えばお知らせページでも、お知らせ・セミナーの案内・重要度の高い情報など色々分類できるので、その分類ごとに表示する。といったことができます。
以前wordpressでサイト構築した際は、このあたりの動きがPHPで書いてたので、コードを書かなくていいのは非常にありがたい。（プラグインもあるけど、複数プラグインの組み合わせで複雑だった）
floatやdisplay、flex-directionなどのこの並び要素の設定が簡単
私だけかもしれませんが、横並びの要素の高さを揃える、といったボックスのCSS設定が苦手なんです。（訳が分からなくなってくる）
その点STUIDOは、視覚的に分かりやすい設定で、ワンクリックでボックスデザイン（横並びのデザイン）を設定してくれます。
これはほんと助かっている。
Figmaと連携
これがすごい。
figmaで作ったデザインをコピペするだけでStudio側に変換されます。
「どうせグチャるかな～」と思ったんですが、これが中々の精度で反映されます。
なので、デザインさえ作ってしまえば、あとはコピペコピペで完成。
１ページたぶん数分で作れちゃいます。これは本当に感動しました。
残念ポイント
「うーん」と思うことは色々ありましたが、ほぼ方法次第で代替できます。
なので、代替できないポイントを「残念ポイント」として挙げてみました。
CMSの表示時、条件設定が１しか設定できない
推しポイントの1つとして挙げてた、条件設定が出来るのは凄く有難いんですが・・・
条件が1つまでしか設定できません。
上記の画像だとブログ記事でカテゴリー「kintone」に設定されているものを表示してるんですが、例えば、「カテゴリーがkintoneで、尚且つ投稿日が2021年のもの」といった、複数条件が設定できません。
うーん、惜しい。これはぜひ改善してほしい！
CMSで作った記事の移動ができない
CMSでは、記事を「モデル」ごとに分けることができるんですが
この分けてしまったモデル、他のモデルへ移動させることができません。
Studioにはインポート機能があり、WordPressなどで作ったお知らせなどをXMLファイルに書き出せれば、Studioにインポートすることができます。
ただインポートしたデータは、１つのモデルとして登録されます。
「今までwordpressで複数作ってたお知らせやブログを１つに統合しよう」
「ブログはnoteとかwordpressで投稿してたけど、この際１つにまとめよう」
と、意気揚々とStudioでインポートしたは良いが、モデルが別々に作られるので結局手作業で１つのモデルに集約させる。という事態が発生します。
うーん、惜しい。
ページネーションが作れない
その名の通り、ページネーションが作れません。
その代わりが「もっと見る」ボタンになります。
別にもっとみるボタンで代替できてるのでいいのですが、惜しいなあ～。
まとめ
今はAIがサイト作成も自動で作れたりするんですが、私としては中の構造がグチャってるのが結構嫌だったり、改修するのウンザリだなと感じてたのですが（まあ中まで誰も気にせんが）Studioは、あえてそのような構造だったりを残してくれているのが私的にはポイントが高かったです。
やはりノーコードで出来るものは限界がありますが、逆にここまでノーコードで出来るって本当に凄いですね。最近WEB界隈の情報に疎かったのですが、ちゃんと追いついていかないとなと感じました。