E-commerce UX/UI Design

Position:

Designer and Content Management

Responsibilities:

UX/UI Design, Branding, UX Writing, User Research, Content Management, Graphic Design,

Project Summary:

I was contacted by a local bee store to redesign their e-commerce website. I took over the project and did a complete redesign for the company. In redesigning their website I also established a new organization system for their products, making the shopping experience more streamlined and user-friendly. I also highlighted products, defined the mission of the company, and provided a more intuitive way to showcase their blog and best selling products.

Below is an image of the original website landing page and shopping experience.

The original site was outdated and not user-friendly. It often confused customers and many of the categories led to error messages. My goal for the redesign was to create an e-commerce space that was simple to navigate and not bogged down by any unnecessary or distracting components.

In developing personas for the site I wanted to incorporate seasoned beekeepers, brand new hobbyists, and bee enthusiasts. The company offers a wide range of products, and I was dedicated to creating an online space that welcomed anyone interested in bees. In addition, I wanted a site that was easy to navigate and would not confuse users that were less tech-savvy, while also creating a modern site that experienced internet users could appreciate the visual appeal of.

After reviewing the personas and taking into account their goals and frustrations, I had a solid direction in which to begin my prototyping.  I created a landing page that provided an easy dropdown menu for all of the product categories, and a call to action to ‘Shop Here’ immediately below.  A brief scroll downwards leads to visuals of potential search options for easy access, followed by a mission statement, list of best sellers, and at the bottom are most recent blog posts.  In addition, the footer with the additional info is easily accessible and does not require a significant amount of scrolling to reach.  My user research found that many people were frustrated when reaching the footer required excessive scrolling, as many of them were interested in additional information that was not immediately available, such as contact information, about us, and the retailers.

Since I am not a bee expert, it was a fun challenge to organize the products in a way that was user-friendly. I did a lot of user research with experienced beekeepers that were very helpful in assisting me in the best way to organize products.  After my user tests had been run, I was able to create completed mockups to share with my client.

The new layout was significantly different from the original site, and my client was very happy with the look of the new site layout.

My client also requested that I design a popup to greet customers upon arriving at the site to sign up for the newsletter, as the store frequently has sales and is trying to build out their newsletter and social media following.  Bees are probably the most fun theme to run with, as they are filled with ‘sweet’ and ‘buzz-worthy’ puns.  I tried to keep my puns to a minimum, but I did enjoy the opportunity to create some silliness.

Below is a closer visual of the original website store landing page.

And here is a closer look at my redesign of the landing page.