top of page

Project Overview

About the project

Petmart is a pet food delivery responsive website which help pet owners to order and purchase food online for their pets. The main goal of the website is to use on any platform or device.

The Problem

In this busy world, many of the pet owners are acquiring a website that can successfully and easily deliver pet food to their homes.

The Solution

Designing a responsive website for pet food delivery. The goal is to deliver the food  supplies to their homes with quick and easy accessible.

My Role and Responsibilities

User Research, Wireframing, Designing Mockups, Prototyping

Project Duration

5 weeks

Design Process

I chose design thinking process for this project. Design thinking is a non-linear, iterative process that makes us to understand the users, define their problems and come up with solutions to prototype and test.

Empathize

Define

Ideate

Prototype

Test

User Research 

I conducted interviews and created empathy maps to understand the users. A primary user group identified through research was working adults who don’t have time get the food for their pet dogs. The secondary group one to two pets that require bulk food and doesn't own a vehicle and would prefer repeating orders monthly.

Pain points

Lack of time to go and purchase from the store.

Doesn't own a vehicle and prefer online shopping.

Want to order bulk food and get delivered securely.

User Persona

"I deeply care about animals and want to give the best for them"
Name : Shreya
Age: 25 years
Location : Hyderabad
Occupation : HR Manager
Shreya is a busy professional working as a HR manager in Hyderabad. She has two lovely dogs Rio and Leo. She prefers to shop food online and order bulk food at a time with easy and safe delivery.

Ideation

Digital Wireframes

Homepage

Categories Page

Individual Product Page

Low fidelity prototype

Mockups

Responsive Website Mockups

Mobile screens

High- fidelity prototype

Accessibility Considerations

  • Color Contrast has been considered and made it accessible for all users. I have used the WCAG tool to check the color contrast for buttons, backgrounds and icons.

  • I have considered the accessibility for Text Sizes, Font Type and Focus Indicators on all the screens.

  • I have made sure that users can navigate through the app and can perform actions even using a screen reader.

Key takeaways and lessons

Well, this is the first case study project where I fulfilled the roles of researcher, UI designer and writer. I have learned so many lessons.​

  • With this being my first time as a UX researcher, I got to practice first hand with interviewing, probing questions and note-taking. 

  • Designing for accessibility at the starting of the design process benefits all the users and results in a cleaner design.

  • I have also learnt that usability tests have influenced and affected each iteration of the design and also developed many insights.

Thank you for watching

bottom of page