※スクール課題 【クライアント】 山田建築事務所（架空の建築事務所） 【概要】 ・福島県いわき市にある工務店（架空） ・クライアント様の長所、短所 ＜長所＞受賞経験のある建築家が設計している為、デザイン性やカスタマイズの自由度が高いスタイリッシュな住宅デザインを得意としている。 ＜短所＞工務店にしては少し高額 ・ターゲット 法人ではなく個人。 福島県内の30〜40代の女性、シンプルなインテリアを好む方。 【期間】 約2ヶ月 【担当領域】 サイトマップ作成、ワイヤーフレーム作成、デザイン、コーディング 【使用したデザインツール】 Adobe XD 【開発手法】 HTML/CSS/JavaScript 【クライアントの要望】 ＜目的＞ ・お問い合わせを増やしたい ・完成見学会に人を集めたい ＜デザイン＞ ・印象：スタイリッシュ、シンプル ・メインカラー：ロゴの青色 ・配色：青色、暗い青色、黒色 ・フォント：明朝体 【設定した課題】 ・お問い合わせが少ない ・資料請求数が少ない →ページにたどり着きにくい作りになっている →ボタンが目立たない →そもそもアクセス（サイトに訪れる人）が少ない ・カスタマイズの自由度の高さをアピールできていない →実例の掲載が少ない 【実施した施策】 ＜全体像＞ ・レイアウト ターゲットの目を引くことができるよう、グリッドを崩したレイアウトにしました。 ・フォント クライアント様の長所「スタイリッシュな住宅デザインを得意としている」事が伝わるよう、Webサイト内のフォントをほぼすべて明朝体としました。 ・ボタン 現状の問題点である「ボタンが目立たない点」を解決させる為、詳細ページへのリンクボタンにアニメーション等を追加しました。 ＜各エリア＞ ・ヘッダーメニュー 「資料請求の数、お問い合わせ数UP」を達成させる為、「資料請求」「お問い合わせ」が目立つようボタンにしました。 各ページにたどり着きにくい作りになっている現状の問題点を解決させる為、トップページのどこを表示していてもすぐにヘッダーメニューのリンクをクリックすることができるよう、スクロールしてもメニューが追従するようにしました。 ・メインビジュアル、コンセプト、実例集 「実例を大きく見せる」事を達成させる為、山田建築事務所が手掛けた内装の写真を大きく掲載しました。 ・イベント情報 「完成見学会に人を集める」ことを達成させる為、直近のイベント情報をトップページに3件掲載させました。イベントへの興味を引き、イベントへ参加するハードルを下げる為、予約の受付状況・日時・場所を掲載しました。 山田建築事務所の強みである「カスタマイズの自由度の高さ」を表現する為、イベント情報エリアのみ写真を変形させました。 →「家づくり」を行う企業であることから、「家」の形にしました。 ・お知らせ イベント情報エリアとの境目をハッキリとさせる為、写真を掲載しました。 →内装の写真にすることで、リニューアルの目的である「実例を大きく見せる」狙いもあります。 ・資料請求 「資料請求数UP」を達成させる為、バナーを作成しターゲットの目を引くよう工夫しました。 ・お問い合わせ 「お問い合わせ数UP」を達成させる為、電話番号とお問い合わせフォームへのリンクボタンを大きめに掲載しました。電話番号だけではお問い合わせのハードルが上がってしまう為、お問い合わせフォームへのリンクボタンも追加しました。