高野設備
- 制作概要
-
千葉県成田市を拠点に給湯器の交換・取り付け工事を行う、高野設備様の新規Webサイト制作を行いました。
ディレクション・デザイン・コーディングまで一通り対応いたしました。
ターゲットユーザーがどんな情報を求めているのかを細かく分析し、より効果的な成果が出せるよう創意工夫いたしました。 - 担当範囲
- Direction / Design / Coding
- 制作期間
- 2020.6〜2020.7
- レスポンシブ
- スマートフォン / タブレット / PC
- 使用ツール
- Photoshop / AdobeXD
- 使用言語
- HTML / CSS / Sass / Javascript
- 備考
- 本サイトの企画書はこちら
サイト概要
安心して任せられる、地域密着型の工事業者
価格で勝る競合と差別化を図るため、ターゲットに合わせたコンテンツ掲載と導線設計を重視
ペルソナ
価格よりも対応の早さ・親切さを重視する主婦
田中明美さん(50)
- 夫(51),息子(22),娘(18)の4人家族
- 主婦、週に3〜4日アルバイト
- 世帯収入は700万円、住居形態は持ち家
- 外交的な性格で、休日は友人とランチや日帰り旅行にいく
- 物事を決める際は、価格よりも安心感を重視
ペルソナの策定理由
- 電気・ガス・水道などインフラ周りの管理は、奥様が行うことが多いと想定
- 価格では競合に勝てない為、ある程度生活に余裕のある中所得層を策定
- 住居形態が賃貸の場合、管理会社・大家に相談を行うため、自身で工事業者を選べる持ち家層を策定
ユーザーフロー
- <流入経路>
- 検索エンジンからの自然検索
- <シーン>
- 自宅のリビング
- <状態>
- 給湯器が故障しお湯が出ないため、インターネットで工事業者を探す
- <導線>
-
- 検索エンジンで「給湯器 交換 成田」と検索
- 検索結果から本サイトをクリック
- なんとなく良さそうだとは思うが、判断材料が足りないため「工事にかかる費用」などの下層ページを閲覧
- 工事を依頼したいと思い、問い合わせを行う
コンテンツ
伝えたい情報を伝えるのではなく、ユーザーが欲しい情報を伝える
| 背景 | ニーズ | コンテンツ案・ ベネフィット |
|
|---|---|---|---|
| 導 入 |
給湯器が故障した | すぐに給湯器が使えるようにしたい | ・対応の速さ ・親切さ 温かみのある雰囲気で安心感を持ってもらう |
| うちの症状でも解決してくれるの？ | どんな症状が対象なのかが知りたい | ・症状一覧 ユーザーの事例でも解決できることを訴求 |
|
| 情 報 収 集 |
すぐに対応してもらえるの？ 安心して任せられそうか？ |
作業までの流れ、サポートについて知りたい | ・工事までの流れ ・最短即日工事 ・充実サポート 対応の早さ、親切さを訴求 |
| 交換・修理どちらがいいの？ | 交換・修理の目安が知りたい | ・メーカー保証 ・耐用年数 ユーザーがどうするべきなのかイメージが持てる |
|
| 比 較 検 討 |
費用はどれくらいかかるの？ どの給湯器を選べばいいの？ |
工事費用・自分に合った給湯器が知りたい | ・工事にかかる費用 ・給湯器本体の費用 カテゴリー毎に選べるように設計し、迷わない |
| 行 動 ・ 決 定 |
工事を依頼したい | 問い合わせをしたい、工事日を決めたい | ・電話問い合わせ ・メール問い合わせ ページ下部へ固定し、すぐに問い合わせができる |
情報設計
最初から商品の訴求は行わず、ユーザーの信頼を得ることに注力
- 親切な対応を表現するため、メインビジュアルには作業員がお客様に丁寧に説明を行っている様子を掲載
- コンセプトに基づきトップページでは商品の訴求は行わず、ユーザーのお困りごとに関するコンテンツを掲載
- 意思決定時にすぐ問い合わせできるよう、ウインドウ下部に問い合わせボタンを固定表示
- 各下層ページの最下部には問い合わせコンテンツを掲載
※スマホ時にはタップで電話をかけられるが、メモを控えることも想定し、電話番号を掲載
デザイン
お急ぎ・お困りの方でも安心できる、温かみのあるサイト
- ベースカラーに白、メインカラーに茶色、アクセントカラーにオレンジを用いて、シンプルながらも安心感・温かみを表現
- 写真や図を多く用いて、文字量が多くならないよう表現
- コントラストや影をつけ、クリックできるものとできないものが直感的にわかるよう表現