UI / UX Design

BarkMate

BarkMate is a mobile-first pet care ecosystem that helps dog owners manage health records, routines, appointments, and community moments in one place.

Year :

2025

Industry :

Pet Care

Tools :

Figma

Project Duration :

6 Weeks

Overview :

BarkMate is a mobile-first pet care ecosystem designed to help dog owners manage every aspect of their pet's wellbeing through a single, emotionally engaging digital experience. The platform combines health management, task scheduling, appointment booking, analytics, and community interaction into one unified product experience. The goal was to eliminate the fragmented workflows pet owners experience when managing vaccinations, medications, appointments, daily routines, and social engagement.

Problem :

Pet owners today rely on a fragmented ecosystem of tools — separate apps for vet reminders, notebooks for vaccine records, social media for community, and phone calendars for grooming schedules. This fragmentation creates friction, leads to missed care moments, and offers no unified view of a pet's wellbeing.

Key Pain Points Identified

  • No single platform to track health, schedule, and social activity for pets

  • Vaccine and treatment records are often paper-based or scattered across clinics

  • Pet owners forget medication doses and routine care tasks

  • Difficulty finding and booking nearby vet appointments on-demand

  • No community space tailored specifically to pet owners

Solution :

BarkMate brings pet care tasks into one calm, structured experience. Health records, reminders, appointment discovery, and community features were organized around the daily habits of dog owners rather than around separate service categories.

The interface uses clear priorities, friendly status cues, and quick actions so owners can understand what needs attention now, what is upcoming, and where to go next without feeling overwhelmed.

Target Users:

The campaign targeted young adults, music fans, local culture audiences, and social-first event seekers who respond to expressive visuals and quick, shareable information.

The visual direction was designed to feel energetic and welcoming, making the festival approachable for first-time attendees while still appealing to returning audiences.

Key screens:


Design Decisions:

Dark UI as the primary theme — Most pet apps use light, pastel interfaces. BarkMate goes dark to stand out, reduce eye strain during nighttime pet care, and give the product a premium, modern feel that matches how seriously owners take their pets.

Green as the sole accent color — Green communicates health, vitality, and action without feeling clinical. It's used only for CTAs, status badges, and active states — keeping the UI clean and the hierarchy clear.

Tab-based health records instead of a scroll — Putting Vaccines, Weight, Treatment, and Meds into tabs rather than one long scroll means owners can go directly to what they need in two taps, even when time-pressed.

Status labels (Up to Date / Due Soon) — Instead of showing raw dates, records surface a human-readable health status so owners immediately know what needs attention without doing mental math.

AI Caretaker as a module, not a chatbot popup — The AI is positioned as a proactive care assistant embedded in the task and scheduling flow — not a floating chat button. This makes it feel native to the care routine rather than an add-on.

Multi-pet dog selector in tasks and appointments — Designed from the start to support multiple dogs, so the app scales with a user's life without requiring a redesign later.

Challenges:

Challenge 1 — Information density vs. simplicity
Health records contain a lot of data (dates, providers, statuses, next-due dates) across multiple categories. Fitting this cleanly on a mobile screen without it feeling like a medical form required careful use of tabs, typographic hierarchy, and strategic use of whitespace.

Challenge 2 — Making AI feel useful, not gimmicky
Adding an AI Caretaker without it feeling like a forced feature required integrating it directly into existing flows (task creation, care scheduling) rather than as a standalone chatbot — making the AI feel like a natural extension of the app's core utility.

Challenge 3 — Dark UI legibility
Dark interfaces are unforgiving with text contrast, especially for small body copy and data-heavy screens like the weight chart and vaccination history. Every text element required careful contrast ratio consideration to remain accessible.

Challenge 4 — Onboarding tone
The app needed to feel warm and approachable immediately. Using 3D illustrated characters with friendly copy (rather than feature-first slides) helped set the right emotional tone before the user even signed up.

Outcomes:

  • Designed 20+ screens covering the complete user journey from onboarding to daily care management

  • Created a scalable dark UI design system with reusable components across health, scheduling, and social modules

  • Integrated an AI Caretaker feature as a contextual care assistant embedded in the task and scheduling flows

  • Established a consistent visual language (dark navy + green accent + card layout) that works across data-heavy and social screens alike

  • Delivered a dev-ready prototype covering 6 complete feature modules

Learnings:

  • Health data and emotional warmth can coexist — the right visual tone makes clinical information feel human and approachable

  • Multi-pet complexity must be resolved in the information architecture phase, not retrofitted later

  • Dark UIs demand more design iterations than light UIs — contrast and legibility need to be verified at every screen, not assumed

  • AI features land better when they're embedded in the user's existing workflow rather than presented as a separate mode or tool

More Projects

UI / UX Design

