BHM Legion FC | Website Redesign

Case Study

Challenges

As a class assignment in my web design course, I chose to redesign the website of Birmingham Legion FC, the first soccer team in Birmingham, Alabama. I noticed a disconnect between their website and their other digital platforms, with their website not adequately representing the strong and prideful community they had built. My redesign aimed to address this issue while staying true to its branding identity. I also aimed to highlight their impressive content, including photography and videography, which was not given enough prominence on the existing site. Additionally, I focused on simplifying the cluttered page layouts and reducing the overuse of content. The goal was to create a site that effectively represents the brand to competitors, the team, and the community.

View Birmingham Legion FC’s Current Website below

Process Details

To start this project, I conducted research by visiting various FC websites across the nation and compared them to Birmingham Legion's site. I paid close attention to how well their landing pages engaged the viewers and guided them through the site. The key focus was on creating a landing page that effectively conveyed the brand, its identity, and the value they offer. Taking inspiration from multiple FC teams, I incorporated these concepts into my redesign, envisioning what I, as a soccer enthusiast, would want to see. After sketching ideas and creating wireframes to express my goals, I proceeded to develop 2D mockups using Adobe XD.

Solutions

For this project, the task was to redesign five pages of our choice, and I chose to focus on the navigation menu pages of the website, including Home, Tickets, Schedule, Store, and Club. My aim was to create a website that truly represents the team while decluttering the excessive content that overwhelmed each page, resulting in a simpler and more user-friendly site. A significant portion of my time was dedicated to designing the landing page in a way that captures the viewers' attention and provides a comprehensive overview of the entire website and its various sections.

View wireframes below