top of page


Adoptable Pets Website
Data Management I Coding I Website Design
Overview
A website that organize a animal control data and helps the users to search a adoptable pet effectively
My Role
Website Design (Sole)
This is an case study that was created in Information Design and Architecture class at Northwestern University. The concept is learn how information architecture works when we need to transforming a large data into a website. As a pet lover, I wanted to design a website for users who love pets and shelter organizations to track abandoned animals. Based on my research and collected data, I designed this website for users to search pets effectively to adopt.
The Challenges
Managing the large data, filtering information and analyzing the key information.
Toolkit
Illustrator
Adobe XD
After Effects
Code Pen
Time
Sumer , 2021. (3 Weeks)
Problem
Each year, approximately 1.5 million animals are abandoned (670,00 dogs and 860,000 cats). Due to Convid-19. It has increased pet adoptions. However, animal rescues are going to need more help than ever once COVID restrictions are lifted.
Solution
Turning this large animal control data into a website for animal lovers to search pets effectively. The goal is to increase more adoption rate, and find lovely homes for these abandoned pets that are in the shelters.





Design Process

-
Select a Topic
-
Research Data
-
Filter Data
-
Analyze Information
-
Site Map
-
Wireflow
-
Visual research
-
Design website
-
Coding
The Data
I focused on the content architecture. I started mapping the data information by main categories of how people usually search pets to adopt. During data filter process, I input the most important categories that can empathically connect to users the most. I kept the content for people that they care about the most to review and help them to make decisions effectively.
Raw data



Animal Control Data
Site Map
I focused on the content architecture. I started mapping the data information by main categories of how people usually search pets to adopt. The key feature of the homepage is for the search button. Users can type key works in the search box.

Wireflow
Website Sketches

Low Fidelity Wireflow




progressing. I am doing a interactive website. working on the animations...
bottom of page