BarkMate

BarkMate is a mobile-first pet care ecosystem that helps dog owners manage health records, routines, appointments, and community moments in one place.

Year :

2025

Industry :

Pet Care

Tools :

Figma

Project Duration :

6 Weeks

Overview :

BarkMate is a mobile-first pet care ecosystem designed to help dog owners manage every aspect of their pet's wellbeing through a single, emotionally engaging digital experience. The platform combines health management, task scheduling, appointment booking, analytics, and community interaction into one unified product experience. The goal was to eliminate the fragmented workflows pet owners experience when managing vaccinations, medications, appointments, daily routines, and social engagement.

Problem :

Pet owners today rely on a fragmented ecosystem of tools — separate apps for vet reminders, notebooks for vaccine records, social media for community, and phone calendars for grooming schedules. This fragmentation creates friction, leads to missed care moments, and offers no unified view of a pet's wellbeing.

Key Pain Points Identified

  • No single platform to track health, schedule, and social activity for pets

  • Vaccine and treatment records are often paper-based or scattered across clinics

  • Pet owners forget medication doses and routine care tasks

  • Difficulty finding and booking nearby vet appointments on-demand

  • No community space tailored specifically to pet owners

Solution :

BarkMate brings pet care tasks into one calm, structured experience. Health records, reminders, appointment discovery, and community features were organized around the daily habits of dog owners rather than around separate service categories.

The interface uses clear priorities, friendly status cues, and quick actions so owners can understand what needs attention now, what is upcoming, and where to go next without feeling overwhelmed.

Target Users:

The campaign targeted young adults, music fans, local culture audiences, and social-first event seekers who respond to expressive visuals and quick, shareable information.

The visual direction was designed to feel energetic and welcoming, making the festival approachable for first-time attendees while still appealing to returning audiences.

Key screens:


Design Decisions:

Dark UI as the primary theme — Most pet apps use light, pastel interfaces. BarkMate goes dark to stand out, reduce eye strain during nighttime pet care, and give the product a premium, modern feel that matches how seriously owners take their pets.

Green as the sole accent color — Green communicates health, vitality, and action without feeling clinical. It's used only for CTAs, status badges, and active states — keeping the UI clean and the hierarchy clear.

Tab-based health records instead of a scroll — Putting Vaccines, Weight, Treatment, and Meds into tabs rather than one long scroll means owners can go directly to what they need in two taps, even when time-pressed.

Status labels (Up to Date / Due Soon) — Instead of showing raw dates, records surface a human-readable health status so owners immediately know what needs attention without doing mental math.

AI Caretaker as a module, not a chatbot popup — The AI is positioned as a proactive care assistant embedded in the task and scheduling flow — not a floating chat button. This makes it feel native to the care routine rather than an add-on.

Multi-pet dog selector in tasks and appointments — Designed from the start to support multiple dogs, so the app scales with a user's life without requiring a redesign later.

Challenges:

Challenge 1 — Information density vs. simplicity
Health records contain a lot of data (dates, providers, statuses, next-due dates) across multiple categories. Fitting this cleanly on a mobile screen without it feeling like a medical form required careful use of tabs, typographic hierarchy, and strategic use of whitespace.

Challenge 2 — Making AI feel useful, not gimmicky
Adding an AI Caretaker without it feeling like a forced feature required integrating it directly into existing flows (task creation, care scheduling) rather than as a standalone chatbot — making the AI feel like a natural extension of the app's core utility.

Challenge 3 — Dark UI legibility
Dark interfaces are unforgiving with text contrast, especially for small body copy and data-heavy screens like the weight chart and vaccination history. Every text element required careful contrast ratio consideration to remain accessible.

Challenge 4 — Onboarding tone
The app needed to feel warm and approachable immediately. Using 3D illustrated characters with friendly copy (rather than feature-first slides) helped set the right emotional tone before the user even signed up.

Outcomes:

  • Designed 20+ screens covering the complete user journey from onboarding to daily care management

  • Created a scalable dark UI design system with reusable components across health, scheduling, and social modules

  • Integrated an AI Caretaker feature as a contextual care assistant embedded in the task and scheduling flows

  • Established a consistent visual language (dark navy + green accent + card layout) that works across data-heavy and social screens alike

  • Delivered a dev-ready prototype covering 6 complete feature modules

Learnings:

  • Health data and emotional warmth can coexist — the right visual tone makes clinical information feel human and approachable

  • Multi-pet complexity must be resolved in the information architecture phase, not retrofitted later

  • Dark UIs demand more design iterations than light UIs — contrast and legibility need to be verified at every screen, not assumed

  • AI features land better when they're embedded in the user's existing workflow rather than presented as a separate mode or tool

More Projects

UI / UX Design

BarkMate

