小売店のポータルサイト

概要

小売店のポータルサイトを、企画から運用まで一貫して制作。店舗スタッフが日々無理なく更新できる運用設計を中心に据えた、ヘッドレス CMS とフロントエンドを分離する構成。

課題・背景

• 納品後の運用ハンドルを発注側に完全に渡したい。開発者が更新作業を巻き取らない体制が前提
• 現場スタッフは Web 編集の専任ではなく、入稿のたびに迷うと更新自体が止まる
• それでもブランドとしての見た目は崩したくない。自由文中心の CMS では入稿者次第でレイアウトが破綻する

アプローチ

配信と編集を完全に分離するため、フロントエンドに Next.js、配信・プレビュー環境に AWS Amplify、入稿基盤に Sanity を採用。配信側はホスティングとブランチ単位のプレビューを Amplify に集約し、編集側は CMS の管理 UI を主戦場にした。

スキーマは現場の語彙に合わせて設計。フィールド名や説明文を「お知らせ」「セール情報」など現場スタッフが日々使う言葉に揃え、入力時に迷う箇所を最小化した。

ページ構造はセクション／ブロックの組み合わせとして定義。自由文だけに頼らず、用意したブロックを組むことでレイアウトが崩れない作りにした上で、公開前のプレビューと下書き復帰（誤公開後のロールバック）も整備し、本番に影響を出さずに確認・やり直しができるようにした。画像は配信側で動的に最適化されるため、アップロード時のサイズ調整や圧縮を意識する必要がない。

成果

納品後は店舗スタッフだけで更新が回るようになり、結果として更新頻度が上がり、サイト上の情報が鮮度を保つ状態が継続している。開発者が更新作業に介入しない運用が成立した。

担当範囲

企画立案／要件定義／コーディング／テスト／保守・運用

技術スタック

Next.js／Tailwind CSS／Sanity (Content Lake)／AWS Amplify／TypeScript