Responsive e-commerce web design and brand development for a Finnish chocolate company.
Figma, Webflow, Figma-to-Webflow Plugin, Adobe Illustrator, Photoshop
Research, Define, Design, Develop
From the beginning of this project, I decided that Finland culture would be the center of my research and the brand. From the missions statement to the packaging and website design, I sought to reflect the values of Finnish culture and lifestyle.
To celebrate Finnish culture through the locally sourced flavors in our handmade chocolate.
To become the leading experts on Finnish flavor, while promoting sustainability, excellence, community, and tradition. We seek to enrich lives and spread joy through chocolate.
Each flavor represents Finland. The lingonberries and bilberries can be found in local forests, and coffee is a cultural staple. I designed an illustration for each flavor to highlight its significance.
I started the website design process with wireframes to experiment with different layouts and determine an overall presence of the site.
To maintain brand consistency, I incorporated kraft paper backgrounds and natural colors into the website to represent the minimal and organic appeal. This e-commerce website enables chocolate connoisseurs worldwide to enjoy Suklaa Chocolatiera's handmade desserts. The about page gives customers a look into the history of Suklaa and Finnish culture. Blog articles with classic Finland recipes can be found on the inspiration page.
I practiced using the Figma to Webflow Plugin to develop this website. One challenge I encountered was setting up my Figma file correctly so class names would transfer over smoothly. I found myself renaming classes and correcting styles in Webflow after I transferred it over. Overall I appreciate the experience I gained in using this tool and look forward to the next time I can use it for fast development.
Before I integrated the e-commerce experience, I created a user flow for the checkout process. Being my first time developing a shopping experience, I benefitted from this user flow as it helped me determine each screen I would need to design and develop. I found that Webflow has made the e-commerce development process very simple. I was able to create and style the cart and checkout screen with ease.
As a web designer, I don't often have the opportunity to create the entirety of a brand. I enjoyed conceptualizing the inspiration for Suklaa Chocolatiera, as well as designing the illustrations for each flavor. Next time, I would have took more time to conduct visualize research specifically for the color palette. I tried to represent natural tones for the primary colors, allowing the flavor colors to pop, however I believe the brand relied too heavily on the products for color incorporation.
