ANA BRINGAS
UX | Product Designer
Construction Calculator
The Ke Obra website is an ongoing project by CEMEX Ventures, designed to assist individuals in planning and executing their construction projects. It offers a wealth of resources and information, catering to both experienced builders and those new to construction.
​
One of the standout features of the Ke Obra website is the "Construction Calculator," a tool devised to estimate the cost and timeline for construction resources. To enhance the user experience, the KeObra team sought to validate the mobile version of this calculator. I conducted a comprehensive study, which encompassed user testing, user interviews, and a heuristic evaluation of the existing calculator.
In the subsequent phase, the Ke Obra team developed a prototype of the calculator. Consequently, I conducted a second round of interviews and testing, this time conducted remotely.
​
Following the studies conducted in 2020, the calculator underwent refinements and is set to be launched in its second release in November 2020.
Phase 1
Usability Testing and Interviews
The interviews and usability testing aimed to address several key questions:
​
-
Identifying pain points in the KeObra mobile version.
-
Evaluating the clarity of instructions provided.
-
Assessing whether users successfully completed the user flow.
-
Gauging user comprehension of the presented results.
-
Determining if users were able to download the PDF of the cost breakdown.
-
Understanding whether users found the calculator to be a useful tool for their needs.
​
Regarding participant recruitment, the Ke Obra team's support was instrumental in selecting suitable candidates. The platform caters to two distinct user profiles: Builders and Self-builders (individuals not from the construction industry but looking to undertake construction projects themselves). As a result, we recruited a total of 10 participants, evenly distributed between these two profiles.
​
Before the testing sessions commenced, participants were asked to review and sign a confidentiality agreement and consent form.
Here are some specifics about the testing sessions:
-
Location: Construrama in Cuautitlan Izcalli, Mexico City
-
Date: March 6, 2020
-
Device Used: Mobile
-
Incentive: Cash
​
During the sessions, participants engaged in exercises involving platform usage, where they were encouraged to express their opinions, such as providing input on materials to purchase. Following the calculator testing, participants participated in an interview where they answered various questions.
Daniela Hernandez, who is a UX Designer, Pedro Núñez, a Constructor, and myself.
Findings
The data was gathered and analyzed following the completion of usability tests with the participants.
For the purposes of this presentation, only the four primary pain points and corresponding recommendations are included.
Pain point 1
​
Usability Issue: Users struggle to locate the construction calculator.
​
During our testing, we observed that 50% of the participants (5 out of 10) were unable to discover how to access the calculator. Surprisingly, they did not explore the hamburger menu, where it is located. Instead, they attempted to find it in alternative sections such as "Plan" or "Build."
​
Heuristic Evaluation Findings:
-
Recognition Over Recall: To enhance user experience, it is imperative that users can intuitively locate the desired functionality without having to recall where it might be hidden within the interface.
-
Match with the Real World: The buttons within the interface lack typical button design elements, leading to potential confusion. Additionally, they suffer from poor contrast, further complicating their usability.
​
Recommendations:
-
Rephrase Terminology: Consider substituting the term "Calculate" with a more user-friendly word that better conveys the action of estimating construction costs within the context.
-
Button Redesign: Revamp the button design to improve accessibility and ensure it aligns with typical user expectations. This should involve addressing issues related to contrast for better visibility.
Pain Point 2
​
Usability Issue: Users inadvertently return to the initial stage.
During our testing, we identified a significant concern: 40% of users (4 out of 10) unintentionally exited the process, resulting in the loss of unsaved changes. This caused considerable frustration, as they were compelled to restart the process.
​
Heuristic Evaluation Findings:
-
Error Prevention: It is essential to assist users in recognizing, diagnosing, and recovering from errors, especially when they accidentally exit the process.
-
System Status Visibility: Users should have clear visibility into the system's status, ensuring they are aware of their progress.
​
Recommendations:
Add Preventive Modal: Implement a preventive modal dialog that prompts users to confirm their intention to exit. This dialog should also alert them that their unsaved changes will not be preserved. Since user registration is not currently available to save progress, this measure can help prevent accidental exits and minimize user frustration.
Pain Point 3
​
Usability Issue: Users struggle with progressing to the next section.
​
In our usability testing, we encountered an issue where 40% of users (4 out of 10) encountered difficulty in advancing to the next section. Specifically, they selected an option but failed to click the "Continue" button. This raises the question of whether the "Continue" button is necessary in its current form.
​
Recommendation:
Usability Testing Variation: Conduct a different usability test to evaluate the necessity of the "Continue" button. If it is determined that the button is redundant, consider removing it and implementing a stepper or progress indicator to help users track their progress more intuitively.
​
Accessibility Concerns:
-
Radio Button Visibility: The light gray color of the radio buttons results in poor visibility against the background. To enhance accessibility, consider using a darker color to make the buttons more discernible.
-
Font Size and Button Visibility: The font size used for "Continue" and "Previous" buttons is small, making them challenging to read. Consider increasing the font size or enlarging the buttons to improve visibility and usability.
-
Accessibility of Button Colors: The color combination used for the "Continue" button is not accessible. To ensure adherence to accessibility standards, consider changing either the background color or the text color to achieve better contrast.
Pain Point 4
​
Usability Issue: Users struggle to comprehend the features of the final section.
In our usability testing, we identified an issue where 30% of users (3 out of 10) faced challenges in understanding how the total cost was calculated and the breakdown of materials in the final section. While they grasped the overall result, they struggled to comprehend the detailed breakdown. Additionally, they encountered difficulty in locating the PDF containing result details.
​
Heuristic Evaluation Findings:
-
Aesthetic and Minimalist Design: The design should prioritize relevant information, avoiding the inclusion of excessive or irrelevant information. Overloading a dialogue with unnecessary data competes with the visibility of pertinent information units.
​
Recommendations:
To address these concerns, we propose the following steps:
-
In-Depth User Flow Evaluation: Conduct a comprehensive examination of the user flow within this section to pinpoint areas where comprehension issues arise.
-
Redesign Consideration: Evaluate the content and information architecture (IA) of this section for potential redesign. Focus on presenting information in a more user-friendly and understandable manner.
-
Download Notification: Implement a system notification to inform users when a file has been downloaded to their device. The current system lacks this indication, which can lead to user confusion.
Phase 2
Usability Testing
In May 2020, the Ke Obra team and I collaborated on a design sprint focused on enhancing the calculator for its second release. During this sprint, I actively participated in various activities, and as part of my role, I led the user testing and interviews. Given the prevailing Covid-19 conditions, we strategically designed the study to be conducted remotely.
​
Subsequently, I executed the tests and interviews using Zoom, a remote communication platform. Following the completion of these sessions, I presented the findings and results to the team, facilitating their design iteration process.
Conducting a remote usability test for a prototype.