In 2021, I was contacted by a local barbershop to create an updated version of their existing website.
Step 1: Discovery & Brand Anchoring
Objective Definition:
The client needed a modern but approachable site that reflected the traditional values of barbershop culture while appealing to a broad range of locals—students, professionals, walk-ins, and loyal returning clients.
Audience Insight:
The target users are Texas locals looking for reliable grooming services in a shop that values skill, hospitality, and community. Emphasis was placed on walk-ins, loyal customers, and talent recruitment.
Design Intention:
We wanted the site to feel like the digital extension of a neighborhood barbershop window—clear, confident, minimal, but with charm.
Step 2: Structure and Page Planning
Core Layout Strategy:
Designed as a single, vertically scrolling layout to maintain simplicity and focus. Sections were chunked for clarity and flow:
Intro / Brand Statement
Our Services
Team by Location
Hiring / Call to Action
Footer & Contact Info
Navigation Simplified:
By placing all content on one page (with internal anchors), the site remains highly scannable—great for mobile users.
Step 3: Design & Visual Language
Color Palette:
Jet Black & Pure White: High contrast for a classic barbershop look. Black blocks showcase services confidently.
Cool Slate Blue Accents: Used sparingly for buttons and calls to action to evoke trust and masculinity.
Subtle Gray Illustrations: Scissor icons add personality without cluttering.
Typography:
Chose a serif heading font for elegance and nods to tradition.
Sans-serif body font for clean readability across all screen sizes.
Step 4: Section-by-Section Breakdown
Hero & Booking Callout
Features a central brand block framed like a barber shop sign with a vintage outline box, capturing a nostalgic aesthetic.
Immediate CTA: “Schedule Appointment” — accessible, front-loaded for user efficiency.
Our Services
Designed as modular black blocks with centered white text for maximum legibility.
Services broken into categories:
Walk-Ins & Appointments
Classic Cuts
Hot Towel Shaves
Beard Trims
Razor Fades
Youth Cuts
Full Service
Each has pricing clearly listed with call-to-action buttons.
Visual symmetry and spatial pacing make it easy to scan and digest.
Barbers by Location
Introduced with bold location headers (IH-35 and Plum Creek).
Two columns of team bios per location, each with:
Barber’s name
Short personal or professional intro
Specialty or favorite cut
“Now Hiring!” block at the bottom right uses an outlined pen icon to separate it visually, serving as a subtle call to action.
Talent Wanted Section
This section anchors the site's recruiting efforts. Positioned just before the footer.
Friendly tone: “Hays County Barbershop is currently looking for highly skilled, creative individuals…”
Flanked by crossed scissor icons, reinforcing brand and trade identity.
Footer
Clear, minimal footer containing:
Operating hours
Contact information
Locations
Email
Socials if needed
Step 5: Technical Implementation (Wix Studio)
Editor Features Used:
Wix Strip Sections for block layouts
Button linking to booking integrations
Anchored scrolling navigation for service and team quick access
Wix Repeater Elements for barber profiles, making it scalable for future staff
Performance Optimization:
Compressed images to minimize load time
Simplified layout ensured excellent mobile responsiveness
Minimal use of animation or third-party widgets to preserve speed and stability
Step 6: Post-Launch Impact & Suggestions
Future Enhancements Recommended:
Add Google Reviews widget
Implement photo gallery carousel of actual cuts
Introduce online booking integration for each barber