Zoodermic Case Study- Designing an e-Commerce website for Pets.

Atasie Esther
7 min readApr 15, 2020

There are lots of eCommerce platforms out there offering different products or the same products just like, Jumia, Shopify, Amazon, eBay. After looking at these platforms, I resolved I was going to design an eCommerce platform for buying and selling of pets and pet accessories. (Especially Dogs and cats).

Zoodermic is a web based eCommerce platform that brings together, pet owners, pet lovers, pet buyers, within Nigeria for the sole purpose of buying and selling, knowledge sharing, etc.

My role: I was able to come up with deliverables such as, user journey, user stories, information architecture, wireframes and visual design for the product.

Tools used:

Pen

Paper

Figma

Project Overview:

Understanding the problem: It all began with a friend of mine whose dog just delivered of about 9puppies. He needed to sell them, he didn’t really know much people and so didn’t understand how to go about it. He told he needed people to buy his puppies, sadly i don’t have lots of friends, especially ones who loved pets. In my words “I thought there were platforms where you could sell your pets”. He said he couldn’t find one specifically for pets and pet accessories. But i later figured, there were, he just didn’t know. But then, the idea to design a platform for buying and selling of pets and pets accessories was already ringing in my head. I understood clearly now that my task was to design a web platform that pet lovers, Owners, buyers and vets could use to buy and sell their products. Although, it’s majorly for pets, i figured pet owners want to buy accessories for their pets too. That is the problem i tried solving.

Research Process:

Competitive Analysis: After doing a research on other e-Commerce platforms out there like, jumia, i understood better, how to wrap around the idea.

Understanding what is and what isn’t needed, thereby analyzing efficiently, the user’s pain points from a much better angle.

Personas: To guide my decision making process, I created personas for several users with different needs for the platform. This helped me develop a mental picture or representation of main user segments.

User Stories:

Based on my discovery and understanding from research and competitor analysis, I was able to scribble down the following user stories.

As a user, I want to be able to create an account and log in to my account.

As a user, I want to be able to buy and sell pets and pet accessories.

As a user, I want to be able to read, and write blog posts about pets and its likes.

As a user, i should be able to share an article to my social media.

As a user, I want to be able to make searches by category.

As a user, I want to delete one or more products from my cart

As a user, I should be able to search for a particular product with ease

As a user, I want to add multiple products to my cart so I can have access to multiple retail locations if required.

As a user, I want to be able to view details about a product so I can have a better understanding of it.

As a user, I want to be able to see previously purchased products for future reference.

As a user, I want to easily access my cart.

As a user, I want to easily get the retail location of a particular product upon checkout so I can easily get there.

As a user, I want to be able to view the summary of products in my cart so I can know the total price.

As a user, I want to able to view and edit my profile.

As a user, I want to be able to post ads of pets and accessories up for sale.

As a user, I want to be able to make blog posts and pet related articles.

User Flow/Journey

I also created a user flow to map out the sequence of steps a user has to take to achieve a specific task. The user flow described the steps that users take to access a function or perform a task. Each click, swipe and drag-hold is part of the user flow. This helped in organizing content so that users would easily adjust to the functionality of the product and could find everything they need without big effort.

Design process

Wireframes: After researching and stating my ideas clearly, I figured I had to kick off with the design process. I started by making Low fidelity wireframe sketches with pen and paper. These helped with design iterations as they were easy to create and discard if it doesn’t work.

Final Design

After writing my personas, User journey , and making lo-fi wireframes; I did the visual design for the project. I’ll share a few screens here, explaining what each is for.

We have the sign up and sign in pages for new and existing users. To start posting pets and other pet accessories for sale, users are required to have an account on zoodermic.

Sign up page
Sign in

Here, we have the home page that showcases the whole product idea and other details. The home page consists of the landing page, which is the first screen the user/visitor gets to see on arrival. It also shows the services zoodermic platform renders. You get to also see some featured pets curated by the admins. The blog section and footer.

Home page

Then there’s a product (pets) listing page that shows all pets that are up for sale. The same goes for the pet accessories page, it depends on the category you place your search (Pets or other accessories).

Product(pet )listing page

The cart session shows you all the products you want to purchase. You can delete products easily from your cart and then proceed to checkout.

Cart page

The checkout page lets you enter your card details to enable you pay for the products stored in your cart.

Uhm, the contact us page is basically for users to be able to send their reviews and comments about what they think of zoodermic platform, any possible questions they might have about their pets, and so on. Of which the replies would be directly emailed to them.

Blog session lets you read articles from others relating to your pet and all of that. You get to post a blog once you create an account.

This is just another article section that pops up when one clicks on an article.

Empty Cart component comes intoplay when no item has been added to cart.

After payment, an email with details of the retail location is sent to the user. He can either chose to continue on the website or check his email.

Edit profile page

My profile.

Conclusion

The goal of the Website is to enable users buy and sell pets and pet accessories among themselves, read and write blog posts to share their knowledge and information about pets and its likes. So, this serves as a solution for someone who could (like my friend) be looking for a means to conveniently to get to his potential buyers to sell his product and vice versa. Although some screens are yet to be designed, i’lld want to believe that the few you’ve seen explains enough about this idea. Of course there would be future changes.

And finally…

This is actually my first attempt at writing a case study, i’d appreciate your honest reviews, feedbacks and questions. I would be glad to reply. Thanks for reading.

--

--