Work Project VenueBook / Search

VenueBook / Search

Addressing pressing usability issues.

For this release, we focused on making the Search page more compact and user-friendly.


Problem

With the old search page, there were a couple of problems.

Venues were listed in square cards, which meant that the card height would increase if the name of the venue was too long. There was also an issue of scrolling–one would try to scroll while the mouse rested on the map, but the page would scroll (instead of the map zooming).

You also had to place your mouse “just so” within the search results in order to see additional venues. Finally, the search area and search filters took up a significant amount of screen real estate, so many users didn’t understand that they’d need to scroll in order to see results–in fact, they believed that the featured venues at the top of the search results page (which had no indication that they were featured) were the search results themselves.

Audience

Accidental planners–individuals who work for small/medium-sized businesses who planned events because it was a need, not because it was their primary job title.

Constraints

Filters: The filters for search were large and cumbersome. I needed to figure out how to make the filters more compact to free up screen real estate, while making sure that they’d still be clear and easy-to-read.

Card size: How could I make the venue cards larger to accommodate venue names, while making sure that images were still clear?

Search Bar size: How could I decrease the size of the search bar to only contain the bare minimum a busy planner would need to find the search results she’s looking for?

Design Process

Using our assumption persona, I found individuals who’d be a good fit for usability studies. These individuals provided great feedback on my pencil and paper wire-frames, which I used to create high-fidelity mock-ups. In another round of usability studies, I shared the mock-ups with planners via InVision, and made tweaks as necessary.

Once all tweaks were made, the designs were handed off to the developers using Zeplin.

Sketches: Figuring out the new search’s layout and hierarchy

Retrospective

Shipping is important, but…: We rushed to redesign the entire VenueBook site, which led to us making a lot of assumptions. We knew that we’d have to go back and iterate and the Search page is a perfect example of what happens when you rush, but aren’t willing to make improvements.

Sketch & Mock-up: Figuring out the new search’s layout and hierarchy, continued & the final design