microCMSの導入事例を紹介していく第一弾です！

まず御社について教えてください

株式会社TAG STUDIOで様々なメディアサービスを運営しています。
株式会社インタースペースの子会社に当たります。
各チームが少数精鋭でメディアを開発・運用しています

お二人の普段の担当業務について教えてください

五十嵐さん

派遣サーチというメディアサービスでコンテンツの見た目、文章のチェックを担当をしています。
数ヶ月前にTAG STUDIOに異動してきました。

柴原さん

同じく派遣サーチ担当で、データベースからフロントエンドまで開発全般を受け持っています。

派遣サーチの技術構成は？

インスタンスはGoogle App Engine、データベースはCloud SQL、サーバサイドはPHPの軽量フレームワークであるSlim3を採用しています。
またフロントはAMPを導入しており、サイトのパフォーマンスには気を使っています。

もともと管理画面はWordPressでやっていく予定だったんですが、セキュリティの問題やプラグインのアップデートが大変だなぁと思っていました。
その代用として今回、microCMSをPHPからAPIを呼び出す形で利用させていただきました。

なぜmicroCMSを使ってみたいと思いましたか？

派遣サーチは今年の2月くらいから作り始めたのですが、やっぱり内部的な管理画面よりもユーザーに見せる画面の方から作り始めるじゃないですか。
なのでデータはとりあえずデータベースに直接ガンガン入れていって、後から管理画面は用意すればいいかなと思っていたんです。
当初は「管理画面は4月には作りたいよね」って言っていたところズルズルと後ろ倒しになり、気付いたら「年末までには作りたいね」というスケジュール感になっていました。

そんなときTwitterでmicroCMSというものがあると知り、当初ヘッドレスCMSという単語は知らなかったのですが、APIベースのCMSと見てピンと来ました。
キタコレ！という感じでした（笑）

金曜日に知って、日曜日とかに色々と試してみて、火曜にはもう出来上がっていて五十嵐に確認をお願いしました。
本当にとんでもない工数が浮きました。
とりあえず100万円くらい入金した方が良いんじゃないかと思いました（笑）

実際、人員を追加しないと管理画面の開発に着手できないような状態で、ちょうど来週あたりから新しい人が来るのでその辺りから着手していこうかなと考えていたんですが、そのリソースも丸ごと別のより注力するべき部分に当てられることになったので良かったです。
（柴原さん）

実際に使ってみてどうでしたか？

修正がしやすくなった

microCMSを導入するまでは記事のちょっとした変更するのにもデータベースを直接いじっていました。
セルの一コマに書かれた長いHTMLの中から該当の箇所を見つけ出して変更する作業はかなり辛かったです。
その方式だと、どこを変更したかもよく分からなくなってしまうし、バックアップとかも取れないので怖いなと思っていました。
そこで、途中からデータベースの記事をCSVでエクスポートしてきて、修正後に再度インポートするという方式に変えて多少は楽になったのですが、それでも結構めんどくさかったです。
いちいち見出しや太字にするために毎回タグで挟んだりしなくてはいけないのが大変で、まったく記事のリライトをする気力が起きないような状況でした。

microCMSを導入してからはモダンな管理画面からHTMLを気にせずに記事の修正ができるようになったので最高です。
（五十嵐さん）

実装スピードがめっちゃ上がった

私がこうしたい、ああしたいというのを柴原に投げても当初はなかなか実装されなかったのですが（笑）、microCMSを導入してからはそれがすぐに反映されるようになりました。
（五十嵐さん）

単純に管理する箇所が減っているんですよね。
そもそも記事とかサイト上にあるもの全てデータベースに突っ込んでいたんですけど、microCMSに移管した部分はごっそり無くなっているので、こっちのデータベースで管理しているものはかなり減っていて、ソースコード量も相当減らすことができました。
修正とかもだいぶ楽になりました。
データベース見るのきつかったですもん。
（柴原さん）

プレビューが便利

