CASE STUDY
PawPals is a fun web/app aimed to connect homeless animals with its potential owners in a Tinder alike experience.
That was an educational project that I conceived during my Postgraduate Studies in “UX/UI Design for Web & App” at IDEP Barcelona (Escuela Superior de Diseño, Moda y Fotografía).
Objective:
The main objective of the project was to apply the principles and methodologies of UX/UI design to create a digital platform that facilitates pet adoption by connecting homeless pets with loving homes. We wanted to simplify and make the adoption process fun and hassle-free.
Target:
- Potential pet adopters who are looking to add a new furry member to their family.
- Pet owners interested in rehoming their pets due to various reasons.
- Animal shelters and rescue organizations seeking to increase adoption rates and find loving homes for their animals.
- Pet lovers and advocates interested in supporting animal welfare causes and initiatives.
UX Research
- User Persona:
- One of the first things was to create a user persona named “Laura Pérez” representing a typical user who is considering pet adoption. Laura is a busy marketing manager with a family and has limited time to research adoption options. Her main goal is to find a pet that fits well with her family’s lifestyle and preferences, while her main challenge is finding time to explore adoption opportunities.
- Customer Profile:
- We also developed a customer profile that outlined the characteristics, behaviours, and needs of potential pet adopters. This profile included details such as gains, jobs, motivations, pain points, and preferences related to pet adoption. By understanding the target audience, the team was better able to tailor the design of PawPals to meet their needs.
- Interviews:
- The core part of UX research were user interviews with individuals who had experience with pet adoption, including potential adopters, pet owners, and shelter staff. These interviews provided valuable insights into the adoption process, user preferences, pain points, and expectations. Key findings included the importance of compatibility between pets and adopters, concerns about the adoption process, and the desire for a user-friendly platform that simplifies adoption.
- User Journey Map:
- Based on the insights gathered from user interviews, I’ve created a user journey map to visualise the steps and touchpoints involved in the adoption process. The map outlined each stage of the user’s journey and identified key interactions like first contact with a shelter, adoptive forms and post-adpotion support to be crucial and with potential for improvement.
Pain Points
During the user research phase of the PawPals project, several pain points were identified in the pet adoption process. One significant pain point was the time-consuming nature of the adoption process. Potential adopters often found themselves overwhelmed by the amount of time and effort required to research adoption options, browse through pet profiles, and complete the necessary paperwork.
Wireframing
The wireframe design process began by translating the key concepts and components of the IA into visual representations.
Translate IA Concepts: Homepage needed to be a visual and coherent invitation to explore the rest of the functioanalities of the web/app.
For the quiz section, wireframes were created to depict the question flow, answer options, and progression through the quiz. We didn’t want a long boring forms. Similarly, wireframes were developed for the profile browsing feature to illustrate the layout and interaction design for browsing pet profiles.
Branding
Logo:
The PawPals logo features a heart combined with a paw print. This design symbolizes the love and care that pets bring into our lives and the commitment of PawPals to finding them caring homes.
Colors:
Primary Color Palette:
•Warm Lilas: Chosen for its energetic and welcoming qualities. Lavender evokes feelings of warmth, enthusiasm, and positivity, which are essential emotions in the pet adoption process.
•Soft Greens: Represents nature, calmness, and reliability, which reassures users that PawPals is a trustworthy and dependable platform.
•Neutral Beige: Used for backgrounds and subtle accents to maintain a friendly and approachable atmosphere. Beige is a neutral, calming color that provides balance and harmony in the overall design.
Fonts:
Primary: Jomhuria gives an informal look, it’s used for headings and significant text elements to draw attention and provide clarity.
Secondary:
Montserrat: A modern, clean, and highly readable sans-serif font. Montserrat was chosen for its versatility and contemporary look.
Visual identity
Design UI
The homepage of PawPals is designed to provide a seamless and engaging user experience, guiding visitors through the key features and offerings of the platform. Here are the main sections of the PawPals homepage:
- Hero section – heartwarming visuals of pets and their adopter
- How It Works – visual representation of the adoption process
- Featured Pets – a curated selection of adoptable pets
- Success Stories – testimonials from successful adoptions
- About Us – a brief overview of PawPals’ mission
- News and Updated – links to the latest news, blog posts, or articles
Homepage & onboarding
Onboarding
Quiz
Quiz
Quiz
Swipe
It’s a match
Chat
Donate
Swiping Section
A swiping section enhances the PawPals platform by making the pet adoption process interactive, engaging, and user-friendly. By combining intuitive design with personalized recommendations, this feature helps users find pets that align with their lifestyle and preferences, ultimately increasing the chances of successful adoptions. The thoughtful design and functionality reflect PawPals’ commitment to creating a positive and enjoyable experience for both adopters and pets.
All Pages
Conclusions
The web design for PawPals effectively combines visual appeal, usability, engagement, functionality, and accessibility to create a user-friendly and emotionally resonant platform for pet adoption. By focusing on user-centric design principles and leveraging interactive elements like the swiping section and personalized quiz, PawPals enhances the user experience and increases the likelihood of successful pet matches. The thoughtful design and clear presentation of information build trust and make the adoption process more efficient and enjoyable for users.
