COMMERCIAL REAL-
ESTATE CRM

Client: Eastdil Secured

Role: Lead product designer

Responsibilities: UX design, product design, systems design,
interaction design, service design, information architecture,
enterprise software

Overview

Manhattan-based commercial real estate brokerage Eastdil Secured hired Lighthouse Software to replatform and redesign their internal CRM system. Their old platform (below) was at least 15 years out-of-date at the time we were brought on, and we quickly realized the complexity of the project. We needed to rebuild their entire database and design and develop everything from scratch.

A complex and unorganized interface for a computer system

This new responsive platform would track employees, external partners, properties, property owners, deals, and loan details, allowing team members at any level to interact with any data point during the brokerage process.

Discovery

The discovery phase was an intensive crash course in commercial real estate. The Business Analyst and I interviewed employees at different levels and on different teams to understand their workflows and pain points. This helped us to not only gather requirements and write user stories, but also to understand the existing data structure. This was crucial because designing the right components required a comprehensive understanding of how these data layers interacted. We collaborated on a map illustrating these data interactions, which became a vital reference.

With a basic sitemap established, I partnered with our Business Analyst to create personas representing the three main user types. These personas were essential for guiding our design decisions and were prominently displayed in our office as constant reminders of our target users.

To keep the client informed, I designed a progress tracker resembling a New York subway map. Each information category was color-coded to assist users in quick recognition, which was reflected in every step of the progress bar.

Design

I began with low-fidelity wireframing using sketches, leading with mobile concepts. Utilizing a post-it sticky pad from UIStencils.com, we could easily adjust the user flow by rearranging the post-its. This iterative process continued until we expanded to tablet and desktop sketches.

The primary goal was to ensure users could start with a dashboard view and drill down into details. I compiled the lo-fi wireframes into a sketchbook and presented them to stakeholders for feedback.

For each of the different business sections I put the lo-fi wireframes into a sketchbook and presented these to the stakeholders.

Here’s a condensed version of the concept sketchbook.

Simultaneously, I explored design systems. As the sole designer at Lighthouse, I decided to use Google Material Design due to its compatibility with Angular, which our developers were familiar with.

Wireframes were created in Mockflow and served as reference material for both clients and the development team. The transition from sketches to wireframes was smooth, with minimal changes in component layout.

For mockups, I used Photoshop, although in hindsight, Figma would have been more efficient. Frequent client changes required us to adapt the existing layout and design rather than starting over each time. I advocated for simplicity to avoid overwhelming users and encouraged the team to focus on core functionalities. However, the complexity grew as each stakeholder added unique requirements that sometimes conflicted with the requirements of other business units. This sometimes frustrated individual stakeholders, but I continued to push for us to absorb the complexity on our end, citing UX best-practices in the best interests of the project and maintaining our scope of work. I also worked to unify the efforts of the three main business units, fostering collaboration and ensuring that all parties worked together rather than in conflict with each other.

A computer screen showing a user dashboard
A web-based dashboard showing company information
A web-based dashboard showing company information
A web-based dashboard showing company information
A web-based dashboard showing company information

Additionally, I created a style guide for our development team and a daily digest email template for client updates. I continued to collaborate closely with our development team as they built out each section of the system, advising on matters of accessibility, overall user experience and usability, and finding suitable compromises in situations where technical limitations presented themselves.

An email design showing users what updates have been made
A style guide to help developers build accurate pages

Outcome and Learnings

By the project's end, we developed a comprehensive CRM system that tracked clients, contacts, properties, deals, and included a business tracker for managers and analysts. The robust database ensured information was organized, accessible, and adaptable.

Within the first year of its release, the client saw their sales increase by 13%. This was attributed, in part, to the massive increase in the speed with which their brokerage teams were able to process the many steps and phases of sales. This boost was made possible by the new system and the business intelligence they were able to gather with it.

However, we faced several challenges and learned valuable lessons:

  1. Wireframe Process: We rushed the wireframe stage, missing a crucial opportunity to establish a solid solution. This oversight led to frequent client changes and scope adjustments due to a lack of agreed-upon wireframes.

  2. Scope Management: We strayed from the original Scope of Work, accommodating too many client requests. This compromised our advocacy for the user and led to conflicting requirements from different stakeholders.

  3. Tool Selection: Using Photoshop for such a complex project was inefficient. The lack of a responsive design tool and an Atomic Design-based system hindered our accuracy and consistency. Switching to Figma mid-project would have been disruptive despite its potential benefits.

Overall, the project was a success, but it was also a learning experience. These challenges highlighted the importance of a thorough wireframe process, strict scope management, and the right design tools for complex projects.