CSDM Web Redesign

A website redesign that bridges the gap between fans and the club by offering a modern, mobile-first experience. The new platform supports sponsor visibility, enables online sales, and centralizes club information in one place.

Project overview

The Challenge
CSDM needed a website that could reach more people, generate revenue through sponsors and online shop, and provide a user-friendly experience for fans.

The Solution
A complete redesign with a mobile-first approach, modern architecture, and a consistent design system, built to support sponsors, memberships, and updated club information.

My contributions

I led the full re-design process, including:

• Competitive analysis and benchmark.
• User research (150 survey responses + interviews).
• Information architecture and user flows.
• Wireframes and high-fidelity designs.
• Visual exploration + design system.
• Collaboration with marketing and press teams.
• Development handoff for Wordpress implementation.

‍

We conducted surveys, sharing it through social media, gathering 150 answers aproximately.

User testing, UI Kit, Benchmark, Mobile first, User research, Testing, Interviews, Layout, Information architecture

Roadmap

Understanding the problem
Benchmark + analysis of our inicial website
Information Architecture and layout
Visual explorations and Design System
Proposition + development

‍

‍

Research: understanding the problem

Users
- CSDM managers.
- CSDM supporters (w and wo memberships)

Users goal
Enhance and facilitate the experience between the fans and the Club. Design a user-friendly website.

Stakeholders goal
- Reach more people.
- Improve relationship with supporters.
- Generate revenue: sponsors + shop online.

‍

Brief visual: sticky notes, brainstorm, user research

‍

Competitive audit and benchmark

I was interested in:

Websites of similar Clubs (direct)
Websites of bigger Clubs (indirect)
Visual references: modern and minimalist
Architecture information analysis: header, footer and different sections

‍

‍

User research: surveys and interviews

I conducted surveys to learn users needs, whether the users were affiliates or not, and what they find interesting and useful in a website.

I wanted to gather information like:

Would you use the CSDM website?
Which device do you tend to use?
What features/sections interest you the most?
What news interest you the most?

‍

Data analysis and insights

After I gathered and clustered the data. I defined:

Users are most likely to visit the website in their mobile phone
Users want to see news from the Club and its construction projects
Users want information about the players
Users want the complete fixture, updated
Users want to see news from other activities too (not only football)

From my interviews and meetings with the client:

Management needs a sections with the sponsorships
Management wants clear information in how to become a member

‍

Survey results and insights clusterization

‍

Crazy Frankie

I organized the sections and website architecture, based in my insights, in paper.
I validated the structure with my client, using lo-fi digital wireframes.
I gathered relevant information needed from management.
I worked alongside with the marketing and press areas to define and design the news page (landing and section).

‍

Drawn wireframes and first lofi digital wireframes

‍

Userflow, High Fidelity y Design System

I refined and designed the userflow in hi-fi.
I defined the most important pages: Primera, Noticias y El club.
I designed and defined the stylesheet and a few components in a small Design System, to ensure consistency.

‍