外部エンジニアとの分業が招いた、「制作の停滞」と「コスト増大」

─Studio導入前は、どのような課題を抱えていたのでしょうか。

河本様：以前はオープンソース型CMSを使用していたことで、デザインの実装段階において「外部エンジニアへの依存」という構造的な課題がありました。社内のエンジニアのリソースはプロダクト開発に集中しているため、各事業部からの要望やクライアントごとのニーズに応えるデザインをWeb上で実装するには、エンジニアを外注する必要があったからです。

デザインチームが担当する案件はコーポレートサイト、LPなど様々ですが、そのうちのひとつにヘルスケアアプリのページ制作もあります。Webで作成したページをWebView（アプリ画面でWebページを表示させるための専用ウィンドウ）によってHELPOに反映しています。

そして、HELPOを契約しているクライアントごとに提供するコンテンツやページをカスタマイズすることで、サービス体験を最適化しています。

WebView

以前は個別のカスタマイズを行うたびに、どうしても長いリードタイムを要していました。社内のアプリ担当者から要望を受けて、デザインチームでデザインを作成し、外部エンジニアにコーディングをしてもらうという、一連のプロセスが必要でした。エンジニアの実装作業だけでも、平均して1ヶ月程度の期間がかかっていました。

また、カスタマイズは一度では終わりません。同じく社員の健康維持・増進を推進する企業でも、「健康増進」を強化したいのか、「健康経営」を実現したいのかによってニーズが異なりますし、その時々のクライアントの状況や従業員の健康状態に合わせて、ページやコンテンツを最適化し続ける必要があるからです。

ー継続的な更新のたびにエンジニアを外注することで、どんな弊害が生まれていましたか？

河本様：スピーディな制作が阻まれるのはもちろん、コスト面の負担も大きかったです。更新のたびにエンジニアの人件費が一定期間かかってしまいます。

振り返ると、制作体制としては非効率な状態だったと感じています。作成したデザインを実装するたびに、予算を確保して、リソースを管理して、あらゆる関係者とコミュニケーションを調整する必要がありました。

最適なサービス体験を維持しつつ、コストを削減して、スピーディに制作するには、従来のCMSと外注に頼る運用体制では限界がありました。この状況を打開するため、デザインチーム主導で運用できるツールを導入することを決めました。

─数あるツールの中で、なぜStudioを選定されたのでしょうか？

河本様：数社のノーコード、ローコードのサイト制作ツールと比較検討する中、社内のメンバーが前職で利用していたということでStudioを知りました。

Studioに決めた一番の要因は、私たちのデザインを最も的確に表現できるツールだったからです。スピードやコストの課題を解決できる期待感があったのはもちろんのこと、Studioはデザインの自由度や表現力が高いため、私たちがこだわっているデザインを、高い完成度で反映できると感じました。

また、ヘルスケアという事業の特性上、セキュリティ面も重視していました。導入にあたっては、社内のセキュリティ部門の基準に基づき、脆弱性などを含めたチェックを行いました。そこをクリアできたことも、導入を決断できた大きな安心材料です。

学習コストは最小限。一回のレクチャーとマニュアルだけで、操作できるように

─実際にStudioを利用してみた感想をお聞かせください。

高橋様：Studioの操作インターフェースはFigmaと感覚的に近く、普段からFigmaでデザインを行っている私たちにとって、非常に馴染みやすい設計だと感じました。

塚﨑様：初めて触れた際から、非常に使いやすいと感じました。私はコーディング経験はほとんどありませんが、専門的な知識がなくてもFigmaで作成したデザインをそのまま再現できるという点が非常に便利です。

高橋様：チームへの連携もスムーズでしたね。初めてStudioに触れるデザイナーも、一度技術的なレクチャーとマニュアルの共有を行うだけで、自然と使いこなせるようになりました。

─Studioでよく使っている機能、お気に入りの機能などはありますか？

高橋様：特に感動したのは、「Figma to Studio」です。これによってデザインから実装までの時間が劇的に短縮され、活用方法によっては、LP制作を半日弱で完了できるケースもあります。

