StreetEasy — Helping Users Navigate the Real Estate Market in The Big Apple
Exploring flows and design patterns that play a role in StreetEasy’s success
The New York City real estate market is incredibly daunting. With literally millions of residential units across NYC’s five boroughs, it is really easy to get overwhelmed… especially when 90% of the residences in your price point are smaller than a shoebox.
Enter StreetEasy. A subsidiary of real estate marketplace giant Zillow, StreetEast allows users to browse, buy, rent, and sell real estate, “from studios to high-rises, Brooklyn Heights to Harlem.” And while many real estate agencies hate working with StreetEasy due to the outrageous fees, as a renter, the process does feel significantly more manageable.
Task Flow (Rental)
This is the typical task flow taken by a user looking at rental units on Streeteasy.com.
- Arrive at the site by entering www.streeteasy.com
- Select Rental Listings
- Input my search criteria
- View page containing results matching my criteria
- View selected listing page
- Click “Request Tour”
- Input Contact information
- Wait for the Realtor overseeing the property to reach out via phone or email to schedule next steps.
StreetEasy’s task flow is self-explanatory & easy to identify. This funneled flow lets the user pinpoint exactly what they need.
Design Patterns
Filters:
One of StreetEasy’s greatest strengths is its sheer number of filters. Of course, you could go through each of the available 34,494 apartments for rent one by one, but by the time you got to the end, most of those would already be off the market.
When searching StreetEasy, users can filter by nearly every logical criteria, including neighborhood, price point, number of bedrooms, square footage, availability, school zone, amenities (including the ultimate NYC luxury: in-unit washer/dryer), pet-friendly, and my favorite: nearby transit.
Sticky Double Nav Bar (Desktop)
The StreetEasy desktop page features a double navigation bar as a header. The top bar contains secondary calls to action: Advertise, Recent Searches, & Sign In, while the bottom bar contains the links to pages directly related to the primary call to action: find your next home. These headers are sticky, meaning that even when scrolling, they remain right at the top of the page. This allows users to quickly and easily run a new search or access new information, without leaving the site or returning to the landing page.
Card Components
StreetEasy’s desktop and mobile app rely heavily on the use of cards, particularly in displaying the listings found via a search. Each card contains an edge-to-edge image of the unit, the address, the listing price, the bed/bath count, the square footage, the neighborhood, and the leasing agency as well as a “Save” button.
The use of cards allows users to view each listing as an individual entity and interact with it on its own. Cards are frequently used on real estate websites and apps for this reason. By placing the Save button within the card, the user can run preliminary searches, save interesting listings, and then go back and dig further into each, rather than clicking through each one initially. Saves the user time, energy, and clicks!
I don’t think any website or digital product will ever be able to entirely take the frustration out of the process of trying to rent or buy in the Big Apple. However, straightforward flows and clear design patterns like those on StreetEasy allow users to feel as though they have a bit of control in the wild west that is NYC real estate.