Introduction
At Apartment List we set out to redesign our search page. It was outdated both technically and in terms of the design. We wanted it to be responsive, friendly, and engaging while effectively supporting SEO.
Business & design goals
The new design must effectively support ads, SEO, and maintain or improve site-wide conversion. Our goals for the design were to unify the mobile and desktop experience, connect the map and list view experience, and differentiate ourselves from the competition.
Mobile design
Starting with the mobile design, I identified the key components of the search results page. After many iterations with our web team and working with the product manager, we came up with this solution.
Next was the design of the filters. They needed to be easy to identify, while keeping a large minimum tappable area for each element. A large portion of our traffic was on mobile devices, so getting the details just right were very important.
Desktop design
The main difference between the mobile and desktop design was the addition of the map on desktop.
The interactions of the map proved to be the most difficult problem to solve.
I learned in user testing that while users do interact with the map, they don't always do it the way we thought they would. The users we tested tended to hover their mouse over the listings on the left side to discover where the listing was located on the map. The map was more for context than discovery.
Conclusion
The redesign of the search results page was a total success. Not only did it meet the requirements set out at the beginning of the project, it improved our conversion rate across the site and provided a superior experience for our users.