Enabling digital growth
for J'Bez Barbershop
Role
Team
Timeline
2018 - 2022
J'Bez is more than just a barbershop
Founded in 2018 near the University of California, Riverside (UCR), J'Bez Barbershop started like any other shop in the area. While being near a university implied the potential for higher foot traffic, J'Bez had already had plenty of nearby competition with established credibility amongst the university students and locals. J’Bez’s founders were a recent UCR business grad and a long-time barber with over a decade of experience. What set them apart from the other barbershop owners was their eagerness to grow their business and take advantage of the technologies that the others weren't. Additionally, they didn’t want to just own a barbershop. They wanted to build a strong community and family as well.
In their search for a way to attract attention within the community, J’Bez reached out to my team to guide the business to the next level with digital strategies and a new SEO-optimized website.
Setting the groundwork
Phase 1: 2019
Through designing a new website, implementing strong SEO tactics, and enabling online reservations, we took J’Bez from having minimal brand awareness and no clear customer acquisition approach to being the clear-cut choice for students and locals. J'Bez became profitable and eventually managed to move from its spot near UCR to a prime location on the UCR campus.
J’Bez’s first website from 2019
Taking it to the next level
Phase 2: January 2022 - April 2022
Three years later, J'Bez secured a coveted location at UCR that would bring them even more customers thanks to their amazing growth. The original website had carried them through the first phase of their roadmap, but now they had a new location, a full team of barbers, a line of great hairstyling products, and a loyal customer base. The founders wanted to take this opportunity to revamp the website that had an e-commerce storefront and a custom hairstyle recommendation engine.
The challenges
Managing attention between online sales & scheduling
Incorporating online appointment scheduling as the main focus of the first website was very successful for J'Bez. However, now J’bez wanted to introduce an online store. This raised a challenge in determining how J'Bez could maintain focus on appointment scheduling, its main revenue driver, while still bringing attention to their new products and increasing their revenue through online sales.
Differentiating J'Bez from other barbershops
It's easy for people to see all barbershops as the same. In fact, looking at other barbershops online gives off that vibe. However, a big differentiator between J'Bez and other shops is their big focus on community, education, and family and we needed to determine how to incorporate this aspect throughout the website.
The goals
Instill J'Bez's community aspect throughout the website
More than designing the best-looking and easiest-to-navigate barbershop website, it was important for us to help customers understand the vibe inside the shop and feel connected to the barbers and brand before they even stepped foot into the shop. Incorporating different types of storytelling content beyond just haircut photos like videos and photography of the shop would help achieve this goal.
Drive increased sales revenue
We aimed for J’Bez to see increased revenue through the addition of a new online store, and later, a personalized haircut discovery tool to drive product sales and appointment bookings.
Designing the information architecture
The full site map consists of multiple parts. The main website and Find Your Perfect Cut. In this phase, we focused on the main website. It consists of the storefront, links to schedule an appointment, pages to share the story of each J'Bez barber, and the J'Bez story.
Gathering inspiration in a mood board
J'Bez wanted to appear young and innovative throughout its website. I gathered visual inspiration from sources that shared elements with J'Bez's modern and community-oriented brand. This included mockups of other barbershop sites, photography of hairstyling products, iconography representing hair product features, haircut photography, e-commerce layouts, and shots of UI elements from non-industry sources.
Creating a style guide that exudes the brand
The founders of J'Bez worked with me to determine that they want their company to appear young and innovative, rebellious, and premium — basically the opposite of their competition. The typography and the color palette were intentionally chosen to represent these defining attributes. The combination of Roc Grotesk and Aktiv Grotesk along with the dark blues and bright pink, blue, and white brings out a vibe that's youthful and boundary-breaking, yet premium and sophisticated. The typography was set using a 1.333 - Perfect Fourth type scale.
Bundling the business, brand, and community into one intriguing web experience
The J'Bez website was designed to be memorable and stand out from other barbershop websites. Right away, visitors are brought into the shop environment through the hero video. The use of content, color, and messaging is intended to help website visitors understand the brand's personality and get them interested in scheduling a haircut appointment.
Helping people find their perfect cut
Phase 3: July - October 2022
Find Your Perfect Cut (FYPC) is the personalized haircut recommendation tool that educates customers on the best styles for them based on different attributes.
FYPC is driven by a logic-based, 7-question survey that asks about different personal preferences and then provides 3 recommended hairstyles based on those preferences. Each hairstyle has its own SEO-optimized blog post that contains details about the style, videos of J'Bez barbers providing that style for a client, and photos of the end results you can get from the J'Bez barbers. The blog posts link to J'Bez's online appointment scheduling tool.
Expanding value beyond physical haircuts
FYPC's recommendation tool and blog-driven content are intended to expand J'Bez's reach beyond just their physical store and e-commerce products. The SEO-optimized blog posts will generate organic reach through industry-specific keywords that aren't fully taken advantage of by other brands. The microsite will launch soon and if successful, will kick off J'Bez's brand expansion beyond Riverside to the entire US.
The next steps
J'Bez's master plan is to open up new locations on college campuses throughout California before expanding throughout the US with a franchise model. Their second location is set to open at the beginning of 2023, 4 years after the company started. Our plan for the 4th phase of the web experience is to expand the site architecture to account for location-specific pages that highlight the location's store, barbers, and events.
What I learned
Explain the process and decisions, don't just show the results
Barbers are really chill and friendly. My relationship with the barbershop founders has been no different. However, I found myself blurring the lines between Client and Friend throughout this project. For example, when presenting the moodboard and wireframes to them, I took shortcuts and didn't fully explain my decision-making. This resulted in them not fully understanding what I was showing them and made me realize I needed to improve how I present my work to communicate the impacts and decisions made.
Don't bite off more than you can chew
I had taken on another major branding/website redesign project while working on this project. That other project was time-sensitive for a fast-growing startup and ended up taking priority over this J'Bez one. It became difficult to complete this project at the planned date. Since the J’Bez project was not time-sensitive, the J'Bez founders were okay with the project being completed later. However, this is something I want to avoid moving forward.
Overcommunicate in a remote working environment
One of my responsibilities was to determine the style and direction of the photo and video content on the website. The photographer worked directly for J'Bez and I had never worked with him before. I was working remotely and initially communicated with him primarily through Slack, but I realized that this made the conversation largely one-sided and that certain details were being missed in the photos, resulting in him having to reshoot or re-edit the photos. I found that providing more detailed guidelines in a call and then sending notes of the call as a recap in Slack worked well in ensuring the details in the photos were there.