オプション選択サイト

trefac_technologies

クライアント:ヒノキヤグループ様

プロジェクトの概要

営業担当者のPDFを、
お客様の指先で選べる
シミュレーターへ。

ひのきy 様で住宅購入を検討中のお客様に向けて、キッチン・バスルーム・外壁など各部屋のオプションを Web 上で選択・保存できる仕組みを構築しました。営業担当者がこれまで PDF とパンフレットで説明していた内容を、お客様自身がご家族と検討できるかたちに置き換えたプロジェクトです。

Client
株式会社 桧家住宅
Industry
住宅・不動産
Scope
UX 設計・UI・実装・PM
Timeline
約 6 ヶ月(2025)
HINOKIYA オプション選択シミュレーター
01 — Context

紙とPDFに頼っていた提案フロー住宅購入後の”オプション選定”という長い時間

住宅の契約後、実際に着工するまでの間、お客様はキッチン、浴室、外壁、電気設備、収納…と数百のオプションから住まいの仕様を決めていきます。ヒノキヤ 様ではこれまで、営業担当者が PDF やパンフレットを用いた対面商談で選定を進めていました。

しかし現場では、選択肢の多さと時間の制約から、”営業担当者に勧められたまま決める”という状況が生まれがちでした。お客様側の「自宅で家族と比較したい」「一度持ち帰って考えたい」という声にも、紙の資料では十分に応えられません。

Problem 01

紙の資料が最新版か判断しづらい

PDF・パンフレットは差し替えのたびに配布し直しが必要。営業拠点ごとにバージョンがずれるリスクもありました。

Problem 02

選択肢の全体像が見えない

カテゴリを跨いだ横断的な比較(例:ペットに優しい仕様を家全体で揃える)は、紙では極めて困難でした。

Problem 03

家族での検討時間が取りにくい

営業担当者との対面時間内で決めきる必要があり、後から気持ちが変わったときの反映コストが高い状態でした。

Problem 04

集計・見積の作り直しが重い

プランを微修正するたびに、営業担当者が手作業で電卓を叩く。ヒューマンエラーも避けられませんでした。

02 — Approach

営業の”対話の流れ”をそのまま設計に持ち込むWeb に置き換えるのではなく、対話の道具として再設計する

最初に行ったのは、営業担当者の商談への同行取材です。どのタイミングでどの資料を開き、どの順番で説明し、お客様がどこで質問するのか。8 件の商談に立ち会い、”紙の順序”ではなく“お客様が知りたい順序”で情報設計を再構築しました。

特に大切にしたのが、既存の営業担当者を置き換えるのではなく、営業と並走できる道具にするという視点です。営業担当者が事前に組んだ「おすすめ案」を土台に、お客様がご自宅で微調整する、という双方向のフローを軸に据えています。

03 — Solution

4つの主要画面が、選定体験を組み立てる選ぶ・比べる・保存する。それぞれの動作に一枚ずつ。

トップ / 見積画面 1 2
Screen 01 · Top

営業担当者の「おすすめ案」から始める。

お客様は白紙ではなく、営業が事前に組み立てたシミュレーションを土台に検討を始められます。合計金額は常に画面上部に固定表示。

  1. 1
    大きなカバー写真で”住まい”を思い出させる

    抽象的な商品リストではなく、購入する家のイメージから入る導線設計。

  2. 2
    「営業おすすめ案」名の編集

    ご家族ごとに複数プランを持てるよう、名前を編集し保存可能に。

オプション一覧 1 2 3
Screen 02 · Category list

家一軒分の判断項目を、一本のスクロールへ。

設備・電気・外装まで約 20 カテゴリを俯瞰。各行から「オプションを選択」で最短 2 タップで詳細へ。

  1. 1
    合計金額のピン留め

    スクロールしても常に見える位置に固定。予算感を保ちながら選べる。

  2. 2
    カテゴリごとの現在選択

    「今どれを選んでいるか」を写真と品名で明確に。

  3. 3
    右カラムで補助カテゴリを網羅

    バルコニー・屋根材・外装材など判断粒度の粗い項目を並列表示。

キッチン詳細 1 2 3
Screen 03 · Item detail

ショールームに近い密度で仕様を伝える。

写真、カラー、扉素材、寸法図、注意事項までを 1 画面に。営業が口頭で伝えていた”暮らしのなかでの使いこなし”まで補完します。

  1. 1
    暮らし軸のハッシュタグ

    #掃除が楽 #ペットフレンドリー など、生活シーンで選ぶ判断軸を提供。

  2. 2
    寸法図・注意事項の並置

    カウンター高さ・レンジフード型番など、後戻りしにくい仕様を先に確認できる位置に。

  3. 3
    扉素材のサンプル

    色見本は最小サムネイル + 拡大 UI。実物を想像しやすい情報密度に調整。

Screen 04 · Discovery

ランキングとハッシュタグ、2つの探し方。

「他の方が採用している人気の仕様」を採用ランキングで、「暮らし方軸」をハッシュタグで。カテゴリを跨いだ横断検索を可能にしました。

  1. 1
    採用ランキング

    同価格帯・同世代の採用状況を可視化。「みんなが選んでいる安心」を導線に。

  2. 2
    ハッシュタグ検索

    #ガーデニング #二世帯住宅 など、暮らしの言葉から全カテゴリを横断。

ランキング/ハッシュタグ 1 2
04 — Outcome

数字と、現場の声。紙資料の全廃、そして”検討時間”の変化。

Paper materials
90%削減

オプション選定にかかる対面用の紙資料を全廃。営業拠点ごとの版ズレも解消。

Family discussion time
2.3

お客様が自宅でシミュレーターに触れる時間が、対面商談での検討時間の平均 2.3 倍に。

Quote turnaround
1/5

プラン微修正から見積再発行までの所要時間が、従来比 1/5 に短縮。

「紙で説明していた時と比べて、お客様がご家族と相談する時間が自然に長くなりました。
商談の場では”迷い”より”確認”が中心になり、こちらも本当に伝えるべきことに集中できています。」
— ヒノキヤグループ / 営業推進担当
Similar project?

「営業資料のWeb化」
ご相談を承っています。

紙・PDF・Excel で運用されている業務を、お客様と現場の両方が使えるインターフェースに置き換える設計を得意としています。

お問い合わせ