最近ユーザーインタビューをやっていて、ユーザーさんにこういう記事で大丈夫ですか？って確認を取るんですが、それをプレビューを使って確認に使えるので非常に重宝しています。
今までデータベース直打ちでデータをいじっていたので、プレビューを見る場合は柴原に頼んでローカルで起動してもらって・・・という作業をする必要があったので辛かったです。
（五十嵐さん）

UI/UXが良い

社内のサポートの方たちに記事の入稿をお願いしようと思い、microCMSとExcelを使って記事作成から入稿までのマニュアルを作成しました。
私がちょうど夏休みを取るタイミングで、microCMS内でサポートの方々用のアカウントを作成して作業してもらいました。

夏休みが空けたら200記事追加されていて最高でした。
向こう側の方はmicroCMSを触るのは初めてだったにもかかわらず、特に詰まったりすることもなく、スムーズに作業できていました。
UI/UXが非常に良いからだと思います。
（五十嵐さん）

初めてでも使いやすいのってめちゃめちゃ強みだと思いますね。
公開までに分からなくてググったところなんて全然なかったので。
API周りも特に詰まることなく、全然問題なかったです。
（柴原さん）

===
ちなみに今はインポート機能も用意されているので、1000記事までは一括入稿できます。
===

サポートがめっちゃ良い

画面右下のアイコンから何度も問い合わせをさせていただいていますが、毎回非常に丁寧に対応してくれます。
自分たちの言った意見が「開発ロードマップ」に載るっていうのが、たぶん僕ら以外にも要望を言っている方はたくさんいると思うんですけど、なんだかmicroCMSを共創しているような気持ちになります。

他のヘッドレスCMSは海外製のものがほとんどなので、サポート周りのハードルが高いんじゃないかなと思っています。
今まで何回か別のサービスでも経験がありますが、連絡しても結局解決しないことも多いですからね。
（柴原さん）

利用していて何か困ったことはありましたか？

class名が入れられない

記事内にチャット形式の見た目の文章を入れたかったのですが、リッチエディタ内の要素にclass名を設定できないため、「あれ、これどうやって実現するんだ？」と困りました。

最初は、リッチエディタに用意されている、ボールド / イタリック / アンダーライン / 打ち消し線のタグを利用して、この数まではパターンを用意できるなと思ったんですよ。
無理やり取り消し線にスタイルを当てて・・・というふうにやれば。
でもそれだとHTMLセマンティクス的によろしくないですよね。

そこで、「普通に自分で作っちゃえば良くないか？」ということに気付き、リッチエディタ内に独自のタグのような物を埋め込み、テンプレート側でclass名付きのタグに置換するという方法を思い付きました。
実際にやってみたところ問題なく動作し、様々のUIパターンに対応できるようになりました。
（柴原さん）

===
これには本当に驚きました・・・！
とはいえ本来はmicroCMS側で何とかしなければならなかったところだと思いますので、より良い方法を検討します。
===

公開中下書きって何？

最近ようやく理解したんですけど、公開中下書きってどういうこと？なんでダブっているんだろう。ってずっと思っていたんですよ。

いざ実際に記事を公開してみると、公開中だけど結構大幅に記事を変更したい場合があって、アクセスもあるから記事を一度閉じることもできない。
そこで、「あぁ、なるほど！」となりました（笑）
記事を公開しながら修正用の下書きを同時に進めることができるという意味だったんですね。
（柴原さん）

「下書きに戻す」と「下書きで保存する」が同じ単語を使っているのがややこしかったですね。
（五十嵐さん）

===
なるほどです・・・！文言調整いたします！
===

おわりに

今回は派遣サーチへの導入事例をご紹介させていただきました。
工数が半年以上浮き、より注力すべき箇所にリソースをさけるようになったと聞き、我々としても非常に嬉しかったです！

-----

microCMSは日々改善を進めています。
ご意見・ご要望は管理画面右下のチャット、公式Twitter、メールからお気軽にご連絡ください！
引き続きmicroCMSをよろしくお願いいたします！