Lighthouse Performance 100点。予約獲得と自走運用を両立

十勝のイメージコンサルティングサロン「Atelier blooms様」向けに、ブランドの世界観訴求と予約獲得を両立するサイトを制作。

技術は Next.js（App Router）+ TypeScript + Tailwind CSS + microCMS + Netlify Forms を採用し、最新構成で保守性と拡張性を確保。

ニュースなどはCMS化し、非エンジニアでも更新しやすい運用設計にした。
表示速度も最適化し、Lighthouse Performance は100点を記録。

無形サービスは価値が伝わりづらく、初見ユーザーが「何を受けられるか」「自分に合うか」「どのように予約するか」を短時間で理解しにくい課題があった。
加えて、公開後に担当者が自走して情報更新できる運用性も必須だった。

情報設計を Concept→Menu→Voice→Flow→FAQ→Contact に整理し、理解の流れに沿ってCTAを配置。
Before/Afterや診断実例でサービスの具体性を補強し、予約導線を明確化。
運用面ではmicroCMSを導入して更新負荷を下げ、実装面では画像最適化・不要JS削減・レンダリング最適化で高速表示を実現し、CVしやすいサイトに仕上げた。

Lighthouse Performance 100点を記録。
更新は担当者が自走できる状態で納品。