New website for MFF Support

---

Background

MFF Support the official supporter association for Malmö Football club, had long been in need of a new website. When they announced on social media that they were looking for a web designer, I immediately felt this was an opportunity I couldn’t miss. Working with MFF has always been a dream of mine, and working with MFF Support (a non-profit organization) felt like the perfect way to get closer to that brand. I therefore dedicated many voluntary hours outside of work to design, experiment, and find the best technical solution for them.

Why?

The old platform was outdated, cluttered with old content, and increasingly difficult to maintain. Members and visitors struggled to find relevant information, and the site was not optimized for mobile devices – something that is essential in today’s digital landscape.
 

My Role

I took full responsibility for the project — from research and design to technical implementation. My role included:

• Discovery & Research: Understanding MFF Support’s needs, budget constraints, and technical environment.
• UX & UI Design: Creating wireframes and high-fidelity prototypes in Figma.
• Technical Evaluation: Testing hosting solutions and CMS setups.
• Implementation: Building the website in WordPress using Gutenberg blocks.
• Collaboration: Aligning with MFF Support’s team on design decisions, presenting options with pros and cons.

Challenges

• The old site was cluttered and outdated.
• Limited technical resources and time.
• A large amount of irrelevant content that had to be sorted and removed.
• Finding a sustainable technical solution that balances user-centered design with easy editorial updates.

UX Perspective

This project did not include extensive new research such as interviews, surveys, or formal user testing. Instead, I worked closely with my colleague at MFF Support, who had valuable insights into the needs of their members. These needs could be summarized into a few but important functions:

• Reading news updates
• Providing information about membership and linking to “Become a member”
• Displaying upcoming away trips and linking to booking information
• Showcasing photographers and linking to the image gallery

From there, I relied on established best practices in UI and UX design: 

• keeping the layout simple,
• interactions clear, 
• and user flows straightforward.
• I also sought informal feedback by discussing design drafts with MFF supporters in my family and friend circle. This gave me additional input and helped validate that the design felt intuitive, accessible, and aligned with supporter expectations.

Objectives

• Reduce hosting costs where possible.
• Create a modern design that reflects MFF Support’s identity.
• Build a site that works seamlessly across desktop and mobile.
• Simplify the process of updates and maintenance for the organization.
• Clean up years of outdated news, pages, and media.

Process

1. I began by rethinking the site structure from the ground up. Outdated and irrelevant content was deleted, leaving a clean foundation to build on. 
2. I then designed a minimalistic, user-friendly interface with a strong focus on clarity, accessibility, and mobile optimization. Much of the design work was done in Figma, where I iterated frequently and checked in regularly with my contact at MFF Support. 
3. Whenever decisions had to be made, I presented different options along with the pros and cons of each, helping the team make informed choices.
4. I tested two web-building solutions and decided to keep WordPress while recommending a smaller hosting plan. Since MFF Support is a volunteer-run non-profit funded mainly through away trips, keeping costs low was essential.
5. I built the new website in WordPress using Gutenberg web blocks. From a technical perspective, I ensured the site was lightweight, fast, and easy to update — reducing both the time and effort required to keep information current.
6. We presented a demo of the website and its content to the board, inviting feedback and suggestions for additional material.
7. For the launch, we planned a coordinated post across all social media platforms — X, Instagram, and Facebook — to announce the new website to their followers. The post included a short summary about our work this spring and summer, as well as an email address where followers could report feedback or any bugs they might encounter.
8. After the launch, I submitted the new sitemap in Google Search Console to help index the updated site structure. I also identified and removed outdated URLs that were still appearing in Google’s search results.
9. When handing the project back to the MFF Support volunteer team, I recorded a series of instructional videos demonstrating the easiest way to update and edit existing pages and posts in WordPress, without the need to publish new content unless necessary.
    

Results

The new MFF Support website is:

• Modern & Responsive: Clean design that works seamlessly on mobile and desktop.
• Cost-Effective: Hosting costs reduced by choosing a leaner plan.
• Easy to Manage: WordPress setup optimized for quick and simple content updates.
• Fresh Start: Old clutter removed, making space for new, relevant content.