arrow--button-leftarrow--buttonarrow--downarrow--external-buttonarrow--leftarrow--rightarrow--upcaution--circlecheck--circlecheckclosecross--circleamerican-expressapplediscovermastercardpaypal--simplepaypalstripevisaenvelopeeye--closedeye--openheartlocation-pinfast-forwardmutepauseplayrewindstopvolumesearchfacebookglobegoogle-plusinstagramlinkedinmediumpinteresttwitteryoutubesoundoffsoundon

An experience to address misconceptions and drive sales for this hemp food pioneer.

Manitoba Harvest is literally the pioneer and global leader in branded, hemp-based foods. In the mid 90s, the founders researched and then successfully lobbied the Canadian Government to change legislation to legalize production of industrial hemp as an edible food product. Since 1998, they have never looked back. The Manitoba Harvest name is virtually synonymous with the hemp food industry. They dominate the category in Canada and US and are available in over 7,000 retail locations.

Project

Marketing & E-commerce

Categories

Strategy, IA, UX, Design, Development

Year

2016

Platform

WordPress

Image of something.
Image of something.

Reimagining Their Digital Experience

The Manitoba Harvest online experience, no matter the device type, stifled the brand. The digital experience had to be reimagined and road-mapped. All of it.

Image of something.

There was a significant strategic component to our work which was expedited through a number carefully constructed collaborative sprint workshops. These included role definition, project phasing, sharing data on current state, understanding internal pain points, goal / KPI setting, crafting personas, use cases, exploring navigation options, reviewing inspiration, and sketching key wireframes.

From there we provided sales analysis, budget scenarios and business cases for a variety of potential e-commerce solutions. Our UX and UI designers worked collaboratively with the in house design team and content team.

The new responsive Manitoba Harvest site was built on an innovative combination of WordPress and Magento, which allowed for unprecedented customizability, updating and ease of use that was second to none. One that gets the best of both respective platforms – content management system (CMS) and e-commerce.

We worked with the internal IT team, customer service and 3rd party vendors Ebridge Connections, Avalara Avatax and CyberSource to integrate into their ERP system and to automate some of the more tedious internal jobs like tax calculation, order import and export, and shipping notifications. All abiding to PCI DSS Level 1 compliance and Sarbanes – Oxley recommendations.

Image of something.

The Outcome

The result is a lightning fast digital experience no matter the task or the device. The brand has a stage where it can thrive – big, bright, bold and beautiful. More than cosmetics, the experience caters to a growing number of consumers and helps them understand hemp, easily discover products and explore ways to integrate hemp into their household diet.

Image of something.

Should they want to buy online, the ecommerce experience is seamlessly intertwined with the marketing experience and is invisible to the consumer – seamlessly integrated with Manitoba Harvest internal operations.

Progressive Image Loading

Lazy loading takes high fidelity images and serves them up initially as blurry low-quality images based on the user’s connection speed. Once the baseline content is loaded and the site is useable, it goes about the job of upping fidelity of images, starting with the visible ones first, until they hit their highest resolution.

The result? A blazing fast site even in those pesky image heavy recipe centers.

One-page Checkout

We combined all of the following elements into one page:

  • 3 step checkout, including shipping and tax calculations
  • Running total displayed and updated as you select options to make users aware of the total price they were going to pay
  • Guest and signed in checkout.

Why did we do that? Simple… FOCUS. We want to keep the user focused on executing the task at hand and let them do it as fast as possible.

Product Selector

Converting online is about many things but mainly it’s about instilling a sense of confidence in the user. Users want to be sure that the size they pick is the size they want. So, we helped.

We designed a product detail page that updated all of the relevant product information in real time. Not sure what size to get? We’ve got you covered. On top of displaying the size measurement, we displayed an icon of the packaging, changed the image to match the size and changed the nutritional information too.

The result? A buying experience that feels so much like your local grocer that you may find yourself wondering where the bread aisle is.