見出し画像

バンドルカードのウェブサイト基盤としてStudioを導入しました

2026年4月、カンムのB2C事業で運営しているウェブサイト(https://vandle.jp)をStudioへ完全移行しました。また今回の移行にあわせてエンタープライズプランを契約し、本格的にStudioを運用していくことを決定しました。

導入企業ページにも掲載いただきました

この記事では、Studioへの移行を振り返りつつ、なぜ今Studioを選択したのかについて説明します。ウェブサイト運用基盤をどうするか悩んでいる人の参考になれば嬉しいです。

Studio移行前に抱えていた課題

バンドルカード事業では静的なLPとウェブメディアを運用しています。
移行前にはそれぞれ次のような課題があり、どのように解消していくか頭を悩ませていました。

デザイナーやマーケ主導の改善がやりにくい状態だった

もともとこれらのウェブサイトはStatic Site Generatorを利用して構築されており、開発を行うにはエンジニアに作業してもらう必要がありました。ウェブサイトの改善施策をマーケやデザイナーが主体となって、素早く試していきたいと思っても、デザインから実装まで時間がかかってしまい思うように改善ができないという状態になっていました。

さらに現在社内ではプロダクトの大規模なデザインアップデートが進行しており、将来的にウェブサイトにも大きな変更が入ることが見えていました。そのため、エンジニアの作業を減らし、より気軽にデザイナーやマーケター主導でウェブサイトの更新・改善ができる仕組みの導入が必要でした。

CMSが導入されておらずコンテンツ管理が煩雑だった

運営しているウェブメディアにはCMSが導入されていませんでした。そのためコンテンツの追加や確認に時間がかかっており、コンテンツの企画や品質向上に十分な時間を割けない状態が続いていました

記事データはマークダウンファイルで管理されていたため、ライターの方に直接マークダウンを書いてもらう必要があり、プレビューも気軽に確認できない状態でした。さらに記事に使用する画像もGitHubのリポジトリで管理していたため、リポジトリのファイル容量制限に到達してしまう前にCMSを導入しなければ運用に大きな影響をきたしかねない状況でもありました。

課題を解決するために必要だった要件

なぜStudioを選択したのか説明する前に、今回の技術選定における必須要件をまとめておきます。

  • エンジニアに頼らず運用できること

  • CMSが使えること

  • SEOに強いウェブサイトが構築できること

  • 安定的に運用(配信)できること

なぜStudioを選択したのか

ノーコードWebサイト制作ツールを導入したかったから

まず、前述の課題を解決する方法として、ノーコードウェブサイト制作ツールを導入したいと考えていました。生成AIを活用する方法も含めてコードを残す方法ではエンジニアの稼働を0に近づけることはできないので、今回は候補から外しました。

インフラや開発環境のメンテナンスを自分たちでやらなくて良い、というのもノーコードツールを利用するメリットだと思います。社内の負荷をできる限り小さくしながらウェブサイトを継続的に運用していく基盤としてノーコードツールを活用したいと考えていました。

Studioは設定やエディタの自由度がちょうどよく、非エンジニアだけでも運用しやすいと感じています。いくら生成AIがコードを書いてくれるとは言え事業として運営しているウェブサイトのコードをいきなり書くのはハードルが高いと思うので、こういう場面でこそノーコードツールを導入する意義があります。

生成AIを活用したLP制作がやりにくいという懸念はありましたが、FigmaのAgent機能などを活用すればある程度フットワーク軽くやっていけるんじゃないかなと考えています。このへんは今後の技術進歩に期待ですね。

SEOへの懸念が払拭されたから

Studio移行で一番懸念していたのはSEOへの影響でした。
従来のSPA方式ではサイトの表示速度が遅くなってしまいSEOの評価が悪化する懸念があり、これを理由にStudioの導入に反対する声もありました。

しかし、弊社の移行PJが進行している最中にStudioの表示高速化対応がリリースされたことで、この懸念も払拭されました。本当にタイミングが良かったです。ありがとうございます。
移行直後に検索順位が一時的に落ち込んでしまうことがあったんですが、その後は問題なく推移しており安心しています。

TypeSquareとの連携ができるから

細かいですが、これも重要なポイントでした。リブランディング後にモリサワフォントに収録されているフォントを利用することが決まっていたので、TypeSquareとの連携ができることが重要でした。
フォントの威力というのは侮れないものがありますし、TypeSquareを自前で契約するとかなり大きな金額がかかってくる可能性があるので、それらが料金にあらかじめ含まれているのはとても嬉しいです。

安定した運用をサポートしてもらえるから

前述した要件にもあるとおり、企業運営のウェブメディアとして安定してコンテンツを配信し続けられることが非常に重要で、これが今回エンタープライズプランを契約した理由につながってきます。

エンタープライズプランを契約しなくてもウェブサイトを運用することは可能ですが、専任サポートの提供、SLA保証、セキュリティ対策、などを考えると、社内でそれらの運用を続けるよりもエンタープライズプランを契約するほうが合理的と判断しました。

移行して良かったこと、悪かったこと

良かったこと

前述の通り、エンジニアに頼らず運用できるようになったため、ウェブサイトの改善にかかる工数が大幅に減り、デザイナーやマーケターからの提案がしやすくなりました。これからデザインアップデートや溜まっていた改善施策をまわしていきたいと思います。

以前は細かい部分の改善やコンテンツのアップデートが後回しになることも少なくなかったですが、今は気づいた人がそのまま作業できるので非常にスムーズになったと感じます。コードを直接編集するよりも心理的なハードルが低くなっていて、導入してよかったなと思います。

また思わぬ副作用として、Studio主催の勉強会やStudioのコミュニティにアクセスできるようになったのも嬉しいポイントだなと思います。特に弊社の場合は社内にウェブサイト運用の知見が溜まっていないのでとても助かっています。
生成AIに聞けば答えてくれるものもありますが、失敗談や具体的な事例などはインターネットに公開されていないものも多いので、こういったコミュニティに所属して情報を得ることも大事だなと実感します。

悪かったこと

移行はまあまあ大変でした。MarkdownをStudioに直接インポートすることができないため、WordPress用の移行方法をハックして記事の移行を進める必要があり、かなり大変でした。CMSのAPIがあればもっと楽に移行できたなと思います。

アプリの利用規約やPDFなどのドキュメントをホスティングしているページは、別の環境に移すことになりました。これも少し面倒だったポイントです。自社の管理下に置いたほうが安全であること、表示をなるべく早くしたいこと、変更履歴が細かく見れるようになっているほうが良いことなどが分割した理由です。Studioでも変更履歴を管理できますがページ単位でロールバックすることができないので、履歴をきちんと管理したいページにはあまりむかないと思います。

また、GitHubのようなブランチ管理機能がないため、複数の開発が同時並行で走ったときにどうするか、今後考えていく必要があります。今回の場合はLPとメディアが同じプロジェクトの中に共存している状態なので、LP側とメディア側で同時に大きな変更が入るとなったとき、作業がバッティングしないように運用していく体制を考えないといけないです。

動的なウェブサイトの実装が少しやりにくくなったのはありますが、もともとそんなに多用していなかったので特に問題にはなっていません。カスタムスクリプトを利用したり、MAツールを導入してコンテンツを管理することは可能なので、それも思ったほど困ってはいません。

今後の展望

今回はバンドルカード事業に関連したウェブサイトのみを移行しましたが、今後コーポレートサイトや採用サイトなども順次Studioに移行していく予定です。特に採用サイトは採用ブランディングにおいて非常に重要なタッチポイントとなるので、機動力を高め改善を重ねていきたいと考えています。

おわりに

今回のStudioへの移行は単なるツール変更というだけでなく、既存の課題を解消しより大きな成果を挙げられるウェブサイトをつくるための体制変更の面もあわせ持つプロジェクトでした。生成AIを活用しコードで自由にウェブサイトを作っていく世界観が流行りつつありますが、あえて制約の多いツールを導入することで逆に機動力を高めるという考え方もあるよ、ということを知ってもらえたら良いなと思います。
今後もバンドルカード事業を成長させるために、より良いウェブサイト目指して改善運用を頑張っていきます!

採用情報

株式会社カンムでは一緒に働く仲間を絶賛募集中です!


いいなと思ったら応援しよう!