Pello
A mobile solution designed to connect pet owners with veterinarians.
iOS - Mobile - Wearable - Responsive Website - Research - Wireframes - User Interface - Usability Testing - Prototyping
My Role: Product Designer
Timeline: 10 weeks,
Nov 2020 to Jan 2021
Tools: Figma, InVision, Marvel POP, Pen&Paper
Project Type: Independent, conceptual model
The Problem
Pets are part of our lives and families. But keeping up to date with their health needs can be challenging.
It all started when I became a new pet owner. I was overwhelmed by the number of vaccine appointments my puppy needed. Having an out-of-hours emergency was also desperate - I didn't know where to go.
I knew this was a major issue when I constantly met other pet owners facing the same (or worst) frustrations: they were also worried about their pet's special needs that can also be worsened due to ageing.
It was natural to me to come up with some high-level goals:
The Process
Secondary Research
Through a closer investigation of the problem space, I was amazed to find stats showing that Canada is a pet-friendly country. Approximately 41% of Canadian households include at least one dog and 37% at least one cat.
That's about:
Once I had this overall idea of how many pets I was dealing with, I was surprised with other pieces of information I found. And it crucial to get a sense of the roots and causes of my problem space.
Design Question
Once I learned more about the problem space through key quantitative data, I formulated my design question:
”How might we help Canadian pet owners take care of their pet’s health in a more convenient and time-efficient way, in order to diminish veterinary appointments no-show?"
Primary Research
With key data and the design question to guide me, it was time to talk to Canadian pet parents to get an in-depth understanding of their challenges in managing their pet's health.
I conducted this qualitative research with 5 different people, and I noticed some themes stand out. Using colour-coded sticky notes, I grouped them into motivations (pink), pain points (yellow) and their behaviours (blue).
From the interview categorization, I came up with some key insights:
Persona
To easily recognize and empathize with my target user's needs and keep them at the center of my design decisions, I created Cecilia Daniel (and her dog Max) as my primary user persona.
Experience Mapping
After that, I designed an experience map to visualize Cecilia’s current process of experiencing an emergency to finally taking Max to the vet. Finding opportunities for design interventions in her journey was extremely helpful and insightful for me.
Ideation
Now it was time to think about digital functionalities as possible solutions to alleviate Cecilia’s pain points.
From exploring a wide range of user stories, I created a task flow for the app's main functionality: connect pet owners with veterinarians based on their pets’ symptoms.
Paper Sketch Exploration
To give that flow a realistic mobile feel, I grabbed UI inspiration related to pets and the veterinary world. I observed a trend in cards and rounded elements and decided to adopt the same consistency.
Then, I started to unleash ideas into raw pen and paper sketches and came up with two different versions:
Version 1
Experimenting with the possibility of choosing online or in-person appointments from the start. Cards for filters and appointment page.
Version 2
Here I went with a different home page options. I also included an edit option in the appointment overview.
Wireframes and Usability Testing
Through rapid user testing to validate basic functionality, I was ready to translate sketches into wireframes which I conducted 2 rounds of usability testing with 10 different people in total.
I collected testing insights and applied the matrix of effort vs. impact to prioritize my subsequent iterations. The main usability fix was in the initial Appointment Type screen:
Initially, the task flow was thought out to book veterinarians based on general filters. However, during usability testing, I felt the need to bring more value to the emergency appointment. That's why I decided to include a step that would find a vet based on pet's symptoms:
Visual Design
It was the moment to define the product branding that would echo its mission and core value proposition. The first step was to create the name and wordmark. My constraint was that it had to carry pet care meaning and be memorable and pronounceable by most languages.
After playing with words in my sketchbook, I came up with "Pello," which stands for pet and care, in a mix of Portuguese and English words.
Moodboard
Once I established the brand name and its adjectives [reliable, welcoming, competence and serene], I collected visual inspirations for Pello's look and feel. Getting immersed into this, I was amazed to notice that the colours I extracted from curated images reflect Pello's adjectives. That was the moment I decided to keep orange and blue as my brand colours.
Hi-Fi Mockups
The first approach to deciding how I'd distribute the colours throughout the app was accessibility, following WCAG Guidelines for background and foreground contrast.
Then, I set a constraint to combine colour, typography and illustration to make it welcoming but straightforward, targeting reliability and soothing feeling. Then I experimented, ideated until I got the fight fidelity and prototype done.
A welcoming home page
When Cecilia opens Pello, she is greeted and reminded of Max's upcoming vet appointment. She also has an overview of his health information and the health solutions, including Booking a New Appointment.
A personalized list of veterinarians
Once Cecilia inserts her pets’ perceived symptoms, she finds a list of available veterinarians. She can also filter by dates, location, appointment type (in-person or video call), reviews and visit cost.
New appointment. One screen away
After selecting the preferred vet, Cecilia can choose the appointment based on the next available spot or schedule it when it's more convenient to her.
Beyond the Mobile
Thinking about the product's scalability, I designed an Apple Watch extension for Pello and a Marketing Website to increase visibility and download ratings.
Apple Watch
To increase the presence of Pello in Cecilia's journey, I designed an Apple Watch extension of the app to reschedule or cancel an appointment.
By defining the challenge, mapping a storyboard, platform research, ideating and prototyping, I came up with this wearable solution that allows her to make fast-decision based on her schedule and needs.
Marketing Website
With the final product ready to be launched, I decided to develop a responsive marketing website to give potential users an overview of the product and service before committing to download and trying out the app.
The design process brought me back to paper sketching, feedback and iterations to keep the look and feel consistent with the brand.
Future Implications
Moving towards the deliverable part of the design process, I come up with other designers to discuss the project's impact when scaled to a larger user base.
We used Tarot Cards of Tech to drive our discussion, and I was given "The Forgotten" card.
Reflecting on the project and this card's purpose, I notice the urge to adjust Pello for accessibility for those who own service pets. Although they can be potential users of the app, they may encounter difficulties reading and typing.
To address this potential problem, we've discussed a possible solution to incorporate voice experiences within the app to make navigation more accessible. That's definitely one of the priorities for my next iterations.
Learnings
During this 10-week journey, I not only learned the end-to-end (and iterative) process to design human-centred solutions, but I also discovered a lot about myself as a designer.
Thank you for reading :)
let's work together!
© Letícia Thaís Moraes, 2022