top of page

ROOTS  App
UX/UI Design Development

KEY COMPONENTS
iPhone 15 Pro Black Titanium Mockup Portrait (2).jpg
4.jpg
9.jpg

COMPONENTS

123-01.png

Connection

123-03.png

Transparency

123-02.png

Usability

OVERVIEW

Introducing ROOT, the website designed to help people find their next rental or sublet, while building connections.

Role: Research UX/UI Timeline: July-Sept 2023

The Problem

People need a safe, reliable, and easy way to find rentals and sublets. Currently people face issues with scammers, websites not being up to date and not being able to build community when moving somewhere new. 

DESIGN PROCESS

Discovery 

Research

Debrief

Design

User Testing

Present

PROPOSAL

Design an app built to help people of any age find the most suitable rental or sublet. The app should serve as a way to find a place without having to vet out scammers while connecting to real people in a user friendly way.

GOAL

LEARN MORE

I’m a paragraph. Double click here or click Edit Text to add some text of your own or to change the font. Tell your visitors a bit about your services.

  • Vet the user: People spend too much time on some sites dodging scammers, we want to ensure quality users so people aren't wasting time

  • Connect the User: A common pain point amongst people in  interviews was the lack of meeting new people in the are

  • Create a user friendly experience: When an app has too many things on it it can get overwhelming, this app is pretty straight forward and designed in a way that's visually pleasing and easy to navigate.

MARKET RESEARCH

After looking at other related apps (our potential competitors), the current market seems to lack having having all qualities in just one app: affordability, flexibility, transparency and connection.  

Affinity mapping

After interviewing four people with different backgrounds, I made an affinity map. I asked these people similar questions about their experience with moving to a new place and this was the data I came up with and organized:

Screen Shot 2023-10-11 at 2.19_edited.jpg

User Persona

I came up with two User Personas, but I am showing one (to the right). We are only looking at this app from the point of view of a renter not a tenant.

user-personas-by-erin-caceres.jpg

Journey map

STAGE 1

STAGE 2

STAGE 3

STAGE 4

STAGE 4

Lisa needs to sublet a spot in Colorado for 4 months w/ her bf. 

She went on a Facebook market place page to find a spot, but wasted too much time on scammers.

Lisa then went on Roots where she verified her account and saw most people on it were verified.

After that, she added some friends, saw two sublets open and decided to FaceTime both people.

Lisa  found a perfect sublet in her budget & made a new friend in that area.

Storyboard

1.

"can't wait to move to Texas for 2 months!"

2.

3.

4.

5.

6.

Tony is subletting his place for two months while he travels.

He's scared to let a stranger live in his place with his nice things.

Tony loved setting up his app and is impressed by how easy it is to use

He then FaceTimed a dozen people and found a perfect fit to sublet his place. He also made some new friends!

After using the app, Tony made new friends and trusts who he's renting to.

"wow so easy to use"

1 yes.png
2 yes.png
yes 3.png
yes 4.png
3 yes.png

his friend Alex suggests an App he used called Roots because it allows you to get to know people before subletting

SITEMAP

This shows the layout for any pages, videos, and other files on my app, and the relationships between them.

Screen Shot 2023-10-13 at 3.01.23 PM.png
User Flow erin-2.png

USERFLOW

BRANDING

Frame 1.png
Layer_1.png
ROOTS.png

Primary 

Secondary

Rectangle 1.png
Rectangle 2.png
Rectangle 3.png
Rectangle 7.png
Rectangle 10.png
Rectangle 13.png
Frame 3.png
Frame 2.png

LOW-FI wireframes

Untitled_Artwork 2.jpeg
Untitled_Artwork.jpeg
Untitled_Artwork 4.jpeg
Untitled_Artwork 3.jpeg

Sign Up Page

Home Page 

Property Page

Sign In or Sign Up

Untitled_Artwork.jpeg

Profile Page 

This part took me a long time, it's where I really started to flesh out my ideas and how it could all come together cohesively. Once I got all thes sketches down, it was a lot easier to do the next steps. The wire frames did evolve in every step, but I think this was the most important step because it helped me actually begin the process.

MID-FI WIREFRAMES

Mid-Fi Wireframes were the bare bones of the project, this part was quick and made it easier to flesh out the actual usability part before getting more into the details of design in Hi-Fi.

Screen Shot 2023-10-17 at 9.54.16 AM.png

Opening Page

Screen Shot 2023-10-17 at 10.37.18 AM.png

Home

Screen Shot 2023-10-17 at 10.00.33 AM.png

Property Page

Screen Shot 2023-10-17 at 9.56.03 AM.png

Sign Up Page

login.png

Log In Page

Hi-FI wireframes

After a few basic tests, I moved into Hi-Fi Wireframes.  This part was tedious but easy, I wanted all designs to be consistent throughout my app. That includes, colors spacing and more, it took me rechecking my work several times to make sure no small mistakes were made. The hardest part about this section was making sure all wireframes were connected correctly in a way that was very user friendly. 

Screen Shot 2023-10-18 at 11.50.45 AM.png

click above photo to see wireframes

4.jpg
6.jpg

User testing

I tested my high fidelity Design on 10 people, age 24-64. I sat down with them and asked them all similar questions, then asked them to complete the same tasks. Everyone found it easy to do, user-friendly and well designed. That being said, almost all participants gave me helpful feedback on parts that could be improved or made more clear. I took those into consideration and made a few edits to my final Prototype which I can show below.

User testing

After user testing :

​

Change 1:

I changed the Home Screen so the user can immediately browse, instead of choosing if they want to login or sign up. I did this because people said they were more likely to continue using the app if they could actually look at properties and be drawn in.

10.jpg
4.jpg

Change 2:

Users think they're more likely to sign up if they get the option to sign up through other platforms because it's more convenient

20.jpg
69.jpg

Final prototype

After this entire process, you can click on the blue button to view my prototype                                      :  )

TakeAWAYS

This project was eye opening. My biggest takeaway is that it takes the right process to get to the right solution. You really can't skip all the steps and dive into the solution because more than likely you will end up solving the wrong problem. My research made it easy to verify I was moving in the right direction throughout the process and connecting with others gave me new perspectives and ideas and that were essential to my solution. No matter how much we think we know, we can always learn more from people around us. 

bottom of page