All Handmade Barberia

Role
UI Design
Type
Website & Brand Identity
Result
Increased online bookings

Overview

All Handmade Barberia is a barber shop in Bogota with a strong physical presence, but no digital identity to match. I was brought in to develop their online brand and design a website that could grow with the business.

The problem

A physical brand in need of a digital counterpart

All Handmade is a barber shop in Bogota with a plan to expand beyond haircuts, into clothing and education. The website needed to cover four main objectives: promoting the barber shop, facilitating the booking process, showcasing the products they have for sale, and establishing a digital presence strong enough to support a growing brand.

Although they had a strong, distinctive presence in their physical store, there was no digital brand to match. The challenge was to develop their identity, laying the foundation for a future clothing brand and a barber academy for training new talent.

My approach

Client brief to final build

I approached this project with 6 main stages. First I met with the client to understand their needs and ambitions, before researching competitor barber websites to identify potential opportunities. From there I moved into wireframing, mapping out structure and user flows before any visual decisions were made. Once the UX foundations were in place, I developed the brand identity and UI, before working directly alongside the developer during the build to ensure the finished website matched the designs precisely.

01

Client discovery

Understanding their needs and brand vision

02

Competitor research

Researching other barber websites to identify opportunities

03

Wireframing

Mapping out structure and layout before any visual decision

04

Brand development

Exploring visual direction and style for the digital identity

05

UI design

Creating the final high-fidelity deigns

06

Dev collaboration

Providing design assistance and feedback through the build

Brand identity

Designing a digital identity rooted in the physical space

All Handmade had a strong, distinctive aesthetic in their physical store, but no digital equivalent. Rather than starting from scratch, I looked to what already existed and asked how it could be translated onto screen.

The store’s black and white checked and grid patterns became a central reference point, informing the graphic language of the site. Their logo also provided a source of inspiration, with lines breaking beyond their boundaries — details that spoke to an edgy, boundary-pushing attitude.

That spirit carried through into the UI details: subtle animations and staggered images give the page a sense of movement, and button underlines that extend beyond their boundaries are a direct nod to the logo and the brand’s character.

Design & Development

Seeing it through to the build

Once the designs were finalised, my involvement didn’t stop there. I used my knowledge of front-end development to work directly alongside the developer throughout the build — maintaining an ongoing dialogue to ensure the implementation stayed true to the design, and conducting design reviews at key stages to catch and resolve any deviations.

This close collaboration between design and development is something I consider essential to delivering a finished product that genuinely reflects the original vision.

The outcome

A digital identity and increased online bookings

The finished website gave All Handmade an online presence that better reflected the quality of the in-store experience, resulting in something the owner was genuinely excited about to share with customers.

While exact figures weren’t available, the owner reported a noticeable increase in bookings following the launch, with the integrated booking management system making it easier for customers to book appointments and reducing the admin burden on the team.

Visit the website

Client feedback

The client was very impressed with both the design and the finished website — a result that matched the quality and character that they offer in store.