top of page
colin dizengoff
                                 
04/
 07
tracre main_v3.png
client:
Tracre 
service:
UX and UI 
industry:
Real estate

The Ask

Design an app that bridges the gap in the commercial real estate market between tenant reps and landlords that helps to expedite the process, saving both sides time and money.

POSITIONING:

"THE NEXT GENERATION COMMERCIAL REAL ESTATE COMMUNICATION AND MANAGEMENT PLATFORM."

My Role

UX and UI designer. I designed the entire user experience and the visual styling for the app. 

Tools

Sketch, Adobe Photoshop, and Invision were the principal tools that I used on this project. 

Design Process

After understanding the needs and objectives of Tracre, for this project, we followed the Design Thinking process. We started collecting data by observing users in their daily tasks and then proceeding with contextual interviews. Once we identified the problem we wanted to solve, we moved on to figuring out solutions. We then created prototypes to test. Once tested, we implemented, and so on.

Tracre replaces the traditional process of searching and browsing through dozens of fake and stale listings with an “inquiry first model."

 

With a single click, tenant representatives can send their requirements to all landlords of buildings of interest and receive offers customized to their client’s requirements and attributes.

 

All inquiries and offers between landlords and tenant representatives are private and confidential, meaning at no point does the landlord every need to disclose commercially sensitive information like their vacancy rates or market asking rates.

1_building info.png

The Work

app pages_v2A.png
app pages_v2B.png
app pages_v2C.png
app pages_v2D.png
tracre_affinity_v3B.jpg

Research

To begin our research, we looked at what a few of the other CRE businesses were doing with their apps and websites, analyzing UI, UX, User flow, IA, and key features.

And because we wanted to capture an entire range of user behaviors regarding this product, It was critical that we identified an appropriately diverse sample of users and user types when planning the interviews. 

Pain Points

During the research we have developed the following consideration:


Users do not want to waste time going around to see properties that do not suit the needs of their clients, which has the potential to be financially very costly. 

User Persona

Pain points: 

  • A Slow process, constantly looking for locations on several different sites

  • Wastes time making calls to learn that the listing has expired

From research and interview, we have concluded that most users complain about the same pain points. We represented them using personas.

Allen is a recent hire at a Shanghai commercial real estate firm. He has 8 years of experience in the field and is building his client base rapidly. 

Although new to Shanghai, he has been visiting regularly, so he knows the landscape and market pretty well already, and has some strong connections already in place.

Motivations: 

  • Wants to build clientele

  • Make sure his reputation is that of an industry leader, who's effective for his clients  

Goals: 

  • Be effective with his time and close deals quickly

  • Make money

persona_imaage.png

Name: Agent Allen

Age: 31 yrs 

Occupation: CMR Broker

Location: Shanghai, PRC

Archetype: "Go-Getter"

Solutions

Starting from the pain point, we came up with solutions and what needed to be built into the functionality of the app to satisfy the needs of our users.

1- An easy and fast way for tenant reps and landlords to connect.

2- One-stop shopping to minimize wasted efforts and time.

3- Keep information organized and easy to access.

4- Flexibility. Be able to update client needs on the fly for better and faster results.

Tracre_user flow.jpg

Designs

With the research phase of the project completed, we shifted the design phase. 

I began with user journeys and wireframes.

Then I put together a comprehensive design system that would allow flexibility and scalability within the design. 

👉🏻 Set Colors and Fonts Here!.jpg
Style Guide - 07 - Buttons.jpg
Style Guide - 08 - Notifications.jpg
👉🏻 Adjust Other Stuff Here!.jpg

Work Flow

63520663300757.5aabe42a33182.jpg
48f67263300757.5aabe42a2b1e1.jpg
524bca63300757.5aabe42a302e3.jpg

Prototype

– prototype
prototype cover.png

Branding

Before we kicked off the app, I created the brand identity. Below is the selected mark along with some other finalists. The mark is representational of the shape of a building and unifying the two parties the app helps to connect.

tracre_logo selection-01.png
– footer
bottom of page