Barcelona Bay Area – Diego Velazquez

UX WEB / CLUB EXPERIENCE

Barcelona Bay Area

A clearer path into the program.

A redesign of the club’s web presence focused on helping families understand programs, find the right fit faster, and take action with confidence across devices.

PRODUCT SNAPSHOT

Role

Design Lead (UX + Visual)
Led decisions across IA, navigation, and responsive UI.

Audience

Families, players, coaches
New prospects and current members.

Scope

Club web experience
Homepage, program pathways, key pages, and supporting visuals.

Platform

Web + mobile
Designed for desktop and phone.

OVERVIEW

One front door for many programs.

Youth clubs grow fast. Programs span ages and levels, and the site becomes the first place families go to decide whether the club is the right fit. This redesign focused on clarity, trust, and a structured program journey so the experience scales with growth.

THE CHALLENGE

Reduce confusion in a high-intent journey.

Families arrive with questions and limited time. The challenge was to organize multiple program offerings into a clear, scannable experience, reduce decision friction, and maintain predictable navigation across desktop and mobile.

USERS

Built for fast scanning.

Different audiences, same need: find the right program and next step quickly.

Prospective families
Evaluate program fit and enrollment steps.

Players
Understand pathways, teams, and development options.

Coaches
Communicate consistently and keep information current.

APPROACH

Structure first. Then scale the system.

I treated the site like a product journey: clarify the pathways, define the structure, then design a repeatable responsive system.

Discovery

Identified the club’s primary offerings and the questions families ask most when evaluating programs, age groups, and pathways.

Define

Translated offerings into clear navigation, program grouping, and page structure so users can move from “what is this club” to “where do I fit” without searching.

Design

Designed the responsive UI for desktop and mobile, refining hierarchy and interaction patterns to keep the experience calm, consistent, and action-oriented.

KEY DECISIONS

The decisions that shaped the experience.

Three choices improved clarity, confidence, and usability across the club journey.

Program-first information architecture

Organized content around how families actually decide: age group, level, and next step.

Less emphasis on secondary content in exchange for faster access to top tasks.

Homepage as an orientation layer

Used the homepage to quickly communicate the club’s value, credibility, and program entry points.

Reduced visual variety in exchange for clearer hierarchy and faster comprehension.

Repeatable page patterns

Established consistent templates for program pages and key resources so the experience stays predictable as offerings evolve.

Fewer unique layouts in exchange for maintainability and consistency over time.

REFLECTION

Clarity is what makes growth sustainable.

This project reinforced a simple principle: when offerings multiply, structure becomes the product. Clear navigation and predictable page layouts reduce cognitive load and help families make confident decisions.