How we made it easier to search by emphasizing location
Nooklyn is New York real estate marketplace based in New York. Our iOS app primarily helps users find apartments to rent.
In 2019, I accidentally discovered the app's most important feature, Search, was awkward to use.
While working on a separate feature, I handed my phone to Nooklyn's most valuable tester, my wife, then asked her to perform a simple search like "find apartments in Bushwick” so I could show her the thing I was actually working on.
She couldn't immediately do it. Her eyes and thumb scanned the entire screen looking for the button that would let her narrow her search before, heartbreakingly, she cycled through the other tabs looking for it.
Because I'm super fun at parties (and because I wanted to see if my wife's struggle was a fluke), I asked a couple of friends to do a similar search. Some needed help and all didn't know what to do immediately.
After I showed my wife the Filters button which presents the Filters view, she also struggled to find the Neighborhoods section. She quickly scrolled up and down a few times but didn't see it. It wasn't until she slowly and meticulous scrolled that she was able to find it.
This was particularly unfortunate because our metrics showed that the Neighborhoods filter was, by far, the most used. In fact, the majority of searches started with only neighborhoods selected. The Neighborhoods filter should have been emphasized rather than appearing below the fold.
Over 25% of time in app was spent in the main search view.
For the most part, I believe our app's core value proposition should be obvious, automatic, even brainless.
My primary goals were to:
Make starting a search obvious
First, I experimented with many iterations of the Filters button, trying to create a style that was more attention-grabbing.
At some point, I started wondering if the filters needed to be hidden in a menu at all. If our goal is to make it easier to find the filters, then maybe the best solution is to remove the obstacle altogether. This led to a design that solved the discoverability problem—a toolbar under the navigation bar that contains a horizontally-scrolling collection of Filters.
I improved it further given a few insights:
I moved the Neighborhood picker's search bar to the Search view's navigation bar.
With the Neighborhoods filter in the navigation bar and the other filters immediately visible and ordered by usage frequency, the new search view finally reflected our users' behavior—it felt obvious.
The Neighborhood Picker suffered two problems:
Unorganized - It was a long list of every neighborhood in New York without any indicator of the corresponding borough. Not everyone knows which neighborhood belongs to which borough, especially people moving to New York for the first time.
I improved organization and made it easier to view selections by creating 3 sections:
Here's how a search for "apartments in Bushwick, Williamsburg, or Greenpoint" would start:
Now that the filters had been divided, each one needed to be presented in their own modal. I took the opportunity to create a new design for each filter/data type:
Sadly, I don't have access to all of the quantitative data anymore to back me up, but I recall that
How many more searches did users make with the new design compared to old?
I watched firsthand how much of a different the new design made. With the new design, users reflexively tapped the search bar and immediately knew how to filter a search.