■ 事例概要

■ お客様の課題

外観検査・搬送自動化ソリューションを展開し、確かな技術力を持つPhoxter様。
事業の拡大に伴い、Webサイトをより戦略的な営業・広報基盤へと引き上げることが次の課題となっていました。具体的には、競合他社と比較しても遜色のない情報量を掲載し、重要なコンテンツへの導線を整理することで、サイト流入を確実なリード獲得や採用応募へと繋げる体制の構築です。
そのためには、決裁者・潜在取引先・求職者という「ニーズの異なる3つのターゲット」に対し、それぞれ最適な情報を届けるサイト設計が必要でした。

限られた社内リソースの中で、いかに効率よく、かつ戦略的にサイトを運用・アップデートし続けられる環境を整えるか——。

この「運用の自走化と情報発信力の強化」が、本プロジェクトの核となりました。

■ なぜこの打ち手だったのか

リニューアルの手段としてWordPressやスクラッチ開発も検討されましたが、弊社が第一に考えたのは「Phoxter様ご自身で継続的に運用・成長させられる基盤づくり」でした。 サーバー保守やコーディング知識への依存をなくし、初期・運用コストを抑えつつ社内でスピーディにコンテンツ拡充ができるよう、ノーコードツール「Studio」の導入をご提案しました。

単なるツール選定にとどまらず、弊社からは3つのペルソナを起点とした情報設計の抜本的な再構築を提案。「必要な情報に迷わずたどり着けるUX」と「内製でSEO強化し続けられる土台」の両立を目指し、導入事例やコラム、採用情報など、各ターゲットが求める情報を体系的に拡充する構成を作成しました。

■ 実施内容

STEP 1：要件定義・ペルソナ設計・情報設計

まずはターゲットを「決裁者（購買・生産部門統括）」「潜在取引先（情報収集担当者）」「求職者（キャリア志向）」の3つに明確に定義し、それぞれの情報収集行動を整理しました。TOPを含む全25ページ・5種のCMS（製品・事例・ニュース・コラム・インタビュー）という大規模な構成を緻密に設計し、グローバルナビゲーションやCTA、パンくずリストなどの導線をユーザー視点で最適化しています。

STEP 2：デザイン・Studio実装（★UXを高める表現の工夫）

Phoxter様の高い技術力を体現するため、コーポレートカラーの黒を基調としつつ要所でオレンジをアクセントとして効かせ、信頼感と先進性を両立させたデザインに仕上げました。

本サイトでお客様からも評価いただいた点として、「工場俯瞰図とハーフモーダルを組み合わせた表現」が挙げられます。

ユーザーの視覚的な興味を強く惹きつけ、直感的にソリューションを理解してもらうためのこのギミックは、Studioの制約を感じさせない弊社ならではの実装提案として実現しました。もちろん、モバイルファーストでのレスポンシブ対応も細部まで完備しています。

STEP 3：内製化サポート・QA・公開

「作って終わり」ではなく、公開後の自走を後押しするため、CMSの運用レクチャー会を実施し、専用のマニュアルも作成しました。ドメイン・サーバー移管のサポートに加え、仕様書に基づき市場シェア8割の端末・ブラウザ環境での厳密なQA（品質保証）を実施。万全のクオリティを担保した上で、2026年3月末に無事公開を迎えました。

■ お客様の声

「Studioでどこまで表現できるか不安でしたが、その懸念を取り払っていただきました。希望した工場俯瞰図とハーフモーダルを組み合わせたギミックにも、ツールの制約を感じさせずポジティブで具体的なご提案をいただき、予算を抑えながらデザインと機能性を両立したサイトになり、満足しています。」
— 株式会社Phoxter 漆谷 真理子様

■ プロジェクトまとめ