WEBサイトデザイン＜山田建築事務所＞

既存のWebサイトが建築事務所としてパッと見分かりづらい。ブログの写真掲載が趣味のラーメンの写真がほとんどであるため食べ物に目が行ってしまう。何を目的としているか分かりづらいという点からWebサイトをリニューアルするという課題。

ヒアリングシートを元にお客様の目的である『見学会の予約・資料請求・お問い合わせが増えるようにする』ということが達成できるように既存のサイトにイベント一覧や詳細、実例などを追加して見に来られる方が知りたいと思っていそうな情報を多く載せるようにすることで、ここの建築事務所にお願いしたいと思ってもらえるきっかけになるようなWebサイトになるように心掛けて作成しました。

＜ヘッダー＞

・主に見ていただきたいものをメニューとして設定しました。

・電話番号を見やすくし、そのままクリックして電話できるようにしました。

・スタイリッシュでシンプルなデザインの中で他と差別化して、目を聞くようにアクセントカラーを使用しました。また、どちらのボタンもクリックしたことが分かるようにホバー（色が変化する）をつけました。

＜メインビジュアル＞

大きくシンプルにして内観のイメージが少しでも持てるようにしました。

＜イベント一覧＞

メインビジュアルの下に配置したことで、どんなことをしているのか興味をもってもらえるように写真・題名・日時なども分かりやすく載せました。

＜コンセプト＞

写真と文字に強弱をつけることで目に止まるようにしました。

＜実例＞

・写真を大きく載せることでイメージがしっかり持てるようにしました。

・2階、3階、平屋とジャンル分けすることで見に来られる方がより自分が建てたいと思っているものに近いものが選べるように設定しました。また、同時に敷地面積を載せることでより具体的に考えることができるようにしました。

＜フッター＞

・お問い合わせ・資料請求・見学会予約につながるようにボタンを大きくし、見やすく押しやすくしました。背景にも自社の家具の写真を配置することで目に止まるように工夫しました。

・住所・メール・受付時間や定休日などの見に来られる方が知りたい情報を付け足しインスタもやっているとのことだったので、そちらにも行けるように載せました。反対側には会社概要やアクセス方法など気になった方がより情報を見れるようにしました。

《ＳＰ版》

・ヘッダーはハンバンガーボタンを設定することですっきりとよりメインビジュアルに目が行くようにしました。

・お問い合わせ・資料請求・見学会予約ボタンはＰＣと違ってページが長いため下に追尾して気になったときにすぐ押せるようにしました。

・イベントや実例は横並びにすることで、見やすくまとまりが出るようにまとめました。また、コンセプトは写真を大きく見せたかったため上下に配置しました。

・3つのボタンも縦並びにして、SP版になっても小さくならないようにし押しやすいようにしました。