Our team partnered with engineering to breathe new life into our consumer mobile search experience. At the time over 60% of our traffic was coming via mobile and climbing. Our desktop platform brought in the most conversions but, we knew that would change especially with mobile capturing more market share.
The Plan We started by refining the search experience and optimizing our ad-words flow which included forms, the gallery, search & filtering options. Conversions are the lifeblood of our sites and making sure we made that process as seamless as possible was important. After working through this initial chunk of the site, we’d start to spread the new look and feel into the other pages. This would allow us to ship in smaller increments and learn from our findings.
Data & Research We’ve been running google analytics on all of our products for years. Before we got into laying out pixels or flows the first thing we did was see which options consumers used when creating a search. The MLS data we gather gives consumers a ton of search options, but not all of them are used especially early on in the home buying process. We found that almost all searches had: bedrooms, baths and a type of property selected. The number of searches greatly fell off after these 5 options. We moved everything else into a “power search” option and worked to make all of the touch targets large and easy to browse.
The Design Process
We’re lucky that for our consumer site, we have a large range of people at our fingertips to engage with. We have a company of around 300 people and one of our first clients is only a few miles from our office. We started with a design sprint, similar to how google ventures runs their sprint. But, instead of investing in the problem space and using their methodologies we borrowed the timetable. Every week, we would be getting user feedback. We used Invision and Lookback to test and record. The benefit of Lookback is that the person conducting the interview can do it on the device. That means instead of having someone walk you through what they’re doing you’re literally part of the experience with them. Plus, since these were being recorded we could come back to them later. We worked in this fashion for a total of 4 weeks on the design side. Improving our designs and adding more content week over week.
Once we started attacking the design of a few screens, we started getting into “the how”. Since we’re updating our wordpress sites to React, this allowed us to use Storybook. We had used this internally on some smaller projects but, this was a bigger beast. The benefit of React Storybook is that you can see, feel and interact with components of the project without having to hit up someones IP or browse on their machine. This allowed us to get to talking nuance about the project a lot faster than typical development.
The Roll Out
We had a new roll-out strategy that in hindsight, worked pretty damn well. Earlier in the year, we were able to setup several sites that we dubbed Conversion Rate Optimization sites. (CRO for short) For about 10 clients, we gave them a second site that we constantly run tests and improvements on. A fine line we’ve had to walk in the past is how do we test and learn on our clients businesses? This allows us to test and learn in a sandbox without hurting our clients businesses. We incrementally tested each piece of the site with the current underpinnings and design. This gave us a sneak peek of the full experience before we put the whole thing together and released it into the wild. By the time the full experience got into production, we felt really good and were proud of our work.
Outcome 8.2% Global Conversion Increase 45% Time on Site Increase 28% Search Volume Increase
Chad Engle - Design Director
Josh Campbell - Lead Product Designer
Will Munce - Product Designer
Chris Cousins - Product Owner
It takes a village to bring together a smooth experience like we did. A big applause to the engineering team, QA, client services and our beta testers.