Online stores

Online pet supplies store

Client: Brands4pets

A gallery of pet brands that combines a product catalog, curated collections for owners and an offer of a free personal consultation

Visit the website
VueNuxt 3.0DjangoPython
Online pet supplies store

Project at a glance

Problem

Brands4pets came to us with the idea of an online store designed as a gallery of brand boutiques for pets. The task was to present the brands and their products while keeping the focus on expert advice and personal service for owners.

What we did
  • Brand gallery and sections by type of pet
  • Product collections for puppies and kittens
  • Catalog with filters and sorting
  • Product cards with prices, availability and reviews
What the client wanted
  • Present a gallery of branded pet products
  • Help owners choose products that fit their pet’s needs
  • Offer shoppers a personal consultation

Want the same for your business? Tell us about your task — we’ll propose a solution and estimate the timeline.

A brand gallery with personal help

We built and launched the Brands4pets online store. The home page presents brands, product categories and sections by type of pet. Dedicated collections help owners of puppies and kittens get everything they need for their first days at home.

Next to the gallery introduction, we placed a personal assistant block with a contact button. The site tells visitors about the free consultation and the option to ask a brand representative questions.

The home page introduces the brand gallery and invites visitors to contact a personal assistant
The home page introduces the brand gallery and invites visitors to contact a personal assistant

A catalog for each pet’s needs

The catalog filters products by pet type and age, brand, availability and price. Food has extra filters: type, flavor, weight and product line. Selected filters appear above the list — they can be removed one by one or cleared all at once.

The list cards show photos, SKUs, prices and availability. Products with reviews show their rating and number of reviews. Shoppers can compare the options and add a product to the cart right from the catalog.

Sidebar filters narrow the choice, and the cards show price and availability before the product goes into the cart
Sidebar filters narrow the choice, and the cards show price and availability before the product goes into the cart

Home page and catalog on a phone

We prepared mobile versions of the home page and the catalog. On the home page, a photo of a pet and its owner became the backdrop for the message to shoppers; below it begins the offer of free help from a consultant.

In the mobile catalog, products are arranged in two columns. Filters open with a separate button, and the selected options stay above the products. The bottom navigation bar gives access to the main sections of the site.

The mobile home page presents the gallery’s approach to pet care and the offer of a free assistant
The mobile home page presents the gallery’s approach to pet care and the offer of a free assistant
The mobile catalog keeps photos, prices and buy buttons, with filters available above the list
The mobile catalog keeps photos, prices and buy buttons, with filters available above the list
Technical details

Technical details

The site is built with Vue, Nuxt 3.0, Django and Python.

Target audience

  • Pet owners
  • Owners of puppies and kittens who need products for the first days at home

What users need

Job to be done — from situation to outcome

Situation

I’m getting ready for a new puppy or kitten and need to get everything for the first days at home

Need

I want to be ready to care for my pet and be able to get advice when choosing products

Outcome

I can rely on ready-made collections for the first days with a pet and ask for a personal recommendation

What’s inside

1

Brand gallery and sections by type of pet

2

Product collections for puppies and kittens

3

Catalog with filters and sorting

4

Product cards with prices, availability and reviews

5

Free consultation offer and contact buttons

6

Mobile versions of the home page and catalog

7

Cart that links to the catalog when it is empty

Need a similar project?

Tell us about your task — we’ll estimate the scope, timeline and cost and propose a solution.