This project had a clear goal: translate the desktop experience to an iOS app under an agressive deadline. More than 60% of the requests come from mobile devices but we never had any native apps.
I collaborated closely with designers, PMs and engineers to scope and design the features in the app. I worked on sketches, wireframes, prototypes, visual design an ran user interviews for some parts of the app. I will focus on those in this case study.
The graph below explains how a customer experiences the app and what he feels along the way in three simple steps. Having these three core moments in mind was key to design a good product.
After a kick-off meeting where the team brainstormed the flow together on the whiteboard, I started exploring and wireframing the app in short iteration cycles. It was important to get early feedback from users and team members before we went too far into one solution.
As soon as I had some strong directions on the board, I moved on from the quick and dirty low-fidelity prototypes to ones with a better quality - just good enough so I could run a dozen user interviews and learn what was working well and what was not. I repeated this process a couple times until the team and I felt that we had a good solution.
At Thumbtack, customers request professional services to accomplish their goals - from house cleaners to wedding photographers - by filling out a detailed form telling their specific needs.
It was challenging to find the right balance between asking too much or too little. A customer needs to enter precise information in order to receive a relevant quote from professionals. We also worked hard on the questions - they have a friendly tone and they’re presented one at a time to the user, which makes the form being perceived as easy and fast to go through.
There are a few key moments in Thumbtack’s experience: when you finish entering your needs and post a request, when you receive your quotes and when you hire a professional. I used Flash and Pixate to explore how tutorials or confirmation messages could express that feeling of reward.
Shortly after submitting a request, Thumbtack will match the consumer with skilled professionals which will prepare custom quotes for him. The quotes also come along with profiles highlighting their experience.
By blurring their profile picture and using it in the background, I gave each quote a distinct look and feel making them easier to be compared and remembered later.
Choosing can be overwhelming. By highlighting what’s important and making the quote and profile easy to scan, we help the customers compare their options and feel confident they’re hiring the best professional. The sticky CTAs Message and Call also give a hint on what the customer should do next.
We want to facilitate the communication between consumers and professionals so they can work out the details of the job together. Big and clear call to actions help with that.
Nobody likes to stretch his fingers trying to reach out to a button at the top of the interface. I put the most used CTAs at the bottom, close to your thumb.
I used Pixate and Flash to prototype and explore other features that unfortunately didn’t make the cut.
The app works perfectly if you need something right now, but it’s also important to let the customers explore and learn about all the service categories covered by Thumbtack. I designed and prototyped this exploration mode where you can see all the categories, organized by five pillars: Home, Events, Lessons, Wellness and More.
I want the app to open up with a series of short movies showing different consumers and professionals working together: a wedding photographer, a personal trainer, a piano teacher and maybe others. It’s a subtle way to inspire the users and communicate what can be accomplished with Thumbtack.
After a lot of work, the app was launched and it’s available on the App Store. Do you need to get something done? Download and try it!Download the App