Footmaster: Architecting a Comprehensive Digital Ecosystem for the Football Community
Footmaster bridges the gap between football players, coaches, and businesses. As the Lead Product Designer, I created a mobile-first platform that prioritised seamless interaction and usability. The outcome: a cohesive digital ecosystem that transformed football networking.
London, United Kingdom
2017
Sports Technology
£120k (2018)
5 employees
Challenge
Lack of a unified platform for football professionals to connect.
Difficulty aligning user needs with stakeholder goals.
Absence of a scalable and user-friendly interface.
Results
The project successfully delivered a mobile-first platform that met user and business expectations, achieving high user satisfaction and engagement. Rigorous user testing confirmed the platform's efficiency in streamlining football-related activities, from booking pitches to organising games, ultimately fulfilling the client's ambitious goals and enhancing the overall user experience.
97%
Joining Event
95%
Pitch Booking Efficiency
4.5/5
Overall User Satisfaction
Process
Desk Research & Competitor Analysis
Analysed market leaders like Find A Player, Powerleague, and Footy Addicts to evaluate usability, functionality, and user experience. Reviewed customer feedback to uncover common pain points and unmet needs. Conducted structured user interviews to gain qualitative insights into frustrations and expectations, identifying key opportunities for innovation and differentiation.
User Personas
Developed three data-driven personas—Frequent Player, Occasional Player, and Inconsistent Player—based on user interviews, surveys, and behavioural analytics. These personas captured goals, behaviours, and pain points, guiding feature prioritisation and design decisions throughout the project.
Persona Development Process
Data Collection: Gathered insights through interviews, surveys, and analytics to understand user needs and challenges.
Theme Identification: Analysed patterns to segment users into three categories.
Persona Creation: Detailed each persona with demographics, goals, challenges, and opportunities.
Example Persona
Jeffrey Cole (Frequent Player): A 21-year-old university student in London passionate about football, playing regularly to improve skills.
Impact
These personas served as heuristic tools, ensuring the app design aligned with user expectations and created a user-centred experience.
User Journey Mapping and Opportunity Identification
Collaboratively mapped the user journey with stakeholders, identifying key touchpoints, bottlenecks, and opportunities for improvement. Combined research insights with workshop findings to create a detailed, user-centred journey map that guided feature prioritisation.
Phases of the User Journey
Research and Discovery: Users explore available options for casual football games.
Registration and Profile Creation: Users create profiles tailored to their football preferences.
Finding and Joining Games: Focused on streamlining search and matchmaking processes.
Preparing for Games: Includes logistics and communication.
Participating in Games: Ensures an enjoyable and frictionless experience.
Post-Game Reflection and Feedback: Encourages user engagement through reviews and insights.
Impact
The journey map provided a holistic view of the user experience, aligning app design with user motivations and pain points at each stage, ensuring an engaging and seamless experience.
User Flow
Mapped key interactions, such as joining games and sending messages, into clear, actionable steps to ensure intuitive navigation and task efficiency.
Key Points
Addressed user pain points by simplifying processes.
Provided developers with detailed flows for accurate implementation.
Iteratively tested and refined flows to optimise usability.
Impact
Created seamless, user-centred navigation paths that aligned with design goals and user needs.
Sketches
Rapidly sketched initial designs to explore and iterate on ideas, laying the groundwork for low-fidelity wireframes and refining concepts early.
Key Points
Enabled quick exploration of multiple design directions and adjustments based on feedback.
Simplified complex ideas to focus on structure and user flow.
Gathered early feedback from stakeholders and users to align designs with goals.
Provided a cost-effective, adaptable medium for refining layouts and interactions.
Impact
Set a solid foundation for wireframes by ensuring designs were flexible, user-centred, and well-considered.
Low-Fidelity Wireframes
Developed low-fidelity wireframes to visualise the app's structure and functionality, enabling rapid iteration and validation of core user journeys.
Key Points
Focused on layout and flow to define interactions without overloading with detail.
Iterated based on internal feedback to align with user needs and goals.
Presented wireframes to stakeholders for validation and gathered input for improvements.
Created an interactive prototype for testing, identifying and resolving usability issues.
Impact
Enabled rapid adjustments based on feedback, fostering a user-centred, efficient design process that laid the foundation for the final product.
Final Visual Design and Prototype
Created high-fidelity designs in Sketch aligned with user needs and business goals. Presented the solution to stakeholders with recommendations for future improvements, achieving client satisfaction.
User Testing Feedback Metrics
Conducted user testing to gather qualitative and quantitative insights, refining the app based on performance and user experience metrics.
Key Points
User Satisfaction: High scores showed the app’s intuitive design, with feedback highlighting strengths and areas for enhancement, such as additional booking filters.
Task Success Rates: Evaluated ease of completing key actions like pitch booking, with high rates confirming usability.
Error Rates: Identified pain points to prioritise and resolve critical usability issues.
Retention Tracking: Analysed long-term engagement, highlighting areas to improve user retention.
Performance Metrics: Assessed reliability, including load times and crash rates, ensuring robust app performance.
Accessibility Compliance: Achieved WCAG 2.1 AA compliance, ensuring inclusivity for users with disabilities.
Impact
Actionable insights from testing drove significant improvements, ensuring the app met user needs and delivered a high-quality, inclusive experience.
Handing Off Designs to the Development Team
Executed a meticulously planned handoff process to ensure seamless collaboration with developers and efficient implementation of designs.
Key Points
Annotated Design Files: Provided detailed specifications for all UI components, including fonts, colours, sizes, and spacing, minimising errors in implementation.
Proactive Workflow: Delivered assets two weeks ahead of the development schedule to prevent delays and maintain continuous progress.
Regular Collaboration: Held frequent meetings to clarify designs, gather feedback, and make real-time adjustments based on technical constraints.
Interactive Prototypes: Shared prototypes created in Sketch and InVision to demonstrate user interactions and screen transitions.
Impact
Streamlined communication and detailed resources ensured smooth development, timely milestones, and a high-quality, user-centred final product.
“ The workshops brought our team together, aligning our vision with our customers' needs and setting a focused direction for our future. ”
Patrick Lütke
CEO, Co-founder | Footmaster
Conclusion
The FootMaster project demonstrated the importance of a well-researched and user-focused design approach in achieving a successful digital product. By overcoming initial uncertainties and aligning the platform with both user needs and business objectives, the project not only met its goals but also set a strong foundation for future growth within the football community.