
ツチプラス
- WEBサイト
- サービスサイト
兵庫県全域で、屋根土や壁土など建築現場から出る廃土を回収・処理し、再利用可能な資源としてリサイクルするサービス「ツチプラス」のWEBサイトを制作しました。
運営は、創業100年近い歴史をもつ荻野製瓦工業様。もともと廃土の処理にまつわる課題に直面する中で、「屋根土や壁土を資源として再循環させる仕組みを事業化したい」という構想があり、技術的な実現方法は決まっていたものの、それをいかに社会に届け、広く活用してもらうかについてはまだ白紙の状態でした。
当社は、サービス名やロゴといったブランド開発から、ターゲット像の明確化、情報の整理、サービス内容の見せ方、受注導線の設計に至るまで、サービス立ち上げ時のパートナーとして伴走。ヒアリングと仮説検証を重ねながら、現場の人が「これなら使える」と思える導線とUIを整え、最終的に、価格の目安がその場でわかる概算シミュレーション機能の実装や、現場への導入ハードルを下げる情報整理、Q&Aの整備など、WEBサイトを通じて“サービスの形”をつくっていきました。
mission
(課題・狙い)
- 土の処分に困る潜在的ニーズはあるが、認知が十分ではなく、新サービスとして広く届ける手段が必要だった
- ごみ処理というセンシティブなテーマに対して、堅実で安心感のある企業姿勢を伝える必要があった
- 現場担当者・決裁者の両方にとって「わかりやすく、使いやすい」サービスサイトが求められていた
solution
(やったこと)
- ネーミング・ロゴ開発から携わり、親しみやすく明快なブランドづくりを支援
- ファーストビューに3DCGを使い、目を引くと同時にサービスの特徴をビジュアルで明示
- 概算見積ができるシミュレーターを実装。URLのシェア、印刷対応など現場実務に即した設計
- Q&Aやサービス詳細を細かく記載し、価格・流れ・対応範囲など不安を解消する情報を明示
- 受け入れ拠点を可視化した「施設紹介」ページを設置し、安心材料を強化









design concept
(制作に込めた意図)
-
コンテンツ構成の意図:「こんなサービスが欲しかった」と思われる導線設計
屋根土や壁土の処分について、「どこに頼めばいいのかわからない」「費用感も不明」といった声に応えるべく、ツチプラスでは必要な情報を過不足なく、視覚的に整理した構成を採用。
はじめて土の処理を検討する人でも安心して使えるよう、サービス内容・金額・工程を明示し、「これは使いやすそう」「ちゃんとしていそう」と感じられる印象設計とした。
ターゲットはまず現場の若手。価格や概要を理解したうえで、URL共有や資料印刷を通じて上司へ相談・提案できるよう、導線設計にも工夫を凝らしている。 -
UI/UX設計の意図:現場と決裁者の間をなめらかにつなぐ構造
ファーストビューでは動画と3DCGを活用し、「先進的で、しっかりしたサービス」とひと目で伝わる印象を形成。
概算シミュレーターでは金額感を簡単に把握できるようにし、問い合わせの前に社内相談しやすい状態を構築。Q&Aでは「そもそも何から始めればよいか分からない」ユーザーに向けて、安心材料と基礎情報を自然に提供する設計とした。
各ページは、現場担当者と決裁者の双方にとって過不足のない情報量と構成を意識し、必要なときに必要なだけの情報をストレスなく取得できるよう整理している。 -
ビジュアル演出の意図:「ちゃんとしている」ことを、明るく・今風に伝える
全体のトーンは、業界にありがちな堅苦しさや古めかしさを排除し、ポップで整った印象に統一。カラーリング、タイポグラフィ、レイアウトは「安心感」「見やすさ」「軽やかさ」のバランスを追求。
トップの動画と3DCGは、動きのあるビジュアルでスケール感と信頼性を演出。しっかりしたサービスであることが、説明よりも先に“感覚的に伝わる”ように設計。
Q&A、料金表、フロー解説などの各要素も、情報密度と余白のバランスを整え、「書いてあるから安心」「読めば理解できる」と思える導線を丁寧に構成している。
- 土の処理を初めて検討するユーザーにも「安心できる、わかりやすい」と思ってもらうことを最優先に設計
- 現場担当者が自信を持って社内提案できる構造と、印刷・共有しやすい情報配置を整備
- 金額・流れ・対応範囲など、迷いや不安のもとになる要素を“先回り”して解消するコンテンツ設計
- トーンはあくまでポップで開かれており、業界特有の堅さを払拭しつつ、信頼性のあるビジュアルに落とし込んだ
- 情報・構造・空気感のすべてにおいて、“頼りやすくて、ちゃんとしている”という印象を徹底的に可視化
project data
(プロジェクト詳細)
- Client
- 有限会社荻野製瓦工業
- Date
- 2024.6
- URL
- https://tsuchi-plus.com
- Director
- 有賀 史朗
- Designer / Coder
- 有賀 史朗
- Photographer
- 竹内 吉崇