Constructing App — UX Case Study: PanPro-Pantau Proyek

Nabila Rozan Humairoh
DOT Intern
Published in
7 min readMay 7, 2024

What is PanPro

PanPro is an application designed to bring your dream home to life, from initial design to a fully inhabitable house, all in one app.

PanPro is a business innovation that got the top five accolades in the 2022 business idea competition. The team behind PasangLagi is called Kanori, consisting of three individuals: Hacker, Hustler, and myself as the Hipster.

Background

Is it better to build a house or buy a ready-to-live-in house?

Certainly, there are pros and cons to both options. Sometimes, when buying a ready-to-live-in house, it may not meet our expectations, either in terms of the house’s design or its overall condition.

If we build our own house, we can get the house we envision within a more efficient budget. However, building a house is a complex and cumbersome process. On the other hand, those in their productive years, focusing on their careers or families, may not want the hassle of dealing with the construction of a house. This is the main background behind the creation of this application.

Goals

The goal of this case study is to create innovation and solutions through an application for those who aspire to own a home that meets their expectations without directly engaging in the construction process, particularly for individuals who are focusing on their careers or families.

User Interview

The target users for the interviews have the following criteria:

  1. Productive age, already working, aged between 20–40 years.
  2. Employed or Adults.
  3. Interested in building a house but sufficiently busy.
  4. Reside in urban areas.
  5. Actively use mobile phones.

Role & Responsibility

As a hipster, i have the responsibility to:

  1. Conducting UX research with users.
  2. Helping to define the user flows.
  3. Creating sitemap, wireframe, and mockup.
  4. Presenting the wireframe and final mockup.

Design Thinking Metode

I am using a familiar method, namely the design thinking approach. The stages include:

1. Empathize

In the empathize stage, I conducted interview to a few people and an online survey to gather pain points from users currently engaged in house construction.

2. Define

After completing the empathize stage, I attempted to detail various issues and challenges into five problems, including:

Problems :

  1. Hassle in managing house construction (main problem).
  2. Difficulty in finding professional workers/services.
  3. Trouble in calculating construction costs.
  4. Difficulty in monitoring due to time and location constraints.
  5. Limited access to communication with workers.

HMW (How Might We) :

  1. How might we enable users to build a house without hassle and complications?
  2. How might we help users find professional workers?
  3. How might we provide users with the ability to predict construction cost calculations?
  4. How might we empower users to monitor their house construction from anywhere and anytime?
  5. How might we facilitate easy communication between users and workers?

3. Ideate

All-In-One App

Creating an All-In-One application that integrates all stages and needs of house construction, from initial design to a ready-to-live-in house, within a single application. The features of this application include:

  1. Construction Progress Monitoring: This feature is designed to help users track the progress of their house construction from anywhere and anytime without the need to visit the location. It provides details on costs, estimated time, and the number of construction workers on the project.
  2. Construction Consultation: This is the initial stage of house construction where users consult with vendors or workers about their construction needs.
  3. Construction Cost Estimation: In addition to consultation, users can estimate the construction costs. The presence of this feature aims to address budgeting issues and minimize construction waste.
  4. Preferred Construction and Architect Services: The app offers experienced and professional construction and architect services. Users can consult with these services before agreeing to start the construction.
  5. Reminder Calendar: This feature includes a schedule of activities on specific dates, serving as a reminder for important milestones in the construction process.

User Flow App

  • Beginning the Construction of a House
  • Monitoring the Construction Progress

4. Prototype

Design System

  • Style
  • Component

High-Fidelity

  • Problem 1

The sections on this homepage are designed to provide important information and shortcuts so that users don’t have to bother clicking on other buttons to see the progress of their home, among other things. There are several views, including the latest construction progress, home building or renovation features, some innovations, and news.

  • Problem 2 dan 3

The presence of consultation and calculation features aims to allow users to assess the professionalism of workers during consultations. Before users build a house, a consultation phase will be conducted with available professional workers in the application. This consultation phase includes discussions related to the calculation of construction costs and also the design of the house. After that, the user simply needs to approve to start the construction of their home.

  • Problem 4

This page aims to enable users to monitor construction anywhere and anytime with just one application. On the project page, it displays ongoing projects. The display is concise and shows only important information related to the project, such as the name, percentage, duration, number of workers, and total project cost. Detailed information about the construction stages and cost details will appear when you click on the project card.

  • Problem 5

The purpose of this feature is to address communication issues between workers and users. On the chat page, it functions like a typical chat app, but the names will also include their professions to make it easier for users to identify. There is also a “Project Community” page containing groups for each project.

  • Additional Solution

On the calendar page, it contains notes on important days during the user’s home construction.

Prototyping

Link Prototyping Figma

Link Resource Figma Community

5. Test

Metode & Tools

The tool I utilized for conducting usability testing was Maze. I conducted usability testing with five users, and the overall score obtained was 84.

  • Task 1 | Log In & Sign In | Score : 100
  • Task 2 | Beginning the Construction of a House | Score : 87
  • Task 3 | Monitoring the Construction Progress | Score : 78

Score : 78

Kesimpulan Usability Testing

Kriteria Skor SUS

Overall, the results of the usability testing conducted with four users yielded a score of 84, placing it in the acceptable category or considered satisfactory. Breaking down the scores for tasks 1 and 2, they also received acceptable ratings, with scores of 100 and 83, respectively. However, for task 3, a score of 78 was obtained, which is approaching the marginal category.

In my opinion, task 3 still requires some improvement to achieve a better rating, ensuring that users can navigate the application more easily.

--

--