Find and share your favourite dog-friendly places.
About the project
Due to the Covid lockdowns, there has been a surge in dog purchases.
It was important to think of a useful tool to help dog owners to get information easily, and avoid frustration and misunderstandings.
During the lockdown, I was doing Tai-chi in the park with dozens of dogs playing around.
I noticed that people with dogs were meeting at the same hours and were using WhatsApp groups to organize these gatherings.
Discussing it with my fellow peers, we developed the idea to create a location app that would help dog owners to find locations and meeting points easily.
Designed for:
a UI/UX design student project.
The goal was to define a problem related to the location and recommendations app. Going through UX processes and UI design creations.
UX phase
UI phase
-
Design thinking process
-
User Persona
-
User flow
-
Rapid prototyping
-
Usability testing
-
Moodboard
-
Style Guide
-
Low to high fidelity wireframe
-
Grid system
-
Responsive design
-
Mockup design
Timeline
Tools used
1.5 months (Part-time)
Figma, Marvel, Usability Hub
The challenge
How can I :
01
Help dog owners to find dog-related places and information in their city easily.
02
Create an original and intuitive design experience for all types of dog owners.
03
Create consistent, simple & evocative UI, effective design patterns with colors, typography, and spacing.
04
Keep in mind scalability so that designs are adaptable for the long term.
The process
I structured the UX phase, through the Design Thinking process.
Final design
Understand...
Understand...
-
How a location and navigation app works and how is it generating profit ?
-
What are the strengths and weaknesses of such products app?
-
What are the psychological traits behind their UI designs?
Competitor analysis
I selected navigation apps that include services and information, where people and businesses are part of completing the app’s information data.
The features of sharing, posting, commenting and creating content, allow the company to optimize the product and bring new solutions for discovering locations in cities.
Business Goals
A location and recommendation app that helps dog owners to easily access dog-friendly locations, routes and information.
Target market
Novice to experienced dog owners. (18 to 80 years old)
General Features
-
Find easily locations and activities related to dogs
-
Locate dog routes or good walking paths.
-
Share and review options.
Opportunity
A simple, playful, easy to read and to navigate app for novice to experienced dog owners.
Observe
Observe
User research through the Research Learning Spiral
I conducted an interview with dog owners and went prospecting in dog parks.
Through multiple interviews, I could identify frustrations about the lack of information about dogs in cities. No indication for dog allowance, route suggestions, dog toilet, dog veterinary, dog sitter... it can also be very challenging to find the matching dog communities and dog-friendly spaces when transiting or travelling.
Point of view (POV)
Create user persona profiles to get the closest to potential users' needs.
User personas
Ideate
Gathering requirements
At this stage, the concept becomes clearer. Therefore, I used the Job-to-be-done framework to design adequate feature solutions that meet user needs.
Minimum Viable Product
I define MVP features; this process helps me to create scenarios to respond to the business goal, so to be usable by early users who can then provide feedback for future product development.
As a dog owner, I want to be able to find easily locations and activities related to dogs, so I, don’t waste time searching.
I want to locate dog routes or good walking paths, and to be able to share and review them.
User flow
At this point based on user research and the personas I could create a user flow to represent the steps the user will take to complete a task.
Prototyping
Rapid prototyping involves quick sketches of wireframes. I implemented the following key features :
-
Login
-
Search dog related places
-
Access to map
-
Locations info's
-
Access to itinerary
Test
Usability testing is a technique used in user-centred interaction design to evaluate a product by testing it on users.
In that context, I’ve been interviewing the dog’s owner in my neighbourhood by using Marvel, a prototyping app that allows animating simple interactions in wireframes.
Objectives
-
Observe the user interaction with the prototype.
-
Check if there are any user frustrations during the interaction.
-
Check if there are any suggestions regarding design.
-
Observe the user interaction with the prototype.
-
Check if there are any user frustrations during the interaction.
-
Check if there are any suggestions regarding design.
Suggestions
“Key features are directly accessible; recognizable icon categories on the map with direct screen interaction.”
“Always have access to the bottom menu and back arrow sign in order to go to the main page.”
Gathering feedback
Gathering process feedback during a Usability test of a rapid prototype, helped me to adapt and optimize a better human-oriented design.
Suggestions
“Firstly, I would like to see the map first when searching for a park.”
Karolina,
dog owner of a weimeraner
“Always have access to the bottom menu and back arrow sign in order to go to the main page.”
Julie,
dog owner of a chiwawa
“Have the option to add an itinerary key feature”
Christian,
dog owner of an Italian greyhound.
Mid-fidelity wireframes
Following many rapid sketches and adjustments based on the previous usability testing; I oriented my decision making to mid- wireframing on Figma. This helped me to evaluate with better precision and detail, the UI elements' placement and spacing, as well as to evaluate the problems more distinctly.
Welcome
Map
Search input
Info location
Itinerary
Visual design
After gathering all my learnings, I jumped into the visual communication phase, where I produced consistent and evocative designs, with effective style guides including : UI elements, colors, typography and spacing.
I enjoyed creating user interface elements and diving into design systems. It emphasized the importance of designing with a meaningful and long-lasting approach.
Moodboard
Playful Children Illustration Creativity Simplicity
Objective
Generate a feeling of creativity and playfulness similar to a game for children.
Evocative and simple visual elements, easy for location and recommendation apps.
Information architecture: Finding design structure in order to avoid visual overload.
Provide a style guide easy to use with a transferable approach for future colleagues.
Stick to the task of the deliverable
A/B Preferences testing
Preference testing is a feedback process toward understanding what users prefer and why, before the product is completed. The tests consist of a randomized experiment with two variants, A, and B.
To run that experiment I used the Usability Hub app.
Thanks to Preferences testing and feedback from 20 participants, I could define which screen design and aesthetic would work.
Feedback
“ Simple and straight to the point. The app, if I'm not wrong, focuses on locations that are dog friendly. The other option made it feel like it was a dating app for people with dogs. Great work for both though! ”
” Less cluttered to the eye and it provides a nice balance. The image of the dog is strong and the integration of location with the trail says it all in a snap. ”
Style guide
Based on the Moodboard and the Mid-fidelity wireframe, I defined a Style Guide that would have a pleasant, clear and forward look. Bright, friendly colors combined with a playful cartoonish aesthetic make the app very approachable and highly appropriate for location apps and a dog-themed app.
A warm blue as the primary colour gives a pleasant & trustful touch, supported by the secondary soft orange colour that brings an optimistic feel.
A smooth and modern Typeface, responsive and easy to read on many screens.
A colourful colour palette for the different Activity Icons to offer fun in the discovering process.
Rounded & simple shapes, referring to organic UI elements.
Colours palette
Typography
UI elements
Imagery
Language style
Dog City aims to gather useful information for dog-friendly locations; therefore the tone and the language should be encouraging and easy to understand.
Conclusion
This project allowed me to dive into UX design and complement my previous project.
During the research and the visual phases, I delved into the different UX processes; learning the importance of a user design-centred approach. This got me to understand, structure and develop problem-solving perspectives from multiple points of view and fit this into a visual identity.
This was a challenging one since I realized how important it is to engage user testing and feedback early in the process.
User feedback provides a very impactful and realistic point of view.
“It is important to get to know the people that are going to use the app.”
To take away
I believe this app has true potential for solving a real problem.
Some future MVP iterations would be :
-
Creating Business Profile: Businesses are playing a crucial role in developing this location and recommendation app.
-
Enable a dog owner communities platform, including a forum, documentation etc.
Find dog-friendly places easily, parks, veterinary, restaurants, cafes...
Enjoy our easy navigation tools and icons, discover new places and new smells for your doggy.
Schedule and organize your day smoothly with your best companion.
