Responsive Website - The Good Wolf Barbershop

Web Designer

UX Designer

UI Designer

Figma

Overview:

Revamping a responsive website for a local barbershop to boost its online presence, engage customers, and enhance the overall user experience.

Problem

Although very minimal and straight to the point. The Good Wolf’s online storefront required significant revisions specifically in the site's visual design, usability, accessibility, and engagement. Enhancing these aspects can create a better user experience, align with business goals, and boost the company’s success.

Solution

Modernize Visual Appeal: Transform the website's look into a contemporary and polished style.

Prioritize User-Friendly Design: Develop a website that focuses on user-friendliness and simplicity.

Streamline Social Media Integration: Establish a seamless connection between the website and the company's social media platforms.

Enhance User Experience: Improve website intuitiveness and usability for an enhanced overall user experience.

Refine: the appointment booking process for a more sophisticated and user-friendly experience.

Sketches

I began by sketching a low-fidelity wireframe to better outline my vision for the first three landing pages in addition to defining the site's structural layout.

The Vision:

When putting together a component list and mood board for The Good Wolf, I wanted to maintain the original aesthetic while also advancing it. My vision along with the stakeholders was to achieve a balance between minimalistic, sleek, quiet luxury, while also infusing a friendly, welcoming atmosphere exuding quality and professionalism. I carefully selected fonts, colors, and images to create an immersive experience for both new and returning users visiting The Good Wolf's website.

High-Fidelity Prototype

UI Design | Desktop Pages

Landing Page

A simple yet straightforward landing page. This includes important information such as shop ours, shop address, contact info, social media integration and a short summary about the shop's location and team.

Account Creation

Includes a pop up window encouraging visitors to create an account or login to an existing one. This is especially helpful for consumers who appreciate loyalty accounts for perks and purchase history.

About Page

A page that showcases the team and gives site visitors a feel for how this shop operates and who these professionals are. This also includes testimonials and sample photos of previous works.

Services Page

This page showcases what services are offered by the shop with prices and descriptions included.

Booking Details

Service selection, calendar availability, appointment time and additional comments for scheduled visit.

Merchandise Page

Merchandise page for shop merch of various kinds. From beanies, to hoodies, and grooming tools etc...

Check Out Page

Standard check out page with form fields that include, contact information, account information, and a order summary with an itemized list of previous selections.

Results:

A modern, sleek, engaging website that is both user-centric and easy to use. It was a delightful experience working on the creation of a responsive website for a local barbershop, despite the shop being established for a while, its online presence lacked impact. This project was a tremendous learning opportunity.