UX & UI Design
2020
Tempo
Tempo is a temporary housing initiative that connects homeowners with the newly immigrated with the intent to ease the uncertainty that immigrants experience when searching for a new home in an unfamiliar city. It allows immigrants to explore their new home city and discover homes in neighborhoods that suit their lifestyle needs.
Roles
User Research
UX/UI Design
Art Direction
Visual Design
Mockup
Video
Tools
Figma
Adobe Photoshop
Adobe Premiere Pro
Type
Team of 4
Date
December 2020
5 Week duration
​
Contributions
As one of the interface designers, my role was to create wireframes and design the mockup pages of tempo as well as the different features on each page. Additionally, I took lead in researching and user interviewing, therefore looked into the laws and services for new immigrants and developed a survey of few responses while conducting interviews and think out loud user testing of various immigrants to validate the project. During the process, I have revised the visual design of the interface multiple times to create the best final result possible. At the end of the course, I created a video using footage from the mockups and prototypes to better present the concept.
01
01
Problem Statement
The domain that we chose to focus on was immigration and specifically the struggles that immigrants face when settling down in a new country. Through our research, we discovered three common reasons for immigration, which include work, school, and improvement of overall living conditions. After interviewing a few immigrants, we encountered that participants who immigrated for school and work had great difficulty with housing. Particularly, unfamiliarity with cities and neighborhoods made it hard for them to settle down in a new country and find a suitable house for their family.
01
01
Problem Statement
The domain that we chose to focus on was immigration and specifically the struggles that immigrants face when settling down in a new country. Through our research, we discovered three common reasons for immigration, which include work, school, and improvement of overall living conditions. After interviewing a few immigrants, we encountered that participants who immigrated for school and work had great difficulty with housing. Particularly, unfamiliarity with cities and neighborhoods made it hard for them to settle down in a new country and find a suitable house for their family.
I was looking for houses for sale in the Chinese newspaper that would fit all 7 of us. I didn’t know how to get there, so I got on a bus and was always getting lost until I found the place I was looking for.
"
02
02
Persona
The information we gathered lead us to create our persona, Tom. Tom is a single parent immigrating with his two children. They are currently living at a family friend’s house that isn’t in the ideal area they’d want to be in, and are looking to find temporary housing in their ideal area that will support their family needs and lifestyle but he is unfamiliar with neighbourhoods in a new city
03
03
User Journey
Creating a user experience journey to highlight various touch-points of the persona through their workflow was a crucial factor in finding opportunities.
04
04
Opportunity
The information above helped us to create Tempo. A temporary housing initiative that connects homeowners with the newly immigrated to help create a more streamlined experience when settling down in a new country. Tempô helps newcomers gain a better understanding of Metro Vancouver neighbourhoods, allowing them to efficiently find temporary housing so they can focus on re-stabilizing their lives, ultimately becoming independent faster.
Process
01
01
Wireframing
Going forward, by analyzing the user experience map and persona, we were aware that it was important to create a design that pursued an interaction flow. Moreover, we had assigned multiple goals to our persona based on the interviews and used that to indicate how the user will achieve these goals within our system via a combination of grey-box wire-flows that helps to understand and evaluate our planned functionality.
02
02
High Fidelity Mockups
Then we moved on to creating a high-fidelity interactive prototype of the entire interactive system using ProtoPie. The prototype shows every step and interaction that is part of the core path and core idea of the application at a minimum.
Onboarding
Onboarding
After launching the app for the first time, Tempô tries to get a better idea of what the user is looking for through a short questionnaire.
Based on the questionnaire, Tempô then recommends neighborhoods in Vancouver for the user to start exploring to help them know the unfamiliar place better.
Exploring
Exploring Neighbourhoods
Through our listings search map, users can see all house listings as well as key interest points in the area. This includes, but is not limited to nearby schools, grocery stores, and transit options.
Clicking into any point of interest will give more details about the place and show all house listings that are nearby.
Filtering
Filtering Your Search
Relevant filter options with universal icons help bring listings that best match the user faster.
Compare
Comparing Listings
Users can save listings they like and compare them later with other listings to find the one that best suits their needs.
Contact
Contacting the Homeowner
After deciding on their favorite listing, the user can contact the host via email for further information.
Takeaway
Through this project, I learn how to learn the context and main users of an existing user interface application and help to make it better and improve it. The user testing conducted hep to understand how people will interact with an application and which helped me to come up with improvement ideas to increase the quality of an existing interface.