長期プロジェクトを、確定事項と残作業の可視化で前へ進めた企業サイト

多数の事業・製品情報を企業として統一した印象で整理し、PCとスマートフォンの双方で読みやすく届けることが求められました。制作中には関係部署からの確認や画像差し替えが継続し、確定した内容と検討中の内容を分けて管理する必要がありました。また、当初は静的に掲載する想定だった価格表などについて、運用を考慮して自動更新へ切り替える要件が追加されました。長い確認期間を挟んでも、再開時に制作意図と残作業をすぐ把握できる進行が重要でした。

サイト全体をページ単位だけで管理せず、「確定済み」「確認中」「追加対応」「公開条件」に分け、判断と残作業を一覧化しました。デザインの修正指示には変更箇所だけでなく背景と影響ページを添え、間隔が空いても制作担当が迷わず再開できる状態を維持。トップページの方向性は社内確認前に関係者間で意図を共有し、後続ページへ展開する基準としました。静的掲載から変更された価格情報は、更新頻度と担当者を確認し、既存ページの見た目を保ったままPHPで自動反映する方式を提案しています。

素材メーカーとしての力強さと規模感を、写真、タイポグラフィ、余白の対比で表現しました。ロゴ制作などを通じて共有されていたブランドの理解をWebにも展開し、トップページから工場・製品・企業情報まで一貫した印象を保っています。画像差し替えが多数発生する前提で、写真の比率とトリミング位置をルール化し、差し替え後もレイアウトが崩れにくい設計としました。スマートフォン版は既存パーツの意図を共有し、画面幅が変わっても情報の優先順位と視認性を維持しています。

基本は静的で軽量な構成とし、共通ヘッダー、ナビゲーション、見出し、表、画像領域を再利用できる形で実装しました。ブラウザ幅に応じたレイアウトとホバー表現を調整し、デザインデータにない中間幅も自然に表示されるよう補完しています。販売価格など更新性が必要になった箇所は、ページ全体をシステム化せず、PHPで必要な情報だけを自動反映する方式を採用。長期の修正期間では指示書と差分を対応付け、確定済みコードへ不要な影響を出さずに画像・文言・機能を更新できるよう管理しました。