概要
工務店のコーポレートサイトを想定して制作したサンプルサイトです(仮想案件)。
担当はコーディングで、Photoshop
のデザインカンプをもとに実装しました。工務店という業態にふさわしい信頼感・落ち着いた印象を、デザインどおりに崩さず再現しています。
制作会社さまの視点では、Figma
だけでなく Photoshop のカンプにも対応できる実装力と、短納期でも確実に仕上げる対応力を確認いただける一例です。
課題
工務店のサイトでは、地域に根ざした信頼感や堅実な印象を、デザインどおりに崩さず表現することが求められます。
加えて、限られた制作期間のなかで、品質を落とさず確実に仕上げることが想定した課題でした。
解決アプローチ
カンプ対応力: Photoshop のデザインカンプからスライス・実装を行いました。Figma 以外のツールで支給された場合でも、デザインの意図を正確に読み取って実装できます。
デザイン再現性への配慮: デザインカンプに忠実なコーディングを徹底し、レスポンシブでも崩れない適切な画像配置を行いました。PC からスマートフォンまで、工務店の落ち着いた世界観を保っています。
表示・検索への配慮: SEO を意識した HTML 構造で見出しや要素を適切にマークアップし、短納期のなかでも検索エンジンに評価されやすい土台を整えました。
工夫したポイント / 想定効果
短い制作期間でも、Photoshop カンプへの忠実な再現と SEO への配慮を両立できた点が工夫です。
地域名や業種での検索流入を見込める HTML
構造としており、問い合わせにつながる土台を整えられたことが期待できます。