CoStar/Propex:

UX and UI

The Challenge

How I used Design Thinking to create a portal for the biggest tech firm you’ve never heard of – CoStar.

CoStar’s online products help users stay informed, find commercial space to let or for sale, analyse properties & market performance as well as connecting with their peers. 

My first project was to redesign the website for the Propex Portal. Used by the UK’s leading funds, property companies and agents, Propex is the industry standard for receiving, logging, and storing introductions.

The Solution

Why Design Thinking?

Creating the re-design was my first project as part of the B2B (Business to Business) Web team. This meant that I had to learn a lot more about the buying and letting commercial property, our partners and their customers. Design Thinking was the best choice for this, it is a solution-based approach to solving problems in 5 stages (Empathise, Define, Ideate, Prototype and Test). It allows us to tackle complex problems by understanding the human needs, framing the problems, coming up with ideas during brainstorming sessions, then prototyping them and testing them out in the field. And then jumping around, iterating between each of the stages.

I decided to follow IDEO’s Human-Centered Design and Lean UX Design Thinking process to make sure that my design decisions were supported by user research and feedback.

Stage 1 — Empathise

To create a website that customers wanted to use, we needed to set aside our assumptions about how things work and how people think. This was the time to learn about the market and especially about the customers that would be using our product.

Through user interviews and testing

We went out to user test the old website that the company was using. It helped us identify the main issues and pain points. But the testing also gave us the possibility to get closer to potential customers and have one on one discussions about their habits. We learned the reasons why people would consider Propex as an introduction to customers and to investors, and what are the most important things they look out for when exploring for a potential deal.

Here we learned that people highly value the look of the website, they want to feel confident that by using our website, they will receive introductions of good quality. The website has to look trustworthy!

Stage 2 — Define

At this stage, we were able to analyze our observations, gather all the information and define the core problems. That helped us to create a problem statement which would guide us through the rest of the Design Thinking process. Even though this process is very user-centred, we still had to keep in mind the business needs. And juggle requirements set forward by other stakeholders within the company.

It is one of the many different challenges while working in a company that provides different products and services for their clients. For example, a big priority for the company is to move people to use the whole suite of products that CoStar has and not just one or two. So it was very important for us to show ‘what you are missing’ links to CoStar data in Propex -and to show an up-sell messages if you are not a full member.

Stage 3 — Ideate

One of the main reasons why the redesign was started for the website, was to allow for the development of a completely new back-end system to enable it to be released world wide and not just in the UK. The project was put on a strict time constraint. So we took the problem and ideated for short term and long term goals. Lots of Sprints!

Short term ideas

In the short term, we were thinking of ways to improve the introduction speed, look and feel of the product to make the website more trustworthy. And of course to meet our KR­`s (Key Results) for the project — increase the conversion of first-time visitors to the opt-in for new users of CoStar suite.

Long term ideas

We still tried to “think outside the box” and look for alternative ways to help potential customers to improve the introduction experience.

Store your ideas in a Trello boards and Slack for constant communication

We stored short and long term ideas in our Trello boards, devoting a list for each part of the website. This has been very helpful ever since, to always come back and check on the ideas we have had in the past, that would be very beneficial for our product in its current state or to satisfy some of the business needs.

Stage 4 — Prototype

After identifying the ideas we wanted to implement, it was time to create prototypes, a scaled-down version of the end product.

Forming a question

When it comes to prototyping, I like to use the mock-ups to form a question I want answers to. This way I can get insights on user behaviour, thinking and also start a conversation with potential customers. These conversations gave us a better understanding of how the customers would behave, think and feel when interacting with our product.

Stage 5 — Test

During the soft release of the product and after full release, the testing process began.

In house testing

Because the majority of people working in the company already knew how the ordering system works, we couldn’t test the ordering flow, as they might be biased in their opinion, thinking that the flow is understandable… Of course you will understand the flow if you worked in the company and for the product for more than a couple of months. That’s why we tested small UI details in-house, gathered opinions on the looks of the design and overall feedback from their experience.

Out in the field

Real testing came out in the field. We looked at our client base and invited a good mix of investors and agents. When we created something that looks trustworthy, modern and easy to use, the outlook on the website changed and people started to pose different questions and concerns. Like how to add funds to portfolios. How to add new tenants to a property that is under offer.

The result and conclusion

After the official release of the new website platform, we successfully increased introductions/conversions by 40% and also increased the number of people that look at the rest of the CoStar suite. Applying the Design Thinking process really allowed us to learn more about the market, company, customers and partners. As it is definitely not a linear process, until the official release, we were jumping around, in-between each stage.

We did a good job with testing the old website and talking to customers, that helped us to really empathise with them. But when we were testing the prototypes and end product, the stage was different, they looked at a more polished product so their expectations and behaviour towards it changed, so again we learned new insights and had to move on to define and ideate based on the newly acquired knowledge.

Key takeaways

Design Thinking is a process that’s focused on collaboration between designers and customers. You empathise with potential customers and develop a product based on how real customers think, behave and feel.

Jumping between different stages made us see things in different perspectives, and dial our attention right down to the problem in hand.

&

UX

UI Design

Web Development

Team Management

 

Case Studies

Sector: Commercial Property UX / UI

Sector: Banking

Sector: Real Estate

Sector: Architecture

Sector: Fashion E-Commerce

Sector: Personal

Sector: Education

Let's Start Something new
Say Hello!

Fill in the form below, or try info@dan-simmons.co.uk or on 07971242054.

PS Do you know what an Easter Egg is  ?     !