CRE BROKER INVENTORY TRACKING

REALSTAX

2017

3 Engineers, 1 Designer

I led the redesign of our mobile and web products, led UX research, organized product meetings, and drove the project forward with our engineering lead.

Project management, UX/UI design, UX research, prototyping

CONTEXT

Realstax is a B2B enterprise tool for commercial real estate. Commercial brokers face challenges in efficiently finding, tracking, and managing office spaces for their clients. Traditional methods often lead to time-consuming manual processes, fragmented data, and missed opportunities. Realstax's brokerage tool allowed brokers to find, track, and share inventory with their teams and clients.

Before

After

PROBLEM

The initial product approach for Realstax prioritized the in-field mobile experience without sufficient research, leading to a web product that failed to meet users' desktop needs. This divergence hampered user productivity, led to missed opportunities, and ultimately impacted adoption and engagement.

SOLUTION

We embarked on an extensive redesign journey aimed at harmonizing the user experience across mobile and web platforms. Collaborating closely with brokers, we identified core functionalities and use cases for both environments. Our design strategy involved reimagining the web product's layout, optimizing it for desktop use, and selectively incorporating mobile-friendly elements where applicable.

Test
Test

COACHING ON WAYS TO EARN

We enhanced screen functionality and speed by replacing the long dropdown with visual representations of product types. Improved accuracy was achieved through stepped and variable number inputs for price and size. User feedback confirmed that these changes aided in finding desired product types, exact prices, and sizes. Filters were selectively shown, ensuring uncluttered views. Displaying product types in a grid for swift selection and we introduced map clustering on both mobile and web for precise listing selection.

Test

SIMPLIFYING OPS WORKFLOW

We optimized user experience by placing essential data like address, lease tags, size, price, style, and opex at the top. Grouped sections were styled for clarity, and sticky anchor points kept crucial data and actions easily accessible. A modular approach accommodated diverse product types, maintaining adaptability. Table data was aligned for quick scanning, and CTAs were strategically placed for visibility and usability.

Test

OUTCOME

The implementation of our redesigned app yielded transformative outcomes. Brokers now had a unified experience that seamlessly transitioned between mobile and web, enhancing efficiency and productivity. The redesigned web tool delivered the features missing in the initial version, streamlining brokers' workflows and allowing them to make informed decisions. This resulted in a significant increase in both web and mobile brokerage usage among our pilot firms.

TestTest

CONTEXT

Realstax is a B2B enterprise tool for commercial real estate. Commercial brokers face challenges in efficiently finding, tracking, and managing office spaces for their clients. Traditional methods often lead to time-consuming manual processes, fragmented data, and missed opportunities. Realstax's brokerage tool allowed brokers to find, track, and share inventory with their teams and clients.

Before

After

PROBLEM

The initial product approach for Realstax prioritized the in-field mobile experience without sufficient research, leading to a web product that failed to meet users' desktop needs. This divergence hampered user productivity, led to missed opportunities, and ultimately impacted adoption and engagement.

QUESTION

How can we redesign the platform to work well on both mobile and desktop, helping commercial real estate brokers find, track, and manage inventory effectively? How do we ensure this solution meets brokers' needs, making them more productive and better decision-makers?

SOLUTION

We embarked on an extensive redesign journey aimed at harmonizing the user experience across mobile and web platforms. Collaborating closely with brokers, we identified core functionalities and use cases for both environments. Our design strategy involved reimagining the web product's layout, optimizing it for desktop use, and selectively incorporating mobile-friendly elements where applicable.

OUR GOAL

Test

Our goal was to unify the two products and to focus the redesign on our high-touch functionality: Search & Filter, Listings page, and Listing collections (my Stax). Success looked like we increased our active users across the web and mobile products by 50%.

01 MEASURE

We spent time conducting UX research to understand the broker's pain points with our existing product. Some key takeaways were: that navigation in general was difficult for users, listing information was hard to find, and tables or collections were cumbersome to use.

TestTest
Test

02 TRANSPARENCY & COACHING

Test

We enhanced screen functionality and speed by replacing the long dropdown with visual representations of product types. Improved accuracy was achieved through stepped and variable number inputs for price and size. User feedback confirmed that these changes aided in finding desired product types, exact prices, and sizes. Filters were selectively shown, ensuring uncluttered views. Displaying product types in a grid for swift selection and we introduced map clustering on both mobile and web for precise listing selection.

Test

03 POLICY & PROCESS

We optimized user experience by placing essential data like address, lease tags, size, price, style, and opex at the top. Grouped sections were styled for clarity, and sticky anchor points kept crucial data and actions easily accessible. A modular approach accommodated diverse product types, maintaining adaptability. Table data was aligned for quick scanning, and CTAs were strategically placed for visibility and usability.

TestTest

04 BENEFITS

We revamped "My Stax" into a report gallery for brokers. The new table view prioritizes tourbook reports for rapid listing access. We improved readability by adjusting spacing, text alignment, and shading. Users can now preview, download, share reports, and even edit listing information through a contextual action bar. The listing table concentrates on essential details such as address, size, and price, while less-edited sections are consolidated in the overview.

TestTest

OUTCOME

The implementation of our redesigned app yielded transformative outcomes. Brokers now had a unified experience that seamlessly transitioned between mobile and web, enhancing efficiency and productivity. The redesigned web tool delivered the features missing in the initial version, streamlining brokers' workflows and allowing them to make informed decisions. This resulted in a significant increase in both web and mobile brokerage usage among our pilot firms.

TestTest

CONTEXT

