Groovetop Project

Overview

Groovetop is a pet adoption app designed to bring transparency, clarity, and emotional support to those using the app to search for their next companion. The adoption process is often overwhelming, filled with challenging emotions, and inconsistent.

Groovetop’s goal is to simplify this journey by offering an app that provides transparent information, trustworthy shelter profiles, and a human-centered experience that helps users feel confident when finding a new friend. My task was to create a high-fidelity prototype using visual design and interaction elements to make the app’s pages functional.

Role

UX Designer

Interaction, Visual design, Prototyping

*Initial research, user pain points, and low-fidelity wireframes were provided in the course assignment.

March - April 2026

Background

Groovetop began as a school-assigned UX design project to improve the pet adoption experience. The assignment challenged me to find a plausible solution for a real-world problem that users experience.

I chose to focus on the emotional and logistical challenges adopters face, with the goal of creating a more transparent, empathetic, human-centered experience. Although this project took place in an academic setting, I still approached it with a designer’s mindset— using the research provided, identifying a problem, and designing a thoughtful solution.

Pet adoption is often filled with uncertainty. Some of the provided user pain points included:

  • Difficult finding adoptable pets that match specific criteria, such as breed, size, age, etc.

  • Inconsistent or incomplete pet information

  • Emotional overwhelm when making a high-stakes decision

  • Confusing adoption process

  • Concerns about the legitimacy and reputation of adoption platforms, leading to hesitation or uncertainty in many adopters

The Problem Statement:

Finding a pet to adopt can be overwhelming and time-consuming for many individuals. Many existing adoption apps lack a human-centered experience, are confusing to navigate, foster distrust among users, and fail to provide clear communication between shelters and adopters. This leaves many users feeling frustrated, overwhelmed, and unable to offer a loving home to a new friend.

Understanding the Problem

*Initial research, user pain points, and low-fidelity wireframes were provided in the course assignment.

Key Insights

Key Insights from the research include the following:

  • Trust is a large barrier.

    • Users are craving transparency about the health of the pets, their behavior, and shelter credibility.

  • Emotions and emotional behavior drive decisions.

    • Users want to feel calm and invited when searching for a new friend, desiring a sense of connection and reassurance in their decisions.

  • Inconsistent information.

    • Users want profiles to have the same layouts and contain the same information, as it will make it easier when searching for a pet.

  • People want guidance.

    • Users find comfort in having someone to talk with about their decisions, their options, and various ways to proceed.

  • Complex Navigation.

    • Users want a simple way to adopt a pet, without becoming frustrated or confused when navigating the app.

Wireframing the Solution

Based on the problem statement and the insights above, wireframes were generated and iterated for me to use as I worked toward a high-fidelity prototype:

*Initial research, user pain points, and low-fidelity wireframes were provided in the course assignment.

Visual Design

With the wireframes iterated and ready for use, I worked on the visual elements for each page.

  • Successes:

    • I significantly enjoyed this part of the project, and choosing the design elements for the app.

    • I chose a couple of different fonts to work with, and found two that really complemented each other: Inria Serif and Inter Sans Serif.

    • I believe the 60-30-10 rule for color worked very well throughout my designs.

  • Challenges:

    • Initially, I struggled to design for accessibility when making decisions regarding color. I had chosen a lighter pink for my accent color, and it was not until after I was almost finished with the project when I tested the color contrast with the tan. I had to pivot and choose a different color so that the words on the screen were accessible for all users.

  • I used Figma for my designs, and it took awhile to understand how the platform worked and what I could do to make my designs successful. Because of this, I had a slow start on the project, picking up speed toward the end.

These are the complete pages concerning the design elements:

Interaction Design

After the visual design was complete, I worked on the interaction elements of the app:

  • Successes:

    • I incorporated many different elements to make the high-fidelity prototype function as close to the final app as possible.

      • I included drop-down shadows on the buttons when clicked, different transitions between pages, various ways to get back to the home page, and much more.

    • I enjoyed being able to test the different interactions and change them until I reached the desired outcome.

  • Challenges:

    • I was initially challenged in trying to create familiarity for users when navigating the app.

      • One of the ways I was able to overcome this challenge was by keeping similar transitions when a user entered and exited the same page. This allows the user to become familiar with how the app works and predict how it would function when entering a different page.

This is the complete mapping of interactions between the designed pages. The flow starts on the homepage and goes from there:

Reflection

This project significantly strengthened my skills in building, designing, and interacting with a high-fidelity prototype. I learned that transparency and setting expectations foster trust, especially in an emotional setting such as pet adoption. Throughout this project, I realized how often digital products overlook the need for a human-centered experience, leaving empathy a critical oversight time after time.

If I continued this project, I would explore how to support adopters after the adoption, helping each owner navigate some of the ambiguity surrounding their new friend. Ultimately, this project reinforced my belief in the importance of empathetic, human-centered design, ensuring the best experience for all people involved in the process.

Next
Next

PeopleGrove Project