Bee Nice Soaps | Branding Web Design and Development

Image showing the bee nice soaps website. I took care of branding, web design and development for the project.

R O L E S  &  R E S P O N S I B I L I T I E S

I was the sole designer for the Bee Nice Soaps web store (e-commerce platform).

Responsibilities:

I was responsible for the company branding, websit design and website development of the responsive website/webstore.

Branding: I worked with the businesses’ director to create their branding, which included colours, typography, logo designs to fit in with the business ethics, vision, and tone.

Website Design and build: Paper wireframes were sketched on paper, then mock-ups were designed and created using WordPress. I also edited and processed images that the client had taken of their different products. This was to prepare the images ready for the website build.

T H E  P R O B L E M

The director of the business hand-made their products at their home and were only selling a few products locally, to friends, family and through ‘word of mouth’, to people in the local area. What began as a hobby or side-hustle, quickly become a viable idea for a business because their hand-made, natural soaps seemed to be increasing in demand.

The business wanted to extend their reach to new customers, without the big cost of setting up a ‘brick and mortar’ shop in a high-street. Not only that, but the pandemic and it’s lock-downs were now in ‘full swing’, so scaling to a physical store at that time would of been a gamble and a big risk. 

T H E  S O L U T I O N

At the time of the first Covid-19 pandemic, the business concluded that selling their products over the internet made perfect sense.

The decision was made to start and scale the business by crafting their brand identity and begin designs for their own e-commerce store. It was at this point that they hired me to create their logo, choose their colour scheme and select the perfect typography for the business, then implement the fresh style and identity into the web store designs.

After creating the brand style guide and website mock-ups, I developed and built the store using WordPress content management system. The reason that I chose WordPress is because of its ease of use and convenience. The store can be viewed by logging on to beenicesoaps.com.

P A P E R  W I R E F R A M E S

I began by creating some User Journey Maps for some of the routes a visitor may take when navigating the website. These maps were ideas and insights that were provided by the business to me about their customers which included User Personas, problem statements and the different scenarios that customers may experience depending on where the user is on the customer journey.

I then moved onto paper wireframes, which contained multiple layout ideas for each page of the website. I find that sketching different layout ideas for each page and limiting the time allowed to sketch each idea is a highly effective way to get ideas from my mind onto paper. Using this method to ideate quickly returned some great layout ideas and results.

F I N A L  D E S I G N  &  D E V E L O P M E N T

Moving from paper wireframes made it easy to understand how the final design could help to address user pain points and improve the users shopping experience.

The image below shows the home page layout at different screen sizes, 

The image shows the bee nice soaps home page at different screen and device sizes.
Image 1.A

The image (1.A) shows the home page as it would display in three different screen sizes (mockup images from left to right): 

Apple iPhone 6 (375 x 667), Desktop (1920 x 1080), Apple iPad (1024 x 768).

Image showing the bee nice soaps home page at tablet screen size
Tablet Screen Size - Home Page.
Image showing the bee nice soaps home page.
Desktop Screen Size - Home Page.

K E Y  T A K E A W A Y S

What I Learned

I learned that when it comes to design ideation and finding solutions to user problems, it is a great idea to get help from as many different people with diverse backgrounds as possible. This produces some great solutions that an experienced designer might not have thought of.

Need a user-focused product service mobile app responsive website user interface design?