事前調査でUIUXを向上、戦略的サイトを制作

リニューアル前に行った３つの事前調査の１つ目が「ヒューリスティック評価」です。
この調査の特徴は現サイトのネガティブ要素を洗い出し、実現性の高い具体的な改善案を提示するもので、改善効果に即効性があります。
また、課題はカテゴリ別でスコア化し、総合評価を5段階でランク付けされます。
今回の総合評価は5段階の最低の「E」で極めて厳しい結果でした。これは、サイトの目的や用途に大きな影響を与える問題が存在し、早急な修正が必要な状態であることを示しています。
合計で30項目のユーザビリティ上の課題が抽出されました。そのうち、重要度が特に高い致命的な課題は10項目にのぼり、改善による「伸びしろ」が非常に大きい状態であると分析されています。

以下は調査で露呈した課題例です。
■特に深刻な「3つの課題傾向」
抽出された課題の中でも、以下の3点が「致命的な水準」として特定されました。
• 信頼感・安心感の欠如： サイト自体が何であるかを定義・説明するページがなく、ご利用ガイドも見つけにくい場所に配置されている。
• 分類・サイト構造の不備： 構造がユーザーニーズに基づいておらず、結果として「どこに何があるかわからない」状態になっている。
• 文章・用語の乖離： 各メニューのラベル（命名）が提供者側の目線で作られており、ユーザーにとっては意味不明な用語が多い。

■具体的な改善指摘事項（抜粋）
• ナビゲーション： グローバルナビゲーションに一般名詞、固有名詞、動詞が混在しており、一貫性がない。
• レイアウト： PC版においてメイン画像が大きすぎ、標準的な画面サイズでは下部の重要な情報に気づきにくい。
• フォーム： 新規会員登録で「必須」の表示が記号（※）のみでわかりにくく、郵便番号からの住所自動入力機能も備わっていない。
• ログイン導線： ログイン画面のファーストビューに「新規登録ボタン」が入っていないため、未登録者が登録できることに気づかない可能性がある。

■評価の目的と活用
この調査は、現状のネガティブな要素（ユーザーの離脱やストレスの原因）を洗い出す「ネガティブチェック」として実施されました。ここで特定された課題は、後の工程であるワイヤーフレーム（画面設計図）へ直接反映され、利便性を抜本的に高めるための土台となります。

アクセスログ分析（定量調査）の結果、これまで主観的な感想にとどまっていた「使い勝手の悪さ」が具体的な数値として露呈しました。

主な課題は以下の4点に集約されます。
1. 玄関口（トップページ・コラム）での高い離脱率
サイトの「顔」であるトップページの直帰率が35％コラムページ（例：庭づくり）の直帰率は93％「読んで終わり」の状態になっていた。

2. 弱すぎるメイン導線
トップページからの遷移を分析したところ、本来サイトが注力すべき**主要サービスへの誘導は、合計してもわずか6％しかありませんでした。
一方で、ログインページへの遷移（17〜18％）や、「ID・パスワード忘れ」への遷移（2％）**が多く、ユーザーが目的のサービスに辿り着く前に認証プロセスでつまずいている実態が浮き彫りになりました。

3. デバイスによる利用目的の乖離
デバイス別の行動分析により、PCユーザーは「コンテンツの閲覧」を重視し、スマホユーザーは「各種手続きや問い合わせ」を重視するという明確な傾向の違いが判明しました。
当時のサイトはこのニーズの差に対応できておらず、特にスマホで「電話問い合わせ一覧」への流入が多いにもかかわらず、入力フォームへの導線が不十分であるといった機会損失が発生していました。

4. 主力サービスのコンバージョン（CV）導線の欠如
ビジネス上の主力である「ハウスケア（住宅設備）」ページにおいて、フォームへの到達率がわずか1％アクションを促すUI（ボタン配置や配色）が最適化されていないことが原因でした。

ECマーケティングのベンチマーク評価は単なる同業比較ではなく、マーケティング上で競合となりうる異業種サイトも含めて横断調査するのが特徴的です。
この手法により、異業種の優れた要素も取り込むことができ、Webサイトのマーケティング完成度を底上げすることができます。

ベンチマーク評価の対象として選定されたサイトの種類は、以下の4つのカテゴリーです。
• オーナー向けサイト（1サイト）
• 会員向けマーケティングサイト（2サイト）
• 住宅・リフォーム関連マーケティングサイト（2サイト）
• 情報・マーケティング連携型ポータルサイト（2サイト）
これらのサイトは、サイト構造、ナビゲーションの整理、商品・サービスへの誘導強化といった「ヘーベリアンネット」の課題解決に役立つ要素を抽出するために選定されています。

ベンチマーク評価で挙がった課題のポイント（抜粋）は以下となります。
ベンチマーク評価（競合・他社比較）を通じて抽出された課題と、改善による「伸びしろ」のポイントは、合計で17項目にのぼります。
これらは、ヘーベリアンネット固有の課題に踏み込んだ「応用編（7項目）」と、マーケティングサイトとしての「基礎編（10項目）」に分類されています。

主な課題と伸びしろのポイントは以下の通りです。

