GamePlanr
A progressive web app (PWA) that streamlines recreational sports team management, empowering team captains with effortless team creation, efficient game scheduling, and seamless communication for an enhanced sports experience
Product Experience
Introduction
Approximately 1 in 5 people in the US actively participate in adult recreational team sports, driven primarily by 'personal enjoyment and fun' (59%) and closely followed by 'health and fitness' (54%) according to Civic Science.
Problem
Despite the popularity of recreational teams, persistent communication and coordination issues hamper the gaming experience.
Picture this: You're eagerly gearing up for a recreational sports match, excited to engage in the activity you love. However, as game time approaches, you discover that some of your teammates won't be able to make it. If only they had informed you earlier, right?
To address this, we delved into conventional approaches to finding substitutes, revealing inefficiencies and disruptions.
Research Insights
Process
Surveying 22 individuals and conducting 4 in-depth interviews with recent recreational sports players seeking substitutes, our affinity mapping revealed key themes:
Social Ties Prevail in Recreational Sports:
- 78% join teams through friends
Word of Mouth and Chat are Primary Communication Channels:
- 96% use word of mouth, text, and messaging services such as Whatsapp and Messenger for game coordination
Player Management Challenges:
- 61% reported that teams struggle with uncertainties in player availability and unresponsiveness
- 82% required substitutes due to last-minute scheduling conflicts
- 72% noted adverse effects on team dynamics from difficulties in managing the team roster, citing physical exhaustion, decreased competitiveness, and even forfeits due to insufficient player turnout
Our Users
After uncovering two key personas - the team captain and the team player.
We focused our MVP on addressing the team captain's pain points:
- Communication Struggles: Difficulties disseminating crucial information swiftly to team members, especially when faced with the challenge of quickly assembling enough players for upcoming games
- Game Coordination Difficulty: Lack of centralized system for tracking team players complicates the efficient management and monitoring of player attendance
- Player Scheduling Challenges: Fluctuations in player availability and unpredictable schedules contribute to unresponsiveness and no-shows, leaving teams in a bind as they scramble to find last-minute replacements
Pivoting and De-scoping
Initially, we honed in on the player substitution challenge, only to discover a broader issue: the lack of efficient overall team management. To address this, we prioritized enhancing team management in our MVP, reserving features like substitution management and chat for future phases.
Additionally, considering time, budget, and technical constraints, we chose a Progressive Web App (PWA) for the initial development, with the future goal of expanding into a fully-featured app.
Solution
Introducing: GamePlanr
Through our findings, GamePlanr emerged as a platform designed to empower team captains, offering:
- Effortless Team Creation: Seamless setup and invitation process
- Efficient Game Scheduling: Simplified tool for specifying game details
- Seamless Communication: Timely notifications for attendance confirmation
Low/Hi-Fi Designs & Task Flows
In line with user needs, we crafted low-fidelity wireframes for foundational representation. Three main task flows were prioritized:
- Task Flow 1: Signing Up For an Account
- Task Flow 2: Creating a team & Scheduling the first game
- Task Flow 3: Confirming Game Attendance
Testing and Iterations
To assess the effectiveness of our designs, we conducted unmoderated usability testing using Maze with 34 participants. Overall, participants enjoyed the features for their simplicity and straightforwardness. When tasked with rating each activity on a Likert scale from 1 (very hard) to 5 (very easy), the responses underscored the positive user experience:
- Task Flow 1: Signing Up For an Account: 4.7/5
- Task Flow 2: Creating a team & Scheduling the first game: 4.5/5
- Task Flow 3: Confirming Game Attendance: 4.6/5
Despite this favorable feedback, refinement was needed. To prioritize these changes effectively, we utilized a severity x frequency matrix to identify key usability issues and ranked them by impact x effort.
The primary concern raised by users centered on the process of confirming game attendance. They perceived the button used as small and non-intuitive, confusing it with a 'help' button.
Looking ahead, our commitment to iterative enhancements remains steadfast. Subsequent phases will involve ongoing iterations and further usability testing as we progressively roll out the PWA.
Implementation Details
Tech Stack
Frontend: JavaScript, React, Vite
Backend: Firebase, Firestore (database)
Technical Challenges
Backend:
Attempting to connect Firebase to an Android App, encountering challenges with inaccurate documentation.
Hardest Part of Development:
Deciding the initial direction between a mobile app and a Progressive Web App (PWA). Subsequently, ensuring a delicate balance between facilitating the app's development process and setting it up optimally for future scalability presented tough decisions.
Scaling Considerations:
Initially prioritizing the development of a mobile-based application, the team recognized the importance of planning for scalability from the outset. Opting for a Progressive Web App (PWA) instead of committing solely to an Android app strategy offered broader device accessibility and mitigated potential scalability issues inherent in platform-specific development.
Key Takeaways
Communication: Consistently maintaining effective communication across team members spanning a 9-hour time difference was indispensable for fostering adaptability and ensuring project success.
Adaptability: Remaining agile and receptive to evolving requirements and unforeseen obstacles was crucial for navigating the dynamic landscape of project development.
Technical Proficiency
GitHub Mastery: Collaborative work on GitHub empowered the team with essential skills in version control and streamlined team coordination, bolstering technical proficiency for future endeavors.
Continuous Learning: Embracing a culture of perpetual growth and dedicating resources to ongoing skill enhancement in React, JavaScript, Firebase, and other pertinent technologies underscores the team's commitment to staying abreast of industry advancements and seizing future opportunities for innovation.
Future Steps
To ensure a systematic rollout, we planned multiple stages, helping prioritize features and distinguish between "must haves" and "nice to haves." This approach guides us in delivering essential functionalities and refining the platform.
Phase 1: Launching the Foundation
Google Authentication:
- Allow users to sign in using their Google accounts, enhancing security and user convenience.
Team Captain Features:
- Enable team captains to create games and manage basic game-related and creation functions.
- Schedule games with date, time, and location details.
Game Management
- Introduce the ability for captains to create their first game and team
- Allow users to set up their profiles with photos
- Implement push notifications
- Dashboards and profile creation
Phase 2: Enhancing User Control and Functionality (in progress)
User Permissions:
- Introduce different permission levels, including co-captains, to delegate responsibilities within the team.
- Define and implement additional permissions for different user roles
Integration Features:
- Calendar Integration: Synchronize game schedules with users' personal calendars.
- Reporting: Provide basic reporting features for game statistics and team performance.
- Location Functionality: Enhance location services to facilitate better coordination during games and events.
- Advanced Notifications: Implement more sophisticated notification settings for users to customize their preferences.
Phase 3: Advanced Team Management and Gamification
Substitutes:
- Introduce features for finding substitutes when team members are unavailable.
- Implement comprehensive team management tools for captains and co-captains.
Player Stats:
- Integrate player statistics, allowing users to track individual and team performance over time.
Gamification:
- Introduce gamification elements to encourage user engagement.
- Reward users with unlockable features, upgrades, or special privileges for consistent participation in games.
Post-Launch Considerations
User Feedback and Iteration:
- Collect user feedback through surveys or feedback forms.
- Iterate on the application based on user suggestions and identified areas for improvement.
Marketing and Community Building Partnerships with Rec leagues:
- Develop a marketing strategy to promote the app.
- Foster a community around the app through social media and other platforms.
Continuous Improvement:
- We will regularly update the app with new features, improvements, and bug fixes based on user feedback and emerging trends in team management.
Learnings
Product Manager Learnings:
David
- Prioritization is key - We constantly had deadlines that shifted and oftentimes got caught up with this. I learned to focus on what’s important to break down large tasks into small bite size chunks. This made even the toughest tasks seem possible!
- Learn from your mistakes: Mistakes are going to be made, but it’s how you adapt to them that matters most. Don’t be afraid to step out of your comfort zone! I recall our mid-point demo presentation not feeling super confident, however looking back on this journey it was all part of the process
- Important of Communication - Working across multiple time zones proved to be challenging however we would constantly communicate via discord and daily standups (async) which helped to keep us on track.
- Ask Questions: As someone who works in tech, but does not necessarily come from a technical background, this course challenged me to ask questions for clarification, but also to lean into a growth mindset!
- Being able to zoom out into the details while maintaining a vision of the future and keep an eye on the prize is important. Not just thinking small or big but having to both at the same time.
Designer Learnings:
Hanna Silva
- Communication played a pivotal role in our fully remote team. Prioritizing regular meetings, documentation, and fostering inclusivity were essential for every team member to feel integral to the product. A personal highlight for me was organizing a workshop that not only deepened our understanding of our users' mindset but also united us with a common goal.
- Giving the team something to react to. Providing the team with something to react to by sharing early iterations of deliverables, even if not perfectly polished, proved invaluable. Witnessing how these early deliverables, like low-fidelity designs, sparked collaborative discussions, feedback, and swift iterations was both eye-opening and gratifying.
- 7 weeks fly by! It was a challenge to try to create a comprehensive product within a tight timeframe. Learning the art of concessions and prioritization was crucial. A key takeaway is the importance of solidifying core functions before delving into more dynamic features.
Designer Learnings:
Jo Sturdivant
- Adapting to an Established Team: Joining the team in week 6 of 8 was challenging, as I had to quickly adapt to existing workflows, dynamics, and goals. This mirrors real-world situations where you often integrate into teams mid-project, and flexibility is essential.
- Work-Blocking for Efficiency: With only two weeks to complete the project, I learned the importance of a structured work-blocking system. This approach allowed me to manage my time effectively and meet deadlines under pressure.
- Making Data-Driven Design Decisions: Unlike my past projects, I had to rely on research conducted by others. This was a valuable experience in using pre-existing data to guide design decisions, helping me focus on the core insights without starting from scratch.
Developer Learnings:
Alex Merkel
- Frequent Communication: Maintaining open lines of communication was integral in ensuring that all team members were aligned on goals and progress. We held bi-weekly meetings to discuss our tasks and address any roadblocks, which proved vital in keeping the project on track.
- Prioritization of Features: Learning to prioritize features based on user stories and feasibility within our timeline was crucial. We used a trello to visually organize tasks, which helped us meet our project milestones efficiently.
- Feedback and Brainstorming: Engaging in regular feedback sessions enabled us to fix and refine our app. By getting feedback and ideas from each team member we were able to identify easy to miss errors that we might not have otherwise and come up with more efficient ways of implementing important features.
Developer Learnings:
Vanady Beard
&
As the back-end developer, I learned how important it is to create efficient and reliable systems that support the entire application. This experience also taught me the importance of optimising the database and ensuring the backend is scalable and easy to maintain.
Developer Learnings:
Stephen Asiedu
&
As a back-end developer, I've come to understand the importance of being familiar with various database systems and modules. This knowledge enables me to build diverse applications and maintain versatility in my work. I've also learned that the responsibility for making the right choices rests on my shoulders, guided by my best judgement.
Developer Learnings:
Mitchell Hamm
&
- Product Teamwork Triumphs: Embracing the multifaceted process of product creation through teamwork was eye-opening. Collaborating with diverse talents highlighted the importance of collective effort in navigating the complexities of product development.
- GitHub Guru: Mastering GitHub's intricacies was like unlocking a treasure trove. This skill will be invaluable for future projects.
- Documentation Humor: Discovering the quirks of documentation was enlightening. It underscored the importance of adaptability in software development.
Developer Learnings:
Maurquise Williams
&
- Process of Creating an MVP: Developing a Minimum Viable Product (MVP) taught me how to focus on delivering core functionalities balancing between essential features and avoiding scope creep.
- Collaboration in a Real-World Tech Setting: This experience taught me how to collaborate efficiently in a fast-paced tech environment, keeping the team aligned and productive, even while working remotely across time zones.
- Sharpening Critical Thinking and Problem-Solving Skills: This experience honed my ability to think critically and solve problems efficiently. By tackling challenges and finding quick solutions, I sharpened my decision-making and troubleshooting skills in a dynamic, real-world setting.
Developer Learnings:
Jeremiah Williams
&
All in all this experience was very awesome I learned that in coding with others being transparent is key
Developers Learnings:
Justin Farley
&
I learned how important communication is when working with a team. Communication provides understanding, advice, ideas, and much more. While working with the product team, I’ve found that communication keeps everything flowing smoothly. Working with a team also showed me that every member brings something different to the table and we all have to work together in order to align and meet our end goal.
Full Team Learning
- We've developed effective collaboration across diverse time zones, blending our varied skills and work experiences. Recognizing the significance of iterations and trade-offs in transforming our product vision, we've learned the importance of effective communication, flexibility, and making necessary adjustments. We are really grateful for the mentorship from Keyuri that has guided us through these learning curves. Equipped with these experiences, we are prepared to tackle upcoming projects, leveraging the diverse insights of our team members.