BarkMate is a mobile-first pet care ecosystem that helps dog owners manage health records, routines, appointments, and community moments in one place.

Year :

2025

Industry :

Pet Care

Tools :

Figma

Project Duration :

6 Weeks

Overview :

BarkMate is a mobile-first pet care ecosystem designed to help dog owners manage every aspect of their pet's wellbeing through a single, emotionally engaging digital experience. The platform combines health management, task scheduling, appointment booking, analytics, and community interaction into one unified product experience. The goal was to eliminate the fragmented workflows pet owners experience when managing vaccinations, medications, appointments, daily routines, and social engagement.

Problem :

Pet owners today rely on a fragmented ecosystem of tools — separate apps for vet reminders, notebooks for vaccine records, social media for community, and phone calendars for grooming schedules. This fragmentation creates friction, leads to missed care moments, and offers no unified view of a pet's wellbeing.

Key Pain Points Identified

  • No single platform to track health, schedule, and social activity for pets

  • Vaccine and treatment records are often paper-based or scattered across clinics

  • Pet owners forget medication doses and routine care tasks

  • Difficulty finding and booking nearby vet appointments on-demand

  • No community space tailored specifically to pet owners

Solution :

BarkMate brings pet care tasks into one calm, structured experience. Health records, reminders, appointment discovery, and community features were organized around the daily habits of dog owners rather than around separate service categories.

The interface uses clear priorities, friendly status cues, and quick actions so owners can understand what needs attention now, what is upcoming, and where to go next without feeling overwhelmed.

Target Users:

The campaign targeted young adults, music fans, local culture audiences, and social-first event seekers who respond to expressive visuals and quick, shareable information.

The visual direction was designed to feel energetic and welcoming, making the festival approachable for first-time attendees while still appealing to returning audiences.

Key screens:


Design Decisions:

Dark UI as the primary theme — Most pet apps use light, pastel interfaces. BarkMate goes dark to stand out, reduce eye strain during nighttime pet care, and give the product a premium, modern feel that matches how seriously owners take their pets.

Green as the sole accent color — Green communicates health, vitality, and action without feeling clinical. It's used only for CTAs, status badges, and active states — keeping the UI clean and the hierarchy clear.

Tab-based health records instead of a scroll — Putting Vaccines, Weight, Treatment, and Meds into tabs rather than one long scroll means owners can go directly to what they need in two taps, even when time-pressed.

Status labels (Up to Date / Due Soon) — Instead of showing raw dates, records surface a human-readable health status so owners immediately know what needs attention without doing mental math.

AI Caretaker as a module, not a chatbot popup — The AI is positioned as a proactive care assistant embedded in the task and scheduling flow — not a floating chat button. This makes it feel native to the care routine rather than an add-on.

Multi-pet dog selector in tasks and appointments — Designed from the start to support multiple dogs, so the app scales with a user's life without requiring a redesign later.

Challenges:

Challenge 1 — Information density vs. simplicity
Health records contain a lot of data (dates, providers, statuses, next-due dates) across multiple categories. Fitting this cleanly on a mobile screen without it feeling like a medical form required careful use of tabs, typographic hierarchy, and strategic use of whitespace.

Challenge 2 — Making AI feel useful, not gimmicky
Adding an AI Caretaker without it feeling like a forced feature required integrating it directly into existing flows (task creation, care scheduling) rather than as a standalone chatbot — making the AI feel like a natural extension of the app's core utility.

Challenge 3 — Dark UI legibility
Dark interfaces are unforgiving with text contrast, especially for small body copy and data-heavy screens like the weight chart and vaccination history. Every text element required careful contrast ratio consideration to remain accessible.

Challenge 4 — Onboarding tone
The app needed to feel warm and approachable immediately. Using 3D illustrated characters with friendly copy (rather than feature-first slides) helped set the right emotional tone before the user even signed up.

Outcomes:

  • Designed 20+ screens covering the complete user journey from onboarding to daily care management

  • Created a scalable dark UI design system with reusable components across health, scheduling, and social modules

  • Integrated an AI Caretaker feature as a contextual care assistant embedded in the task and scheduling flows

  • Established a consistent visual language (dark navy + green accent + card layout) that works across data-heavy and social screens alike

  • Delivered a dev-ready prototype covering 6 complete feature modules

Learnings:

  • Health data and emotional warmth can coexist — the right visual tone makes clinical information feel human and approachable

  • Multi-pet complexity must be resolved in the information architecture phase, not retrofitted later

  • Dark UIs demand more design iterations than light UIs — contrast and legibility need to be verified at every screen, not assumed

  • AI features land better when they're embedded in the user's existing workflow rather than presented as a separate mode or tool

More Projects

Create a free website with Framer, the website builder loved by startups, designers and agencies.