Cat adoption website

Hey! Here is my recent exploration design for a website of a local animal shelter where I volunteer.

Problem Statement & Research

To begin with, I analyzed the websites of charitable organizations, in particular about animals.  I also collected statistics on how people decide to take a pet from a shelter, and what are their main questions and difficulties. Most often, people are worried about the health and behavior of animals.

Moodboard

Before moving into the UI phase, the next focus was on creating a mood board to reflect the fun, friendly and modern approach that I envisioned for the website. This process allowed me to uncover key visual elements that would help me create it.

Wireframes

I did a few variants of wireframes for blocks. I wanted to reinforce in the wireframes the simplicity of use and reading. At the same time, I wanted to integrate trending components such as carousels, rounded cards, and bright buttons to give the website a modern look.

UI Kit

I used a shade of violet as the primary color and a pink accent to promote feelings of friendliness, liveliness, and freshness. I wanted to focus on the easy-to-use functionality. I chose Arsenal and CMU Sans Serif as fonts for the website. Arsenal is great for paragraphs to improve readability. And CMU Sans Serif is a grotesque sans serif typeface that is excellent for headlines. Together with the illustrations these elements create a playful and inviting visual identity.

Web Version

This website has a hero section with large typo and cute photos, all about kittens and their benefits, information for future owners and contact information.

Mobile Version

As I finalised the web version it was the time to make a mobile one. A big advantage was my experience from previous projects because it took me a short time to transform everything and make it responsive.