BuildHop is a transformative web application designed to streamline the RFQ (Request for Quotation) process in the construction industry, acting as a dynamic marketplace connecting buyers and suppliers. The platform supports three user roles: Admin, Buyer, and Supplier, each with tailored functionalities to enhance efficiency and collaboration. Buyers can effortlessly create and manage RFQs, suppliers can respond with detailed quotations, and admins can oversee and facilitate the entire process. By simplifying these workflows, BuildHop aims to foster transparent, competitive, and efficient procurement practices within the construction sector.
BuildHop UX Case Study

Context
Overview
My Role
- User Flow
- Wireframing
- Visual Design
- Motion Exploration
Platform
- Web App
Year
- 2023
Challenges
Solutions

1. Recreating the Flow of RFQ Journey
To streamline the RFQ process, we redesigned the entire user journey, making it more intuitive and efficient. By simplifying RFQ creation, submission, and response workflows, users can now navigate the system with ease. This redesign reduces the time required for each step, minimizes errors, and enhances user satisfaction.
2. Simplifying Goods Selection, Cart Management, and Checkout
We streamlined the process of selecting goods, managing shopping carts, and completing the checkout to enhance user experience. This involved creating a more intuitive product selection interface, a user-friendly cart management system, and a seamless checkout flow. These improvements help users make purchases more quickly and with fewer errors.


3. Enhancing the RFQ Creation Experience
We enhanced the RFQ creation process by introducing a more intuitive and guided interface. This new design helps buyers easily input required details, add items, and track the status of their RFQs. The improved workflow reduces complexity and speeds up the RFQ creation, ensuring a smoother and more efficient user experience.
4. Streamlining the RFQ Detail Page Layout
We restructured the RFQ detail page to present numerous details and input elements in a clean, organized manner. By using a clear layout and intuitive design, we made it easier for users to input and review information without feeling overwhelmed. This redesign enhances usability and ensures that even complex RFQs are manageable.


5. RFQ Item List & Comparison Table
We introduced an RFQ item list and comparison table to help buyers evaluate supplier responses more effectively. This feature allows users to compare items side-by-side based on key criteria, simplifying decision-making and ensuring transparency. The enhanced comparison capability aids buyers in selecting the best offers quickly and accurately.
6. Monitoring Offer Submissions and Tracking Outcomes
We implemented a feature for suppliers to monitor their offer submissions and track the status of each bid, providing clear visibility into whether their offers have WON or LOST. This transparency helps suppliers understand their performance and refine future bids, fostering a more competitive and informed marketplace.

The Process
1. Research
2. Ideate
3. Wireframe
4. Design
5. Prototype
1. Research
Our research phase began with in-depth interviews and surveys involving a diverse group of stakeholders in the construction industry, including buyers, suppliers, and admins. We aimed to uncover their specific pain points, preferences, and workflows. This qualitative and quantitative data provided valuable insights into the users’ needs, informing our design decisions and ensuring that BuildHop would address real-world challenges effectively.
2. Ideate
In the ideation phase, we brainstormed multiple solutions to the identified problems, focusing on functionality and user experience. We held several collaborative workshops with stakeholders and our design team to generate innovative ideas and explore various approaches. By prioritizing features and creating user stories, we outlined a clear roadmap for developing a platform that meets the unique needs of each user type in the RFQ process.

3. Wireframe
With a solid foundation of research and ideas, we moved on to wireframing. Our goal was to create low-fidelity sketches that mapped out the core structure and functionality of BuildHop. These wireframes provided a visual guide for the layout of each screen, ensuring a logical flow and intuitive navigation. We iterated on these wireframes based on user feedback, refining them to better align with user expectations and improve overall usability.
4. Design
In the design phase, we transformed our wireframes into high-fidelity mockups. We focused on creating a visually appealing and cohesive design that reflected the professional nature of the construction industry. Using a clean and modern aesthetic, we incorporated intuitive UI elements and ensured consistency across all user interfaces. Color schemes, typography, and iconography were carefully selected to enhance usability and accessibility.
5. Prototype
To bring our designs to life, we developed interactive prototypes that allowed us to simulate the user experience. These prototypes were essential for conducting usability testing with actual users, enabling us to gather feedback on the functionality and design of BuildHop. By observing users interact with the prototype, we identified areas for improvement and made necessary adjustments to enhance the overall user experience.





Summary
The BuildHop UX case study highlights our comprehensive approach to creating a user-centric web app that addresses the specific needs of buyers, suppliers, and admins in the construction industry. From thorough research and ideation to detailed wireframing, design, and prototyping, each phase was crucial in developing a platform that simplifies the RFQ process. The result is a robust and intuitive marketplace that fosters efficiency, transparency, and collaboration among all users, ultimately transforming the procurement practices in the construction sector.