Mobile webdesign for a soccer club.

UX-Research & UX-Design

Projekt details

The club 1. FC Frimmersdorf needed a redesign for their own website.

The site should be easy to understand for older generations, while young members should also quickly understand how you can participate in the club.

Goal

A user-friendly design that appeals to both club members and older generations to refresh the club’s image on the web.

Problem

Due to time & cost constraints, only 8 hours were available for the deployment of the mobile design.

For the same reasons, it was not possible to conduct a deeper analysis of the users through interviews or surveys.

Brainstorming - Acht Skizzen der Startseite in acht Minuten

Analysis and brainstorming

Potential User Groups

The following user groups were evaluated for the website in consultation with a club member and a player:

  • Players and club members
  • Fans of the club who like to attend matches
  • Parents who would like to register their children for a club
    Adults
  • Grandparents and ex-members
  • Young people from the region
  • Young people who have moved to the region

Ersichtliche Probleme

  • Consider users who have only recently started using your smartphone.
  • Consider newcomer youth and families who are potential members.
  • Minimize digital barriers.
  • Make site image friendlier to invite people who aren’t familiar with soccer

Evaluation of potential user groups was followed by brainstorming with Crazy Eights (Eight Ideas in Eight Minutes) for the association’s home page.

Handzeichnungen des Wireframes

Prototyping

Mobile first

The new club website is all about mobile use of the site.

Users should be able to quickly view match times and dates while on the move.

Opponents should also be able to take a look at their opponents before a match.

From paper prototype to finished mockup

In order to meet the given time window, a paper prototype was used.

After an initial rough design in Figma, the finalized prototype was created in Adobe XD.

Experience the prototype in action

Next Steps & Recap

Homepage des FC Frimmersdorf

Next steps

In the next steps, Johannes Zink Programmierung will take over the technical implementation of the project.

There are also plans to create additional prototypes for a responsive desktop and tablet-Version of the site.

Currently there is also an ongoing user testing phase for the mobile prototype of their responsive site.

This project may be updated in the future, once the site went through full development.

What I've learned

It is quite possible to create a prototype in just eight hours with some major drawbacks.

Important phases of the design process had to be shortened or eliminated.

With more time, the competition could have been analyzed. The user flows could have been planned in detail and user interviews and test phases could have taken place.

The prototype created in the process thus definitely still has open potential for improvement. For example missing animations and interaction details.