はじめに
業界向けアプリでは、使えることが最優先です。
特に建設業界では、現場でスマホを使うこと、デジタルに強い人ばかりではないことを前提に設計する必要があります。
Mate-Re: でも、UI/UXは機能以上に重要な開発テーマでした。
使いやすさの前提は「迷わないこと」にある
今回のヒアリングで特に重要だったのは、使う人がデジタルにそこまで慣れていない可能性があるという点でした。
そのため、操作説明がなくても何をすればよいか分かることを意識しました。
複雑な導線や多すぎる入力項目は、それだけで離脱要因になります。
ホーム画面では、大きな写真が仕入れ判断を助ける
Mate-Re: では、ホーム画面の大きな写真が重要な役割を持っています。
見た瞬間に商品の状態が把握しやすく、傷や使用感の確認がしやすいからです。
建材売買では、一覧の見やすさがそのまま仕入れ効率に直結します。
そのため、見た目の派手さよりも、判断しやすいレイアウトが優先されました。
現場で使うなら、屋外での視認性も重要になる
スマホアプリは室内利用だけを前提にできません。
現場で使う以上、文字の視認性や屋外での見やすさも考慮が必要です。
Mate-Re: では、画像による状態把握のしやすさに加え、文字情報の見やすさも重視しました。
業務感を出しすぎず、親しみやすさを残す
業界向けアプリというと、無機質で固い画面になりがちです。
しかし、日常的に使ってもらうには、必要以上に業務感を強くしすぎないことも大切です。
Mate-Re: では、実務に耐える信頼感を保ちつつ、親しみの湧きやすいデザインに寄せました。
まとめ
建設業界向けUI/UXで重要なのは、多機能さではなく判断のしやすさです。
撮って、見て、選んで、取引につなげる。
その流れが自然であることが、現場利用のしやすさにつながります。
Mate-Re: は、業界向けアプリに必要なUI/UXの基礎を丁寧に形にした事例です。
.webp%3Falt%3Dmedia%26token%3D75fd3fa7-8269-44b4-8b59-f1bd459a5963&w=3840&q=75)


.webp%3Falt%3Dmedia%26token%3D45131e3d-4777-421a-a556-bcc8d462dfe1&w=3840&q=75)
.webp%3Falt%3Dmedia%26token%3D09daf923-4a62-4c31-af6f-f3d99a9f635b&w=3840&q=75)
.webp%3Falt%3Dmedia%26token%3D0e63e93b-1558-48a5-8b24-d1ae7cfa487f&w=3840&q=75)
.webp%3Falt%3Dmedia%26token%3D240fcc34-b7e7-4c86-b294-fdfc2a66db21&w=3840&q=75)
.webp%3Falt%3Dmedia%26token%3Db288c602-2902-4f93-8eca-903ec8f86440&w=3840&q=75)
.webp%3Falt%3Dmedia%26token%3D3c4b1b17-9fec-405e-9e02-8d34961b6f16&w=3840&q=75)
.webp%3Falt%3Dmedia%26token%3D2af23217-76a2-4dde-883e-600ff36d9bb9&w=3840&q=75)
.webp%3Falt%3Dmedia%26token%3D1f1ea250-1292-49e6-acf0-9b33c26034a9&w=3840&q=75)
.webp%3Falt%3Dmedia%26token%3Dc40f5a1d-8c2b-4ac8-b5bf-d42e047a1b1d&w=3840&q=75)
.webp%3Falt%3Dmedia%26token%3D55c1932e-e65e-44b7-8c43-19ab4e0b1d89&w=3840&q=75)
.webp%3Falt%3Dmedia%26token%3Dc4744483-d9d2-448a-bd92-315b6c8ffb55&w=3840&q=75)
.webp%3Falt%3Dmedia%26token%3Dbcbc4c92-0eda-4146-a074-8df2662f3e48&w=3840&q=75)
.webp%3Falt%3Dmedia%26token%3D3b1fcd63-26aa-4db5-8b12-2e14b6047c3c&w=3840&q=75)
.webp%3Falt%3Dmedia%26token%3D0e318707-29a2-43fe-9631-456edc02f06c&w=3840&q=75)
.webp%3Falt%3Dmedia%26token%3D2c695bda-469b-4b44-97f8-0e06f4899329&w=3840&q=75)
.webp%3Falt%3Dmedia%26token%3D270d4df8-1139-4f9a-9b31-d86d9a3f1518&w=3840&q=75)
.webp%3Falt%3Dmedia%26token%3D56b8ebed-526b-4ec2-9053-51f8e1c54c0f&w=3840&q=75)
.webp%3Falt%3Dmedia%26token%3D911b29dc-17f8-4349-963d-598bf6685add&w=3840&q=75)
.webp%3Falt%3Dmedia%26token%3D6040f2d9-1a54-476c-9999-5e0aeb8e8a74&w=3840&q=75)