Moto Vouch Search

A Design Case Study

Earlier this year we started talking about creating our own project for the most part we have been a team of three, two devs and yours truly. Among the ideas that we were playing with there was this sort of reverse auction car marketplace that secured sales for the dealer, and brought prices down for the consumer. Of course I was in charge of Macsexify (yup that’s their word for it) the solution, for me it meant to step up the design approach.

I started to study similar sites, taking notes of what I liked and what I didn’t like, understanding the space, I’ve never been a motor enthusiast so I started following some blogs. I found a huge difference between the manufacturer sites and the autotraders of the world, the former did a great job at showcasing the cars, engaging and enticing the user; the latter was all about results, giving you as much results as possible and as much filters as possible.

Another thing popped on my research, all the sites had basically the same overflow of filters, by far this was the place with more friction, so I gave this action a top priority during my explorations. I tried to avoid mandatory fields as much as possible, the bare minimum of required fields to display results the better, a more classic approach quickly became a problem so I hatched those sketches.

Among the different approaches there where three that were gaining strenght. Selective filtering which wasn’t as fancy as it sounded basically was leaving up to the user to be as specific as they desired. I had two approaches for this specific one, one showing the user all the options at once and the other showing just the main criteria to start and initial search and then add another layer once results appear

Double Row Selective Filtering Sketch

Adjusting the design to the goal of removing as much friction to get results I was planning to settle with just the main filters. Something that I liked early on that few sites had implemented well, was a way to search for multiple models from different makers. Let me see if I can explain myself, as a user I may want to look and compare Audi’s A3, A4, A5, some Volvos and some BMWs, on some sites that was impossible to do, on other it was just painful to try to understand the UI to do that. So we settle with a nice tag system that allow the user to do just that.

Selective Filtering Tag System Early Design

The other approach that was gaining force was minimizing the initial search to the max, after several conversations I notice that most people searches with one top filter on their heads: “I want a sedan” ; “I’m looking for a Volvo” ; “I want from close by dealers only”. So this approach had an initial free for all search that once the user get the first wave of results a more traditional filter will be part of it. Later on this concept got the tag approach of the other one.

Rough sketch explaining the user behavior within this design solution

I really liked how loose and natural it felt to start seaching this way specially after the dev team assure me that instant search suggestions would be possible for v1, I really like this approach but somehow it felt too lightweight which of course was the goal but that’s when you know you aren’t there yet, when you know you haven’t hit that sweetspot.

One other approach that was quite interesting was displaying results all the time, this approach was quite ambitions since it would rely on a learning engine that would take into consideration searches, filters, time spend on each search setting and how recent. But for several reason I scratched the idea, not only for technical reasons, but because it wasn’t solving the problem I was having it was only masking it. In the meantime the visual language was evolving quite well.

Evolving the concepts I end up settling with one solution that basically merged the best of the three strongest concepts in some way, and I took a page from a previous concept we never developed enough on other project, it did took some time, paper and pixels to refine the idea to that sweetspot we are always looking for.

Dynamic Search

The final solution a single search bar with live suggestions that allowed multiple filters to be taken at the same time, those enclosed into tags for and easier understanding. On the back the search bar will be smart enough to understand when some queries are exclusive or inclusive, without forcing the user to make it on any specific order.

Search_Tags= [sedan] OR [compact] OR [coupe] ALSO [volvo] OR [audi]

This approach proved to be nimble yet powerful. Users would be able to get results in the fastest way possible and yet able to drill down as specific as they choose in virtually a single step. The suggestions as you type helped this solution to become super intuitive as well.

Overall it was an interesting project where I was able to bring some nice tweaks without creating too much work on my dev partners, but more importantly not only bringing our concept to live but solving a lot of problems that services like this usually have for the end user. Sadly for business reasons we killed the project, now a couple of months after the death of Moto Vouch I’m happy to share a couple of thoughts and part of the process that went into this product.