Ammar Khawar | UX Engineer

Pet Portal Ai

The 4-step process we used to move from an MVP to Innovation

Pet Portal AI is an innovative platform that gives pets a voice through an AI-powered virtual twin. It helps pet owners better understand their furry companions by offering 24/7 tailored advice on health, behavior, and nutrition, transforming the pet-parenting experience.

Project duration

Jul 2023 - Sep 2024

Responsibilities

User Research, Wireframing, Interface Design, Prototyping, AI Image Generation

Role

UX Researcher and UI Designer.

PLAY VIDEO: What is Pet Portal AI?

project overview

Problem statement

Pet parenting has been overwhelming, especially with the abundance of generic advice available online. Pet parents struggle to find information that is specifically tailored to their pet's unique needs and personality. Additionally, shelters and rescues often lack the resources to provide potential adopters with detailed information about the pets in their care. This gap in personalized pet care and information has lead to misunderstandings and missed opportunities for building strong bonds between pets and their owners.

Goal

The goal for this project was to deepen the bond between pets and their owners and to enhance pet care by providing personalized, 24/7 guidance. Another goal was to support shelters and rescues by offering detailed pet profiles to increase adoption success.

Understanding the user

Product Demand

I gathered the majority of my consumer information from pet forums on the internet.

"Puppies need the right amount of exercise, food, sleep, socialization, and care. Those that have not been bred and raised right, will be more withdrawn or aggressive. Not all pet parents are equipped to being a pet parent."

"We are looking to add an addition to our pet family. I don't have hardly any experience with cats, never owned one. The only animal we have is Dewy the standard poodle. I have been researching introductions between dogs and cats and trying to find the best match for my poodle."

"My standard poodle is a sweetheart, except when he gets in what i call a mood. He mouths A LOT, and it can hurt. I have tried it all, but it isnt working."

Competition analysis

After looking through the web, the community forums and chat gpt, i was able to find my top four competitors.

PetCoach

Key features

Platform for pet advice and vet consultations.

Access to licensed vets.

Q&A section.

Mainly health-focused, less interactive.

Vetster

Key features

Video consultations with vets, scheduling.

Focused on medical advice.

Access to licensed veterinarians.

Paid per consultation

My dog doc

Key features

Online veterinary care for dogs.

24/7 vet access & personalized care plans.

Provides veterinary advice and support.

Focuses mainly on health advice.

AskVet

Key features

24/7 access to veterinarians via subscription.

Chat with vets anytime.

Always-available vet advice.

Subscription fee, health-centric.

User Personas

I researched the type of users my app will cater to. From my research, I created user personas. I gathered my research by looking at pet forum and online communities.

Name:

James

Age:

Location:

Austin, TX

Occupation:

Software Engineer

Areas of interest:

Technology, Outdoor Activities, Learning

Personality and Needs:

James is a first-time pet owner eager to learn how to care for his dog, Luna. He needs reliable, personalized advice, tools to monitor Luna's health and behavior, and quick answers to his questions to build confidence in his pet parenting skills.

Pain Points

James feels overwhelmed by conflicting advice online.

Name:

Susan

Age:

Location:

San Francisco, CA

Occupation:

Marketing Manager

Areas of interest:

Traveling, Fitness, Animal Welfare

Personality and Needs:

Susan is a busy professional who loves her three pets. She seeks a platform that provides personalized pet care advice, detailed care profiles, and easy sharing with pet sitters to ensure her pets are well-cared for, even when she's away.

Pain Points

Susan Struggles to find accurate, personalized advice for each pet.

Starting the design

Information Architecture

Low-fidelity wireframes

High-fidelity wireframes

Redefining the design

Users and user feedback

When I completed the high-fidelity wireframes, I shared them with an experienced pet owner to gather feedback through usability testing.

Name:

Abdul Rafay

Abdul Rafay is an experienced pet parent and has two dogs and a cat. He actively participates in pet forums and has extensive experience in pet care and training.

feedback:

Redefining the Look and Feel

Based on the feedback, it became clear that the overall look and feel of the app needed a significant overhaul. The current design was not engaging or vibrant enough, and the imagery and CTAs required improvement. To address these issues, I revisited and brainstormed new color schemes, fonts, and design elements.

Colors & Fonts

Regular

Petangue

DM Sans

Regular

Medium

Bold

UI Changes

After receiving the feedback from the user, i returned to the drawing board and brainstormed different ways to resolve the issues that the user pointed out.

Navigation

To make the app easier to navigate, the nav bar was updated to link to different pages. Additionally, the sign-in button was changed to a more prominent CTA(Create), that would persuade the user to interact fast.

hero section

The new hero section now has a real woman holding her pet, with AI elements in the background. I also added demo chat pop-ups between the woman and her dog to show how the app works. This new design is more engaging and informative.

Imagery

I replaced the visuals across the project with high-quality, realistic images showcasing real people and their pets. This change not only made the design more authentic but also created an emotional connection with the users, aligning better with the app's purpose of fostering bonds between pets and their owners.

Building the app

After the “Landing Page” and the “Chat with Pets” we went forward building the rest of the app. Here’s the birds eye view of the figma file:

App Features

Chat with Your Pet

Users can chat with their virtual pets about anything. The interface allows for easy switching between different pets, making conversations personalized and engaging. This feature helps strengthen the bond between pets and their owners.

PAWSY - Virtual assistant

PAWSY helps users create a virtual double of their real pet by asking questions about their pet. This feature ensures that the virtual pet mirrors the unique personality and characteristics of the actual pet, providing a more personalized and engaging experience.

User Profile settings

The User Profile Settings allow users to input and manage their personal information. These settings help tailor the app's recommendations and interactions to better suit the user's unique situation.

Pet Profile settings

The Pet Profile Settings enable users to create and manage detailed profiles for each of their pets. This ensures personalized care and easy management of each pet's needs.

See Full Demo

Conclusion

I enjoyed working on this project, as i am also a pet parent. The most challenging part of this project was to redo the look and feel of the Pet Portal Ai again after getting feedback from the users.