Prefabricated Modules to reduce housing costMany people facing rental financial strain are unfamiliar with how the prefabrication industry can reduce housing costs. Pre.Module could assist them in navigating the lesser-known realm of prefab housing.
In a 3-month bootcamp with other design exercies and challenges going on.

Secondary & primary research, interview design & conduct, report & presentation

Usability testing and issues evaluations

Sketches, lo-fi wireframes, high-fidelity prototypes, and marketing website design











In the real estate market, the demand for living space is far larger than the supplies, resulting in higher trading prices than usual. Most people, especially young professionals, are facing relatively high rental financial pressure.
To relieve the tension in the real estate market, several methods have been conducted to provide affordable housings, among which prefabrication has been proved for its ability to reduce construction cost.
of the full-time minimum wage spent on rent
low-income households spend more than half of their income
cheaper than a stick-built home, and possibly even more
However, such type of architecture has not been widely accepted yet. Few people know about the prefab industry and how they can access prefabricated buildings, even with strong interests.
Modular construction only has 2-3% market share even in the well accepted markets.
of young professionals that did the survey have not heard of prefabrication before.
In the real estate market, the demand for living space is far larger than the supplies, resulting in higher trading prices than usual. Most people, especially young professionals, are facing relatively high rental financial pressure.
Two key insights were collected through the interviews with potential users who have relatively hight rental financial pressure, aiming to understand their needs to relieve such pressure with prefab housing.
When facing the new term and technology they are not familiar with, people tend to need some platform where they can learn about this topic and can easily access it when they want to.
Most renters are looking for some methods to reduce their rent and manage their living cost better, considering the long-term financial health.

Based on the research findings, I have the representative users modelled in the format of persona for later alignment and solution design.


Focusing on the primary user, the journey of how Riley looks for the desired bachelor suite is analyzed to identify the frustrations in the process, which are taken as opportunities where possible solutions are developed to relieve the pain.

Based on representative users’ characteristics and their down moments along the journey, some possible features are proposed to help improve the process of finding and renting affordable units.

Info platform where users can get the industry introduction and trending projects information.
Users need to see where the nearby prefab buildings are and where they can access the building.
Community where users can share opinions about prefab with each other and give feedbacks.
Online renting or purchasing service for easier access to prefab buildings.

I want to check if there are some desired prefab buildings nearby to make sure prefab is accessible.
I want to read through the detailed building information to make sure it can actually relieve my rental financial pressure without compromising life quality.
Based on pain points and user stories, the task flow has been created to help me think about how the user would interact with the product and give me a baseline of main screens that need to be designed.
‍
This task flow shows how the user search for prefab buildings nearby and check the detailed information to rent some prefab suites.

Sketches have been employed to initiate the visual planning of the task flow.
With the rough blueprint in mind, I feel like it is necessary to get out of the ivory tower and see what the real-world projects look like.





After revising the ideas by pen, I put them into the grey-scale digital world to see if it’s gonna survive or not.

When the wireframe is qualified to survive, I move onto considering upgrading its life quality. With the help of my peers, I conducted two rounds of user testings and have collected some valuable points to revise my wireframe.



No one would like the plainly black-white world. Color and clear product images are necessary, just working like the flag for our dynasty.


Based on the colors extracted from the moodboard, I rate the color combinations by uniqueness, fitness, and accessibility. Then try to inject the possibly suitable set into the home page and decided on the final color palette, which is the 6th combination in this case.
Starting from sketch, I explored different wordmarks and decide on the one that involves both prefabrication and module construction, and can also represent prefab architecture style a bit.

According to Human Interface Guidelines, icon is designed and developed to make sure it meets all the industry standards.

With the stage set up, now the solution is ready to be put into spotlight and shine.



To let more people like our dynasty, marketing is necessary. The responsive website is designed to advertise Pre.Module:
To make up for mobile app’s constraints, iPad has been chosen for its LiDAR camera and larger workspace, which allows for user scanning the interior of prefab suite and share it, as well as more engaging 3D map view.
To continuously develop this app and launch it with the help of developers and other designers, UI library is created for organized and efficient hand-off.


To figure out how the app would develop in long term, I picked “SUPERFAN” Torot Card as the starting point.



