AgentTools_Banner

Problem

The old tech stack of the back-end system where Hamptons real estate professionals managed their listings was no longer reliable.  From a design perspective, the B2B tool needed to be simplified and organized while maintaining core functionality its users relied on.

Audit of Existing Platform (RealNet)

Realnet_HP

RealNet - Home Page

CLUNKY BUT POWERFUL

Over the years, the existing tool had become unwieldy. Different fields and features were shoehorned in for some brokerages but not others. There were lots of ways to perform the same actions and actions that no one would ever use. A lack of information architechture and hierarchy made it difficult to use efficiently. Still, the tool had features used heavily by its users who had become accustomed and needed to use them every day to conduct business.

Realnet_Entry

RealNet - Listing Entry Form

Realnet_Search

RealNet - Listings Search (In Brokerage)

Realnet_OREX

RealNet - Listings Search (Out of Brokerage)

Realnet_SRP

RealNet - Search Results

Product Vision

Create a suite of professional tools that allow agents to seamlessly post, manage, and share their listings. Empower real estate professionals in the Hamptons with data and workflows that make every aspect of their job easier.

Defining User Types and Wireframe Samples

OE Agent Tools User Permissions@2x
PERMISSIONING TREE (EDIT PERMISSIONS)

One of the challenges of cleaning up the architecture was defining user roles and permissioning. I worked closely with the PM, Tech Lead, and our industry partners to establish which users should be able to view, edit, and approve information at the brokerage, office, and agent level.

CREATING A SCALABLE MENU

The features available at launch would not be all the tools the users would need. We needed to create a tool that could scale and accommodate a variety of user types.

Menu_Wire_1a

Agent tools menu replaces site nav
✅ Menu items always accessible
❌ Doesn't scale to account for future menu items

Menu_Wire_2

Horizontal menu below site nav with persistent photo
✅ Helps distinguish Agent Tools from consumer experience
❌ Doesn't scale to account for future menu items

Menu_Wire_3

Fixed left side menu
✅ Menu items always accessible
✅ Scales for future menu items

MenuSketches

Solution

Out East Agent Tools streamlines workflows for all user types, including a fully responsive design which agents can access from their phone. Key actions are easy to take, and unnecessarily complex flows are simplified. A visual overhaul gives the B2B tool clear hierarchy and organizes information in a way that makes sense.

My Listings

MyListings
MY LISTINGS CARDS

Direct feedback from agents combined with analytics showed us the most important information they needed to see and actions they would take on their own listings. Hovering on the cards reveals action icons such as "edit" and "add to folder". The cards are designed to scale when more or different actions were needed based on user type. We also added a way to quickly change the status of a listing without leaving the My Listings page.

Static

ListingCards_1

Draft Listing - Actions on Card Hover

ListingCards_2

Action Hover State

ListingCards_3

Active Listing - Actions on Card Hover

ListingCards_5

Status Change Dropdown

ListingCards_6
AgentTools_MyListings_Agent
FILTERING UPDATES

As agents began to use the tool, they noticed that certain user types need further filtering tools. For example, Office Admins, who often have other agents listings on their "Our Listings" page wanted to be able to filter by agent. The component we built bubbles the current user to the top, as they most frequently need to see their own listings. The other agents are listed alphabetically, or the user can simply type a name to search.

Listing Entry & Editing

Create New Listing

AgentTools_ListingEntry_1

Create New Listing - Autocomplete Address

AgentTools_ListingEntry_2

Listing Entry

AgentTools_ListingEntry_3

Listing Entry - Organize Photos

AgentTools_ListingEntry_4

Draft Listing

NavBar_1

Active Listing

NavBar_2

Status Change Dropdown

NavBar_3

Listing Pending Approval - Admin View

NavBar_4

Draft Listing - Active Exclusive Exists

NavBar_5
LISTING ENTRY/EDIT STATUS BAR

A status bar is always at the top of the user's screen while entering or editing listings. This is where the main actions and information about the listing live. The bar is designed to accommodate a variety of states and user types, including listings which need approval and listings which cannot be published but still need to be edited in the draft state,

Miscellaneous Screens

Folders Page

Extras_Folders

View Listings on Map

Extras_Map

Agent Info Tooltip

Extras_Tooltip

Search Results Page

Extras_SRP

Print Listings

Extras_Print

Edit Agent Profile

Extras_Profile