Comprehensive UX Design: A Year-Long Product and Web Development Journey
cPawd Pet Device
During my time in the UX Design Program at UC San Diego, I worked on a year-long project that spanned several semesters, guiding a product from concept to completion. The process began with in-depth user research to understand needs and challenges, which informed the initial design concepts. Over the following months, I developed wireframes and prototypes, testing them with users and refining the design through an iterative process.
I created a detailed use case to ensure the product met both user and business goals. In the final stages, I designed a comprehensive website to support the product, crafting an experience that seamlessly guided users from the homepage to the point of sale. This extended project gave me the opportunity to dive deeply into every stage of the UX process, blending research, design, and strategy into a cohesive and impactful solution.
My goal is to drive changes and insight in how we treat the animals in our care. Emerging medical devices for animals intrigue me. So, being a resident of Petaluma where the Egg Incubator was invented in 1858, I was inspired and developed a concept for a pet medical and behavioral device. I was in a UX Design program and constantly listening to many friends talk about the uncertainty they experience when their dog’s and cat’s behavior changes. They seemed frustrated not being able to tell what was going on. Timing seemed essential. They also seemed dependent on their vet to diagnose and burdened by high costs of vet bills. There was a need for a diagnostic tool at home.
cPawd: The Development Behind Its Innovation
I made the cartoon storyboard about Mr Peaches, a cat who snuggles next to the cPawd and follows sensor sound and light alerts around the house when the outdoor tracking device sends alerts to cPawd.
I started showing people my idea. More ideas and issues started to come up. I realized it would be helpful to have sensors on items like food bowls and litter boxes. The development of an app in addition to the actual cPawd device was a new idea generated from this phase.
cPawd observes and reports on your pet’s health and behavior, using sensors to infer how the pet feels and what it needs. It then communicates those findings to the guardian. What started as a tool to alert me to raccoons in the yard became an essential part of understanding my cat’s health. The device can also sync with other remote systems to respond to the pet in the guardian’s absence like remote toys or pet dispensers.
Issues about technology and how weight sensors would be programmed came up during this phase. It was time to start diving deeper into figuring out how this thing works.
cPawd Use Case
As I started this project I read about animal sentience. There’s a lot of information about the inner lives of cephalopods and crustaceans — studies on behavior and physiology, neuroanatomy. Everyone loved the movie Octopus Teacher. Well, I feel my cat has a lot to teach me. I feel it would be helpful to have a device to decipher my pet’s needs, feelings, joys, sorrows. I may be sounding very “crazy cat lady” but I’m fascinated by how my cat knows I’m not feeling well and will sleep closer to my head and comfort me with a furry paw on my arm through the night. So what is going on? How does he know and how can I reciprocate?
I feel I’m not alone in this inquiry and feel a device that observes, tracks, communicates, and responds to my pet’s needs would be useful to many. Attached is a Use Case that demonstrates how a cat would use this product and how I would apply a user centered approach to the design. Note: Originally was calling the product sPAD - user testing nixed that.
Select link below to read full Use Case.
cPawd Functionality
Developing the wireframes for this device helped expand the thinking behind it’s functionality. To a cat, Mr Peaches in this case, cPawd is a soft, warm spot in the home that also tracks animal activity and alerts him. For you, it’s a pet medical device that tracks daily amount of waste in his litter box, food, and water consumption. Helpful when Mr Peaches is feeling well or sick.
Collar Charm reads cat’s temperature, detects any fleas or parasites on the skin. Sends alerts.
Weight Sensors are placed on litter box, food, and water bowls. Establishing a baseline for times when the cat is ill. Sends alerts.
Litter Boxes, Pet Bowls are a possible product line extention. For example, the pPawd litter box would have embedded sensors rather than stick-ons.
All information is stored in cPawd and accessible on the app.
cPawd App
In the wireframe shown here, a cat’s guardian is able to monitor how much food and water their cat(s) are consuming each day. It also tracks weekly, monthly, and annual consumption. This feature is helpful for both healthy and unhealthy cats.
The “Eat?” feature is demonstrated in the wireframe below. It requires the use of sensors - called SensorBobs, which are provided in the purchase of the unit. Sensors are placed under the pet’s food and water bowls. They detect activity based on weight and report back to the app. It tracks when consumption is down and makes recommendations for articles to read about cat health. It also tracks if a cat is being overfed and suggests food amounts based on weight and age of cat.
The cPawd app is accessed on a computer, smartphone, tablet, and smartwatches.
Pawd Website
View prototype of the Pawd website
Part of my journey developing this device involved developing the brand identity and guidelines as well as a website design prototype. Using an iterative process, I created two rounds of . I tested the website with users, made edits based on that feedback, and created a report about that process.
The prototype can be viewed in the link above. What works in the prototype: How It Works carousel, Sensor Implants in the main navigation, and the purchase links associated with that. It was a class assignment, so I was required to design one aspect of the product through the purchase process.
Below are examples of those pages as well.
cPawd UX Testing and Report
The full UX testing process and results are seen below. But in summary, users found the product useful, and the visual explanations helpful. Paired groups of users were used. I find it helpful to observe users in pairs. Conversations are useful and issues are clear right away when they talk to each other as they navigate the site.
There was a general positive response. Two to three participants needed prompting and had questions. These questions led me to see issues where communication needed to be clarified. The homepage has a “How It Works” section and observing users read this led me to understand that it needed to be simplified and placed closer to the main header. A retest of this site will show me if that resolves some of the confusion. It’s important for people to understand the product - it moves them faster to the product pages and ultimately to purchase a product they need. Which is the goal of this site.
SUMMARY
The following evaluation objectives were addressed through a formative evaluation as users interact with the Pawd website prototype:
User satisfaction of the Pawd site is important. The experience of using the PAWD site needs to be both informative as well as enjoyable.
The Pawd site needs to educate pet owners about a new type of product and technology in a short period of time through images, illustrations, and copy.
Ease of navigation through the Pawd site is important, so the purchase process needs to be clear, easy to navigate to, and easy to use.
There are currently several ways to get to the product pages, we’re looking for the path that is used the most by users.
Are there common errors users make? How many users made the same error?
Animal Experience (AX) Metrics
Studying how animals respond to the device in a conventional UX environment is challenging. So, an initial study of the cat, in this case, is necessary. The survey below would be conducted through observation as well as input from the cat’s guardian and their response to these questions in Stats On A Cat.
Pawd Brand Book
I developed PAWD brand guidelines to help with the proper usage of logo, typography, colors, and additional brand assets. The intention of this document is to have a guide to help ensure brand consistency and to provide anyone who wishes to use this brand with a set of tools to do so.