Four things to consider when designing a football club's website

In 2020, football clubs aren't just sport organizations - they're brands. And, with a growing emphasis on digital, many are transforming into media companies.

Content has been their most valuable asset, with FC Barcelona recently stating it became their ‘new core business’. As such, monetization opportunities have increased, spanning well beyond ticketing, sponsorship and TV rights.

Clubs are not static entities based on a simple business model anymore. This shift in their nature needs to be reflected in how we design their digital platforms. At the same time, users’ behavior evolves at the speed of light and club's need to adequately plan to stay ahead of the curve.

Choose a long-term strategic approach

Thanks to the enormous amount of usage data we have today at our disposal, it is relatively easy to define trends and track behaviors. What’s difficult is to look forward, forecast disruption and imagine how football fans will relate to clubs and consume their content five years from now.

“Researching future trends and anticipating behavioral shifts are two necessary practices for clubs to build durable, future-proof relationships with their audience. That’s the approach we take at Deltatre when redesigning digital experiences for our clients,” says our Creative Director, Robbie Davies.

Clients’ needs are the other key factor to build a long-lasting digital platform. According to our Design Project Lead, Giuseppe Viscogliosi, “As long as we always try to be user-centric, the club’s brand strategy is equally important in the conceptual phase of our design work. It is crucial to incorporate their vision in the inception of a digital ecosystem - it’s our job to help them define the right path to get them where they want to be”.

Define future-proof design trends and principles

Clients’ strategies may vary and we often act as the enabler of a vision that’s been conceived in-house. But often we’re asked to provide a broader view of the industry to validate thinking.

“We do research, look at various industries,” says Davies. “We make sure we know what's going on, anticipate which technologies will impact our work. Basically, it’s all down to four principles:

1. Do your homework
2. Share the knowledge 
3. Keep the passion
4. Trust your instinct

And instinct is not a random factor. You develop instinct by experience”.

Based on this framework, these are the trends and elements we identify today as those that will serve users’ needs in 2025.

1. Mobile-first 📱

The numbers don't lie - mobile is the device of choice when it comes to consuming content. Indeed, looking at aggregate data across our web, app and OTT platforms shows a 70/30 split in mobile versus desktop use in some cases. That’s why we start from the small screen when designing digital experiences. “But mobile-first doesn’t mean the layout on desktop will just be adapted,” adds Viscogliosi. “In the end we adopt an ‘all-breakpoint-first’ approach; we start from mobile and work on desktop in parallel”.

2. Focus on video ▶️

OTT is of course one of the most strategic monetization opportunities on a football club’s website. That’s why it is key to smoothly incorporate video content and make it easy for users to discover, navigate and watch. But that’s not the only way video can help engage audiences. “When we design a club’s website, we don’t look at the sports industry for inspiration. Big tech and entertainment companies make a great use of background videos” says Davies. “That’s a great way to add personality to a website. Plus, it makes it dynamic”.

Viscogliosi agrees. “Adding that cinematic effect on a black background hugely helps in keeping the users engaged and making design elements stand out”.

3. Animations 💨

Fluid interactions and transitions are another design trend that helps disrupt old school websites’ static nature. “That's something we often keep high on our priority list,” says Davies. “Animations are sometimes considered superfluous and tend to be deprioritized. But having those small moments of joy is important to the user experience”. If you want to go deeper on this topic, learn more about how we use animations in mobile sport apps.

4. Cards-UI 🃏

Familiarity with the user interface is a killer feature for fan engagement. Replicating on clubs’ websites UIs and behaviors that are commonly used on social media (e.g. Instagram, Facebook, Snapchat stories) helps immerse the user in the brand’s storytelling. Similar to the experience offered by our VISUAL STORIES product, “a card-based UI is a compelling way to increase engagement metrics, attract younger audiences and make them come back,” according to Viscogliosi.

Dive deep into football's specificities

At the end of the day, is the design approach for a football club that different from the one adopted for sports leagues and federations?

Yes, according to Davies. “It’s a completely different task. It needs to be true to the club’s brand. Every club has its own personality and history and it needs to be reflected in the way we design their platform”.

The business model and relationship with fans are also very different. This has an impact on the sections we decide to highlight during the early stages of the design process.

“Sometimes we go for a radical approach, fully focused on monetization,” says Viscogliosi. “For instance, a full-page background video with streamlined navigation to direct users towards purchase options. But that’s not something you can apply to all clubs; our work is to always help the client find the right balance between editorial content and monetization opportunities”.

Align stakeholders around a central vision

This essentially comes to one of the main challenges we face designing digital experiences for football clubs - harmonizing the needs of multiple stakeholders.

“When you sit at a table with people who have very different goals - from editorial teams to those responsible for e-commerce, ticketing, membership, OTT subscriptions - you need to be very good at listening everyone’s requirements. Then our job is to find the smoothest way to resolve such complexity in the UX and UI,” adds Viscogliosi.

Adding on top of that, different sections often require a diversified visual language. “If it’s imperative to be bold on editorial pages where you can easily break the grid and engage users with immersive interactions, other pages call for a more standardized approach. Governance and corporate sections, for instance, speak to a different audience, delivering a different type of content,” says Viscogliosi.

Finally, there may be an internal challenge. The cliché goes that design and development often have clashing needs, with the former favoring aesthetics and the latter focusing on function. That is simply not a viable option for the way we conceive design here at Deltatre. “Of course, it is sometimes hard to have everyone on the same page,” says Davies. “But when we explain the reasoning behind every design choice and start speaking the same language - that’s when the magic happens”.

We always love to hear from you. If you’re interested in finding out more about our design process and capabilities, get in touch with the team or join the conversation on Twitter or LinkedIn.