The goal of this app is to showcase my rabbit in all of her glory -- her daily habits, diet and sassy personality. I wanted Bella’s sassy personality to be communicated through the content and design of the website, so I was sure to keep this in mind in every step of the design process. Most existing personal websites are for humans, so I want Bella's personal website to be different and stand out. I also noticed that most existing pet-related websites were more fun and whimsical, where I wanted this one to really capture her dark, mysterious personality. This website will be connected to my personal website, so it’ll be used by anyone who is curious to learn more about me or about Bella.

Bella's website underwent student critiques as part of the Web Apps course at Brown University, which received positive and constructive feedback on the overall design of the website as well as functionality.

The features of this website reflect the things most important to Bella: her day-to-day life, her friends, her food and herself. The first thing users see on the page is a quick description of Bella with a large photo of her. I wanted to keep this quick and catchy so that users can quickly understand what the website is, but also begin to get the sarcasm and humor across in order to match her personality right from the start. This also allows users to quickly understand that this is a personal website for a Rabbit, and become interested and engaged in her humor right away.

The second section of the website reflects Bella’s day-to-day life. I decided to include Bella’s schedule as a graph to give off an illusion of organization and scheduling, which is comical since this is for a rabbit. I wanted to include the time she spends doing each activity, as well as the mental stimulation to further demonstrate her sarcastic personality. The graph changes on mobile view to intentionally show only the top activities of her day so that the text remains accessible to all users.

Bella’s friend Rex makes up the third section of the website. I wanted to give Bella more depth and show that despite her mystery and sarcasm, she does care about others. I also decided to make Rex’s picture black and white in order to keep with the dark design theme of the website and add a regal, sophisticated look to the photograph.

The next two sections make up Bella’s diet and her anatomy. Since food is so important to Bella, it was important to add it to her personal website. I decided to add humor to the visual display of the food items by adding them as stripped vectors with transparent backgrounds, instead of full images. This gives the feeling that the food is floating and on display. It also allows the food to pop out more due to the contrast on the black background. Similarly, the rabbit skeleton image adds an element of surprise to the end of the page that is both shocking and humorous, in line with the website design direction.

The top of the website is intentionally different from the rest of the site, as it introduces the concept to the user. As a result, the content here is split in half and aligned to that particular side. For the remainder of the website, the content is centered. The text is above the image/graphic content of that particular section so that users are prompted to read about the section before seeing the graphic content. On mobile view, all of the content is similarly so that the eye has a clear downward path to follow. In the section about Bella’s food, the items are placed vertically instead of horizontally, so that the eye continues this pattern.

• Inner sections will snap scroll to keep user engaged and maintain easy usability of the website
• Top of page (landing section) will fade in on load

Buttons have animations when user hovers, to engage the user and keep the cite feeling modern and sophisticated. I used this website for help formatting the buttons.