Overview
Magnolia is a company that sells handcrafted chocolate made using traditional bean to bar methods. Founded by two sisters, their philosophy is about delivering a high quality product while promoting fair trade and sustainable practices. By purchasing from Magnolia, customers help support fair trade while enjoying delicious, handcrafted chocolate.
Magnolia was designed as my final project at Sheridan College. After completion, I was recognized as Semifinalist in the Web and Application category for the Adobe Design Achievement Awards.
The Challenge
The main challenge was to find a way to differentiate Magnolia while highlighting the fair trade story of the brand.
Details
Research and Insights
A marketing plan was done to address the challenges and opportunities.
The primary goals were:
- Focus on artisan, high quality chocolate
- Have the ability to customize a chocolate box to create a unique, one-of-a-kind experience
- Incorporate fair trade into the website by including a section on the fair trade story and how it impacts farmers (e.g. farmer profiles)
- Educate the customer about what makes the bean-to-bar chocolate making method unique
Information Architecture
A site map was created to document the navigation, pages and hierarchy of the site.
Wireframing
I then completed low-fi wireframes to get a sense of the flow of the content for each page of the site.
The Solution
Before tackling the high fidelity mockups, I created a mood board based on aesthetics, images, colours and patterns found online. This helped establish the look and feel of Magnolia including the typography, logo and branding.
Mood Board
Mockups
I then created high fidelity mockups inspired by the mood board exercise. The colours reflect the Magnolia brand as well as the luxurious quality of the chocolate.
Learnings and takeaways
Designing Magnolia was the most challenging yet rewarding part of my experience at Sheridan College. I appreciated how all encompassing it was because it prepared me well for all types of projects going forward, both professional and educational. It also felt extra rewarding to build the site and see my designs come to life.