SKAGGS Blog

Established in 1949, The Madelaine Chocolate Company is dedicated to perfecting a superior taste and quality in their chocolate. The belief that everyone should be able to afford great tasting chocolate is what drives their commitment to their customers, ensuring they never compromise on flavor or quality.

We had the honor of completely recreating and redesigning The Madelaine Chocolate Company website. Due to the huge range of products the Madelaine Chocolate Company produces this was no simple task; however it was a task we were excited to take on. From the initial mockup and wireframes to the final design, we've created a compelling website that appeals to both consumers and retailers and that enhances their brand.

Features of the new Madelaine Chocolate Company website are numerous and some even involve very cutting edge web design technology to make a visit to the website solid, smooth and quick.

Store location search
The Madelaine Chocolate Company distributes their chocolate to stores across the United States. We made it easy to enter a zip-code and locate the nearest retailer within a specified radius of miles. We even included a visual map with markers which provides more detailed information when you click the marker.

Product Search
The Madelaine Chocolate Company has an enormous range of confectionary, including more than 2,000 individual products. We painstakingly sorted and coded each product by keyword, title, SKU and description so the entire product database is now fully searchable. Also, we wanted to add in a method to quickly preview all products that match their search term in real time. This allows a visitor to quickly search out a specific product, whether they know exactly what product they are looking for or not.

Product List
The Product List is easily the largest and most important section of the new website. Beginning with a simple Excel spreadsheet, we created an entire online database which lists all products in their new Product Catalog (also designed by SKAGGS!) The products are split into 9 categories and are listed by "seasonal occasions".

After successfully importing the Excel spreadsheet of products into our online database we quickly discovered a few issues. A category such as 'Everyday' easily has 100+ products listed. Each product has an image and can be clicked to view more detailed information. We wanted to employ the "zero-click" methodology to prevent a user having to click on 'page 1, page 2' and so on. Loading 100+ images on one page, however, can be very time-consuming and would take quite a toll on the hosting server. Our solution was to implement a feature called "Lazy Load". This means when you are viewing a list of products, all products not visible on your browser do not load. The beauty of Lazy Load is that as you scroll down the page, the images load as needed as they appear on your monitor. This was a win/win situation for everyone involved!

Custom Blog and Trade Bulletin
The Madelaine Chocolate Company needed a way to reach out to and connect with consumers as well as to retailers. A blog is the most intuitive way to do this.

Designing the Site
The initial website design mockups went through a few rounds and we finally honed in on a design that was flexible to develop around and correctly establish The Madelaine Chocolate Company brand and identity on the internet. With a subtle "Madelaine Purple" monochromatic color scheme the website is very pleasant on the eyes.

Visiting the Website
On first visiting the site, you are presented with a soft slideshow of images which attract your attention but don't distract you from the rest of the content. The sidebar lists off recent Trade Bulletins, latest blog post and a quick search box to find the nearest retail store. You'll also notice a hand-selected choice of products in a scrolling box below the slideshow.

It doesn't take long to realize that you can click through the website to not only see their products, but also learn about the company heritage, how to follow them on twitter and facebook, visit them on Flickr, learn all about the history of chocolate as well as see which Trade Shows The Madelaine Chocolate Company will be attending in the near future.