Figma to Studio

さらに、「カスタムコード」による拡張性は大きな魅力です。コードが書けない私でもAIを使ってコードを生成してカスタムコード機能で実装することで、ノーコードツールでありながら、HTMLで構築する場合と同じような機能が実現できています。

たとえば、「指定した日付まではクーポンコードAを表示し、0時を過ぎたらクーポンコードBに切り替える」といった個別的な制御をしたい場合でも、カスタムコードによる拡張で解決できました。

カスタムコード

また、「専任サポート」もとてもありがたいです。単なる操作方法の回答のみならず、実践的な技術もアドバイスしてもらえます。以前のCMSツールからStudioへ移管する際はXMLの中身の書き方を教えてくださったり、制作の場面ではカスタムコードのサンプルをいただいたりすることもありました。日々の制作・運用において大きな支えになっています。

制作期間が75~80%削減。非デザイナーも巻き込んだ内製化の実現

─Studioの導入でどんな成果を感じていますか？

塚﨑様：最大の変化は、デザインから実装までを社内で完結できる「内製化」の仕組みが確立できたことです。導入前は外部エンジニアに依頼する必要がありましたが、導入後はデザイナーだけで制作から確認、実装までの工程が完結するようになり、プロジェクト全体の進行管理がとてもシンプルになりました。

さらに、健康経営支援のカスタマーサポートチームやマーケターなど、非デザイナーだけで更新が完結する場面もあります。デザインチームが構築したCMSを活用することで、サイト制作の専門的知識やコーディング経験のない非デザイナーのメンバーだけでも更新できるようになっています。その結果、部署をまたいだ調整工数が削減され、より少人数のチームで迅速に案件を回せるようになりました。

高橋様：品質面の底上げも大きな成果です。以前のツールではデザインの統一性を保つことが難しく、運用担当者によってデザインが変わってしまうことがありました。でも現在はデザインチームで定義したコンポーネントや見出しスタイルをStudio上で一元管理しています。これにより、誰が更新を行ってもブランドの一貫性が保たれるようになり、結果として制作物のクオリティが担保されるようになりました。

ー実際に得られた成果を具体的な数値で教えてください

塚﨑様：数値的な成果として最も顕著なのは、リードタイムの劇的な短縮です。導入以前は新規Webページの制作に2〜3ヶ月を要していましたが、Studio導入後は最短2週間で公開が可能となりました。

これは制作期間にして約75〜80％の削減に相当する大きな変化です。また、高橋が担当した例のように、制作から実装まで半日弱で終わるケースもあります。

この成果はFigma MakeやAIツールといった、他のツールを複合的に活用したことによる改善効果を含んでいます。しかし、「中核的な役割」を担っているのはStudioです。スピーディな制作体制を支える内製化の土台として、Studioは不可欠な存在です。

Studioはブランドの一貫性と更新スピードを両立できる運用基盤

─Studioは、どのような組織やプロジェクトにおすすめだと思われますか？

塚﨑様：スピード感のある立ち上げや継続的な改善が求められる組織や複数のプロジェクト管理・運用にとてもおすすめです。特に、専任のWeb制作人材が限られている組織や、事業部主導で迅速に情報発信を行いたいケースと相性がいいですね。私たち自身がまさにそのような状況下で導入を決断し、成果を実感しているからです。

─今後、Studioを活用して取り組んでいきたいことは何ですか？

高橋様：Figmaで構築したデザインシステムをStudio側へ反映し、コンポーネント登録を拡大していきたいですね。現在はコーポレートサイトを中心に整備が進んでいるので、WebViewの方でもコンポーネントの整備を進めていきます。

塚﨑様：今後もCMS活用やテンプレート整備を進め、より多くの関係者が品質を保ちながらスピーディに運用できる体制をつくっていきたいですね。ブランドの一貫性と更新スピードを両立できる運用基盤として、今後もStudioの活用を広げていきたいと考えています。

※掲載内容は取材当時のものです。