Woof - Dog walking app
Reimagining the dog walking experience.
The Brief
Dog owners sometimes need help caring for and walking their dogs. The brief was to create a service to connect dog owners with dog walkers.
The design process
I started the project by clarifying the brief, then doing research and empathising with the user, defining the problem to be solved, understanding who is the user and what are their needs and pain points. Then I focused on the requirements, then I ideated and created concepts, prototyped and tested the prototype and refined based on user feedback.
Research
The research phase was divided in two parts.
1. Interviews: asking people about their experiences with dog walking
2. Market research: finding existing companies offering similar services. Doing some competitive analysis to find out what are their unique selling points, and what features are they advertising.
Interviews
Key insights from the interview:
The user needs to use a pet sitting service when they go on long holidays.
They would love to get updates for piece of mind that their dog is doing alright when they're not around them.
They need reassurance that the dog minder can recognise their dog's needs and have a tailored approach to them.
They also need to be understanding of their dog's background. Their dog is rehomed, and gets stressed out when they go away.
Trustworthines, caring and patience are key characteristics they look for in a dog minder
They want to be sure that their dog will be properly looked after and entertained rather than not locked away
Their main challenges have been unprofessionalism and impunctuality. This has affected their travel plans.
Market research
With this desk research I benchmarked best practices and what other solutions already exist, looking to find what are the main drivers for a walker/owner, which one works better and why, where do I find a gap on these apps and where I can find an opportunity for my solution.
I analysed three products that currently serve the need of dog minding services.
1. Borrow my doggy: Connects people who want a dog but can't have one with dog owners so they can walk their dogs. It does a great job at showing the value that both owners and borrowers will get. Includes testimonials of happy users, and allows for both borrowers and users to create their own profile, but their visual style is busy and inconsistent, and can be confusing. It has deceiving pattern that it doesn't indicate that users will need to pay for the service, it mentions that people can create a 'free' account, but can't borrow unless they have a subscription, this should always be upfront.
2. Rover: Connects dog owners with dog walkers and sitters.
Visually appealing and it does a great job at explaining their service offering and what are the differences between them, which include boarding, house sitting, drop-in visits, doggy day care and dog walking. They also indicate that all sitters have been previously verified by them.
3. Tailster:Their selling point is GPS tracking so users can be reassured of where their pets have been. The user inputs what they are looking for, and then will receive quotes from potential walkers. Visually they have an inconsistent use of images and icons,
The most prevalent painpoint is that connecting and booking with a potential sitter is not straightforward, especially for people who want to get it done fast, the steps usually include to input owner and pet details, sift through the different options, choose a dog walker, contact them, wait for them to respond, agree on a date and fee, complete booking.
There is an opportunity to streamline and simplify the way users can get the dog walking and minding service they want and make it user for them to have visibility of who will be caring for their dog and reassurance that they are good at it.
Persona
Once I gained understanding of the user, their past experiences with dog walking services, their pain points, their needs I translated these insights into a Persona, to help me visualise who I was designing for so that I could reference it as I progressed in the design.
User flows
After the research and having created a persona, I created a user flow diagram, to visualise the journey of a user from starting the service to actually booking a sitter.
The concept
I explored how to respond to the need of the user which is to help dog owners trust that their dogs are in safe hands. I also considered the shortfalls and painpoints of previous apps, so effectiveness, communicating value and keeping time as a key factor, to make it easy to find a person to care for their dogs.
Wireframe
On the first iteartion of the wireframe, the user goes through onboarding and explores the product offering before signing up. They create their profile and after signing up they can select dog walkers near their area
On the second iteration of the wireframes, the user goes through an in-depth series of questions so that they can get a more personalised experience. The more we know about them, the better suggestions we will be able to give.
Visual designs
After having an idea of how the app would work, I explored visual design to make a high fidelity wireframe and make it look more real.
Moodboard
I created a moodboard to get inspiration from different products and their application of colours.
Then I established my own colour palette, fonts, type size, while looking to apply the principles of visual design such as balance, proximity, alignment, hierarchy, repitition and contrast.
After exploring other products, I decided to use yellow and dark teal as the main colour combination, as they inspire joy and trust, and that is something I wanted to communicate. I also gave myself the challenge of working with yellow as I consider it one of the hardest colours to work with.
I applied visual design to all the app screens based on the colour palette selected.
Design system
Design systems are really useful to make sure that the design is consistent and scalable. At this stage, I defined the components that would been used in my screens. I created a component library using auto-layout for all of the elements in the app which would make it easier to scale the design and make it easy to apply any changes down the line.
Iterating the wireframe and components
I made a second iteration of the wireframe as I realised that the first set of components I created didn’t work for this. So I had a new go at creating responsive components that would allow me to create an interactive prototype.
The prototype
When I was happy with what I had accomplished with the high fidelity wireframes, I linked the screens together and applied animations to build a prototype, which would allow me to show it to other people and get their feedback to learn if the concept and assumptions I had made about the app would be validated.
Feedback
I showed the prototype to 4 users to get their feedback. Two of them are product designers, one of them owns a dog, the third user is a ux writter and the fourth user has a lot of experiences as a dog owner.
Each user tested individually, and provided their input on Figma as comments. I was able to observe one user as they interacted with the prototype. I was able to observe their reaction and behaviour when using the app.
They all gave me valuable feedback on how to improve the visuals, making the text easy to read and more accessible, especially because yellow is a colour that is difficult to use with white, so they gave me tips on how to make the design more accessible, considering the right spacing between all the elements, and finding better ways to express things. They also gave me their general opinions of the design.
They mentioned that they liked how the prototype flowed, there were questions that I didn't need to ask like the weight and height of the dog, as they would not have an idea of it, they liked the chat feature that would allow to communicate with the dog walker, and that seeing the user's credentials and the ratings they had from others would also allow them to trust that their dogs are in good care.
Actioning feedback
I found it really valuable to present my designs to others as I got to hear similar feedback from different voices, which I knew I had to act on it.
Although the testers liked the design, a unanimous feedback was that they were finding it hard to read the white on yellow text.
They also asked me to keep each screen simple and minimise text. I realised that I was communicating the same thing with headings and subtitles, so I removed them because I needed to be more intentional with each of the elements I was placing on each screen.
I was suggested to give more space to the placement of components and to the text too and remove fields that don't add any value to the user. Some mentioned they wouldn't know the exact weight or size of their dog, so I simplified that field and only left essential information that would be useful to input for the owners and the dog walkers.
My key learnings from testing with users:
I will be doing more usability testing earlier on in the process so that all the iterations are considering the feedback from the user and not just the 'finalised version', to ensure that their needs are being met throughout the whole process and to make sure that the if the product is not appealing, I can go back and make changes before I make more progress on the prototype.
The final prototype
After considering all the feedback and making all the changes and tidied the design. I have made a final prototype that showcases the concept of Woof, an app that helps users to easily find dog walkers giving them the reassurance that their dogs will be taken care of by professionals that meet their requirements, and it gives them personalised results and suggestions based on their preferences.
Key takeaways
I had a lot of fun designing and exploring a new way to solve a problem and visualising the solution.
Consider the accessibility of the design from the start, and not as an afterthought.
Creating components requires patiences and precision.
Do not get fixated on my initial ideas. Design is supposed to evolve, so the more I learn from users the better experience I will be able to create.
The input from users is invaluable, it helped me see things from a new perspective, which helped me to validate assumptions.
Sometimes I wanted to communicate too much, but less is more.
Being intentional with the design of each screen.
Keep testing and iterating.