Find your new favourite office(s).
Being a student, and a freelancer, I am often in and out of coffee shops, libraries and co-working spaces.
Constantly asking people for the wifi password and amassing a large number of coffee cups is kind of my modus operandi.
But finding a place isn't always easy, some places I frequent don't have outlets, or there's a 1-hour wifi limit (is this 2002?) and some are just so loud that you can't get work done anyway.
So for this challenge, I decided to try and tackle the problem and create a tool for the digital nomad. Whether in pursuit of that quiet corner or kick-ass breakout rooms.
Now I understood that this was a problem that I was experiencing, but I wasn't just designing for me.
So I went to a coffee shop down the street and started asking people.
How did you find this spot?
Are there any reasons why you came here instead of x or y?
Where would you have gone if this place was full or closed?
After a few minutes spent asking actual people who were actually working in actual coffee shops, the evidence was clear.
One disgruntled developer put it so poetically I couldn't leave it out:
The Job To Be Done
For this project, I decided to view the problem through the Jobs To Be Done (JTBD) framework.
This forced me to quickly look at the research and figure out what jobs someone would hire Stühl for.
I would have wanted to conduct more research to better understand the needs of the user, but time was ticking, and I needed a product ASAP.
I settled on a Jobs To Be Done statement that I could work with.
I want to find a place to work that fits my changing needs.
With the project deadline coming up I quickly drew up some sketches of what the searching and filter sections of the app might look like.
I also took the time to consider and draw out some concepts of empty or error states as well as an imagined home screen.
After sketching the next step was to move to quick wireframes to establish the navigation and overall page layout. Unfortunately due to a mix of rushing and a dash of misplacement I wasn’t able to save any of my sketches.
The First Try
While designing this search and filter system I tried to work with the primary user's typical search intent.
Were they more of a browser, or did they perform targeted searches for exactly what they wanted?
Using icons was an attempt to balance the needs of both types of users. The idea behind this was that the icons would provide a quick and easy understanding of the amenities provided at a location.
Unfortunately, they did the opposite and actually confused users instead.
With some key takeaways under my belt after some very rapid guerilla testing. It was back to the drawing board to work on the presentation ready prototype.
With the deadline looming, I knew I had to focus on the key areas where users struggled to understand the interface.
With that in mind, I decided to scrap the icons, and instead go for a simple toggle for filter selection (similar to Yelp). I also opted for a card based visual system to help create hierarchy and reduce confusion.
The addition of the iOS notification was also a pleasant surprise to users since they felt that when in a rush they might simply hit the back button and lose their filter preferences.
These changes tested well and users were able to quickly understand what they were looking at and how it related to their search.
The time constraints on this project were interesting and taught me a lot about how to pick what to work on as well as how to ask the right questions, to find the answers that will help you design the best product.
I also realized how hard it can be to create a well-designed search function. I never realized that something I used so often, could have so many design challenges.
Since this project was completed within a very short time frame I hope to revisit it in the future and continue to work on the visual design and the search/filter system.
Alas, on a personal front the hunt for the perfect coffee shop continues.