【1】サイト構造・ナビゲーションの刷新
提供者目線からユーザー目線への転換：
従来のサイト構造や項目名（ラベリング）は、提供者側の区分（媒体別の注文方法など）で構成されており、ユーザーには分かりにくい状態でした。
ベンチマークサイト（クラブツーリズム等）を参考に、「商品を検索する」「学ぶ・参加する」といったユーザーの行動やサービス内容に基づく分類へ再構築する方針が示されました。

ハブ機能の強化：
複数存在する社内サイトをスムーズに連携させるため、共通ヘッダーの導入やカテゴリトップへのリンク設定を行い、サイト全体の回遊性を高める設計が検討されました。

【2】トップページの最適化
ファーストビューの有効活用：
以前のサイトはメイン画像が大きく、重要な情報が画面外に押し出されていました。
他社事例を参考に画像を適切なサイズ（1/3程度）に収め、「会員メリット」などをファーストビュー内に配置することで、利用を促す設計へと改善しました。

パーソナライズ化：
ログイン前後の状態に合わせて表示内容を切り替える（例：未登録者にはメリットを、ログイン後にはおすすめ情報を表示）ことで、CRM（顧客関係管理）視点での利便性向上を狙いました。

【3】商品・サービスページのテンプレート化
「売れる」ためのUI設計：
読み物系ページと商品ページの区別が曖昧だった点を改善し、「1カラム構成」「スクロールに追従するコンバージョンボタン（お申込み・お問合わせ）」
「詳細情報を整理するフローティングタブ」といった要素を盛り込んだテンプレートを作成しました。
これにより、住宅設備やリフォームといった主力サービスへの誘導率を最大化させる「攻め」の設計を実現しました。

【4】マイページおよび会員機能の拡充
利便性の高い会員基盤：
記憶しにくい独自のIDではなく、メールアドレスをIDとして兼用できるトレンドを採用し、ログインの心理的ハードルを下げました。
また、お気に入り機能や履歴確認など、マイページ機能の将来的な拡充も改善ポイントとして挙げられました。

【5】サイトの自己定義と信頼性
「自己紹介ページ」の新設：
「このサイトで何ができるのか」を定義するページがなかったため、「ヘーベリアンネットとは」という自己紹介ページを新設し、サイトの全体像と利用メリットを明確に伝える工夫がなされました。

これらのベンチマーク評価の結果を例えるなら、「繁盛している近隣のセレクトショップを徹底調査し、自店舗の分かりにくい看板やバラバラだった棚割りを、お客様が最も買い物をしやすい黄金律に沿って整え直した」と言えます。この調査に基づき「攻めの施策」をワイヤーフレームやWebデザインに盛り込んだことが、リニューアル後の過去最高売上達成へと繋がりました

事前調査の結果を活用し、ワイヤーフレーム作成およびWebデザインにおいて以下要素を踏襲した新サイトが完成しました。

【1】ユーザー目線に基づくサイト構造の再構築
提供者側の区分（媒体別の注文方法など）ではなく、ユーザーが直感的に理解できる「商品・サービス」中心の分類へ刷新しました。
例：提供側区分からユーザー側区分へのラベリング変更案

【2】 回遊性を高めるハブ機能の強化
オンラインショップを単なる物販の場とせず、リフォーム相談や資料請求など、社内の各サービスサイトへスムーズに橋渡しする「ハブサイト」としての機能を設計しました。

【3】コンバージョン（CV）導線の最適化
商品ページにおいて、画面をスクロールしても「お申込み・お問合わせ」ボタンが常に表示されるフローティングUIを採用。また、基調色とのコントラストを考慮したデザインにより、クリック率の向上を図りました。 例：1カラム化とフローティングUIの導入

【4】スマートフォン対応の最適化
デバイス分析に基づき、PCは「コンテンツ閲覧」、スマホは「各種手続き・問い合わせ」を重視するユーザー傾向に合わせ、レスポンシブデザインの精度を高めました。

【5】効率的な制作体制の構築
既存の制作会社とのフォーメーションを維持しつつ、調査・分析・設計および主要ページの制作をコンサルティング会社（ECM）が担当することで、スムーズなリニューアルを実現しました。

【6】PDCAを回すためのKPI設計
リニューアルして終わりではなく、トップページからの直帰率、ログイン遷移率、カテゴリ別のCVR（転換率）などをKPIとして設定し、継続的な改善が可能な運用体制を構築しました。

※会員専用サイトのため、ログイン領域の画像掲載は割愛しています。

■Webサイトリニューアル成功ポイント
リニューアル前のトップページは、情報が整理されておらず、サイトの定義（何ができるサイトか）を説明するページも欠如していました。
【リニューアル前のトップページ構成】 ※ソース資料 より：リニューアル前のトップページ（PC版）の構造
リニューアル後は、「ヘーベリアンネットとは」という自己紹介ページを新設し、ログイン前後のパーソナライズ化、および目的別ナビゲーションを強化したことで、UI/UXにおける満足度の高いサイトへと生まれ変わりました。
本プロジェクトは、単なるデザインの変更にとどまらず、データに基づいた「売れるための設計」を徹底したことで、単月過去最高売上という目に見える成果を達成しました