Realstax is a B2B enterprise tool for commercial real estate. Commercial brokers face challenges in efficiently finding, tracking, and managing office spaces for their clients. Traditional methods often lead to time-consuming manual processes, fragmented data, and missed opportunities. Realstax's brokerage tool allowed brokers to find, track, and share inventory with their teams and clients.

Test

PROBLEM

The initial product approach for Realstax prioritized the in-field mobile experience without sufficient research, leading to a web product that failed to meet users' desktop needs. This divergence hampered user productivity, led to missed opportunities, and ultimately impacted adoption and engagement.

Test

QUESTION

How can we redesign the platform to work well on both mobile and desktop, helping commercial real estate brokers find, track, and manage inventory effectively? How do we ensure this solution meets brokers' needs, making them more productive and better decision-makers?

SOLUTION

We embarked on an extensive redesign journey aimed at harmonizing the user experience across mobile and web platforms. Collaborating closely with brokers, we identified core functionalities and use cases for both environments. Our design strategy involved reimagining the web product's layout, optimizing it for desktop use, and selectively incorporating mobile-friendly elements where applicable.

OUR GOAL

Our goal was to unify the two products and to focus the redesign on our high-touch functionality: Search & Filter, Listings page, and Listing collections (my Stax). Success looked like we increased our active users across the web and mobile products by 50%.

Test

IDENTIFYING EXISTING PAIN POINTS

We spent time conducting UX research to understand the broker's pain points with our existing product. Some key takeaways were: that navigation in general was difficult for users, listing information was hard to find, and tables or collections were cumbersome to use.

realstax-ui-oldTestrealstax-search-old
Test
Testrealstax-table-old

SKETCHING AND WIREFRAMES

Modularity was important for us because we wanted the design to be flexible with different asset types and types of workflows. We did some rough sketches and brought the wireframes into a lo-fi prototype to test proof of concepts.

Test

SEARCHING FOR INVENTORY

We enhanced screen functionality and speed by replacing the long dropdown with visual representations of product types. Improved accuracy was achieved through stepped and variable number inputs for price and size. User feedback confirmed that these changes aided in finding desired product types, exact prices, and sizes. Filters were selectively shown, ensuring uncluttered views. Displaying product types in a grid for swift selection and we introduced map clustering on both mobile and web for precise listing selection.

TestTest

INSIGHTS AT A GLANCE

We optimized user experience by placing essential data like address, lease tags, size, price, style, and opex at the top. Grouped sections were styled for clarity, and sticky anchor points kept crucial data and actions easily accessible. A modular approach accommodated diverse product types, maintaining adaptability. Table data was aligned for quick scanning, and CTAs were strategically placed for visibility and usability.

Test

COLLECTION CONTROL AND COLLABORATION

We revamped "My Stax" into a report gallery for brokers. The new table view prioritizes tourbook reports for rapid listing access. We improved readability by adjusting spacing, text alignment, and shading. Users can now preview, download, share reports, and even edit listing information through a contextual action bar. The listing table concentrates on essential details such as address, size, and price, while less-edited sections are consolidated in the overview.

TestTest

OUTCOME

The implementation of our redesigned app yielded transformative outcomes. Brokers now had a unified experience that seamlessly transitioned between mobile and web, enhancing efficiency and productivity. The redesigned web tool delivered the features missing in the initial version, streamlining brokers' workflows and allowing them to make informed decisions. This resulted in a significant increase in both web and mobile brokerage usage among our pilot firms.

Test

CONTEXT

Realstax is a B2B enterprise tool for commercial real estate. Commercial brokers face challenges in efficiently finding, tracking, and managing office spaces for their clients. Traditional methods often lead to time-consuming manual processes, fragmented data, and missed opportunities. Realstax's brokerage tool allowed brokers to find, track, and share inventory with their teams and clients.

Before

After

PROBLEM

The initial product approach for Realstax prioritized the in-field mobile experience without sufficient research, leading to a web product that failed to meet users' desktop needs. This divergence hampered user productivity, led to missed opportunities, and ultimately impacted adoption and engagement.

SOLUTION

We embarked on an extensive redesign journey aimed at harmonizing the user experience across mobile and web platforms. Collaborating closely with brokers, we identified core functionalities and use cases for both environments. Our design strategy involved reimagining the web product's layout, optimizing it for desktop use, and selectively incorporating mobile-friendly elements where applicable.

Test
Test

COACHING ON WAYS TO EARN

We enhanced screen functionality and speed by replacing the long dropdown with visual representations of product types. Improved accuracy was achieved through stepped and variable number inputs for price and size. User feedback confirmed that these changes aided in finding desired product types, exact prices, and sizes. Filters were selectively shown, ensuring uncluttered views. Displaying product types in a grid for swift selection and we introduced map clustering on both mobile and web for precise listing selection.

Test

SIMPLIFYING OPS WORKFLOW

We optimized user experience by placing essential data like address, lease tags, size, price, style, and opex at the top. Grouped sections were styled for clarity, and sticky anchor points kept crucial data and actions easily accessible. A modular approach accommodated diverse product types, maintaining adaptability. Table data was aligned for quick scanning, and CTAs were strategically placed for visibility and usability.

Test

OUTCOME

The implementation of our redesigned app yielded transformative outcomes. Brokers now had a unified experience that seamlessly transitioned between mobile and web, enhancing efficiency and productivity. The redesigned web tool delivered the features missing in the initial version, streamlining brokers' workflows and allowing them to make informed decisions. This resulted in a significant increase in both web and mobile brokerage usage among our pilot firms.

TestTest