Bestselling body cream made with sea buckthorn and 🐝 honey

Background

Bee By The Sea Natural Products was founded in 2008 by Andrew Wingrove with the chance discovery of the sea buckthorn berry while travelling abroad. After extensive research and development, Bee launched a cream unlike anything else on the market. Fast forward 12 years and they are still producing that same bestselling body cream. They've expanded their offerings to include a whole assortment of healthy products. Best of all, everything is produced and packaged in Ontario.

Project

Bee needed a new website. Well actually, they needed two-in-one. Their business has two major segments: end consumers, and wholesale users. To better serve both segments, Bee was looking for a way to have their website look and feel different based on what user was logged in. Or to put it another way, they needed a way for their wholesale customers to have a different experience from end consumers.

This meant I needed to build two websites disguised as one! The goal was to give Bee the flexibility of using one platform to better serve their customers and also make their own lives a tad easier.

Reducing the number of clicks required

Bee stressed the importance of reducing the number of clicks it takes for a viewer to get to where they want to go. To do this, we focused on the navigation. When on a computer, the viewer can mouse over any of the dropdowns along the top to be greeted with a very unique drop down effect. On mobile, I implemented the ability to view the dropdown information with the use of tabs. See the video and picture below to see this in action.

Before the new website, users were required to click first into the shop, then into a collection, and then finally they could scroll and try to find the product they had in mind. This new navigation puts all of their best sellers upfront and easily accessible.

Grid-style promotional blocks

The ability to promote specific products on a website is a huge key to the success for any ecommerce business. I decided to create two types of promotional blocks that Bee can place anywhere on their site. The first is a single, full page promotion, the second is a 3 card block promoting 3 different options. Check this out in action below.

Full page search

If the user cannot find what they are looking for using the extensive drop down navigation, they can use the site wide search option instead. This search menu is a full page option, as can be seen in the video below.

Rewards

Bee wanted to include the rewards program information in a manner that was easier to digest. To do so, I fixed a button to the bottom left of every page which opens up a rewards panel with customizable information. Viewers can now easily see how many reward points they have, along with how to earn more.

Contact options

Bee recently opened a physical store, and as such, needed a way for viewers to easily get directions to this new location. I implemented an option for viewers to click the map that will automatically open Google Maps. This map is actually just a picture for quicker load times, but the user cannot tell as hovering over the picture initiates a fancy hover effect and indicates to click to go to Google Maps.

I also made the contact information stick on the left side of the screen to always remain in view. This small effect adds to the overall polish of the design and greatly improves user experience.

Ecommerce solution

Creating a minimal store, packed full of features

When browsing products, a viewer is greeted with a traditional grid of options. From here, the viewer can mouse over any of the links and quickly view the product.

A bold product page.

When viewing a single product page, the viewer is greeted with a very unique design. Typically, the product images are along the left or the right, however, I decided to go a different route. I put the photo front and center, and then pinned the ability to add the product to cart to the top right corner of the screen.

Final comments

More features

This project is packed full of features and I barely even touched the surface. If you like what you see and you want us to help with your next website let us know and we can discuss even more of the features we built into this project

Increased revenue

This site was launched back in 2019-2020, yet the design still feels relevant and some might say timeless. The site helped boost sales by nearly 25% annually. As the business grew the original owner has since sold the business, and the new owner has made the decision that the business is ready for another refresh. We wish them the best and we hope their new website lasts as long as this one did!