Bark Bistro

Platforms:

Web

Demographic:

25-30

Project Goal:

A quiz to help dog owners choose the correct dog food

The Process

This is a group project create in our intro to web class. We created a recommendation engine called “Bark Bistro” to recommend what kind of dog food your dog should eat based on their personal qualities. We wanted to keep it fun and easy to navigate for busy people who just don’t know what to pick out at the store and need help to find what would be best for their dog. I mainly focused on the layout of the website and the interactions while my partner worked on the mobile version. Collectively we each took half of the photos. After figuring out our demographic and personas, we started working on the layout of the pages. We created a flow chart like the ones shown to map out exactly how we wanted the pages to flow based on the answers given.

Wireframes

Wireframes for the web and mobile versions were the next step. I was in charge of creating a layout for the web, and made sure to show how a page would be laid out and how a button would react when hovered or clicked.

Style Tile

The style we came up with correlated with the types of personas we came up with; young, energetic, fun-loving, personalities who care about their dogs. We went for a bright look with soft colors to be more inviting and friendly.

Final

The final version of the website differed from the initial style tile. There wasn't any illustrations for the buttons but that is a possible option to add interest for a future remake. The image style was very bright and inviting. Colors were reduced to a minimum to not take away the attention from the content.