AI-boosted Flutter mobile app supporting soccer clubs in training young soccer players
Cross-platform Flutter mobile app created for professional soccer clubs. AI-boosted Duolingo for young adepts of soccer and a complete back office for professional coaches.
The Client
The Client is a Polish start-up aiming to support professional soccer clubs in training the best future soccer players, thanks to the latest technologies.
Thanks to an excellent business relationship between our client and known soccer clubs, the client was advised by professional soccer clubs. With such strong support, there was a clear business need and objectives the app had to address.
The case study presents only the first stage of the application’s lifetime. What we created is a rich MVP materializing the concept.
Challenges
Their primary motivation was to digitize the training experience. The founder’s mission was to create a mechanism allowing remote training for young soccer adepts. Of course, training without a coach is not possible. The whole system allows professional coaches to drive the process, just like in a live training session performed by a professional soccer academy.
The app should let young soccer adepts get back home after training and help them polish their skills independently with remote support from a professional coach. Considering the complexity of the soccer training process, the number of various forms of training, or dedicated target player goals, the app had to be supported by artificial intelligence.
The main challenge of this project was to design a system where the learning process is centralized, but mobile applications deliver data for the AI network to learn from.
As the low cost of operations was the key, we had to apply a few rounds of optimizations to the AWS (Amazon Web Services) configuration to achieve the lowest possible cost while maintaining stability.
Artificial Intelligence as support for coaches and soccer adepts
MediaPipe was the core library we used to implement an analysis of the player remote training sessions. Integration of algorithms has revealed a few challenges during the development process. To reduce the battery consumption of mobile phones and ensure that we are not dependent on the operating system of the mobile phones, we decided to implement the core set of algorithms on the backend side. Mobile apps were meant to deliver data for algorithms, consume results provided by the core, and act as live data consistency validation points in the system. The process of integration and validation of algorithms was challenging, but we were able to deliver the final, working application ahead of time.
How did we build the soccer training web & flutter mobile app?
Understanding our client’s vision was the key to the whole process, as we had a chance to create an application that was meant to revolutionize how professional soccer clubs organize the training of young soccer adepts. Therefore, the application delivery was divided into a few phases, described below.
Product Design Workshops
The client had an excellent idea for the product but required complete technical advisory from our side. During the sales process, we recommended a solution for the application. We prepared a preliminary Product Architecture described in detail during our Product Design Workshop sessions with the client.
Based on the conclusions from the workshop, we defined the core scope of the project and prioritized milestones and features. Finally, we have created a complete product roadmap with a detailed estimation of each milestone.
One of the key outcomes of the workshop was a complete change in the vision of how the Coach persona would interact with the system. The client’s initial plan was to deliver a dedicated Flutter mobile application for the Coach that would share standard features with the adept’s app. However, we persuaded our client to create a dedicated Web back office for the Coaches to reduce development costs, fit into the budget, and allow further flexibility and advanced analysis of training results. The effort paid off, as the client received a solid, stable mobile app focused on soccer adepts and a flexible Web app acting as a training center operated by Coaches and Admins.
UX/UI Design
We started the UX design of the mobile application during the Product Design Workshops phase. We decided to start the UX/UI Design process from the Flutter mobile application User Interface. We worked in Design Sprints as the final idea was evolving during the process. As usual, we started with wireframes. Then, with the client’s feedback, they transformed them into low-fi and hi-fi mockups with micro animations and motion design.
In the next UX/UI design phase, we created a web application design for Coaches and Admins by repeating the same steps. We implemented the system using Ant Design components for the Web interface.
Agile Development
We implemented and delivered the system in five months, while the expectations were to create the whole system in seven months.
During the Agile Development, we have followed standard Agile methodology.
As a result, we have created the following deliverables
- Flutter mobile app for iOS and Android operating systems
- React.js Web application
- Backend services implemented in Django/Python, integrated with and deployed to Amazon Web Service cloud.
Maintenance
We are responsible for the maintenance of the system. The maintenance phase’s goal is to ensure that the application is up-to-date and attractive.
During the maintenance, we are responsible for:
- Implementation of system monitoring
- Make sure that the application is up-to-date and attractive
- Fixing critical and non-critical issues
- Updating 3rd party libraries
- Implementing needed changes and features
Core features & system components
Have a look at some core features & system components we created during the Agile development process.
Dribbling skills judged by the Artificial Intelligence
The AI model is the heart of the app. The algorithm analyzes live-video training sessions, informs the soccer adept about critical mistakes during the training process, and aggregates training statistics.
Although we were meant to implement the tracking based on a few algorithms delivered by the MediaPipe library, the integration was not trivial. Our QA team paid substantial attention to the algorithm fine-tuning and verification process by participating in live testing of the application.
In the delivered MVP version of the application, the app can detect posture, movement, and basic training patterns. In-depth training of the AI core is a significant critical milestone on the roadmap of the system.
Soccer training program app
After examining the users’ needs and planning the basic functionalities of the application, it was clear that three separate panels should be created, covering end-users, trainers, and administrators. Each incorporates different functionalities and user permissions for other actions within the application.
The end-users panel
The trainee’s panel starts with an onboarding screen with the option to sign up. After successful registration, new users are provided guidelines on how to use the app. Those who already have an account are directed to the training section after logging into the app.
The application interface includes a navigation bar, video player, notification lists, and sections devoted to the profile details and general statistics concerning the progress made in training.
The role of gamification in the training plan
One of the elements of the application that increase User Engagement and support trainee’s in achieving their goals is gamification. It includes elements such as burning points that grow with each training and a progress bar presenting the points. If the user practices regularly, they progress in the skill tree and unlock challenges, but they can also get additional tasks from the coach. Moreover, thanks to the ranking, users can compare their achievements in the app.
To foster the growth of the soccer adepts community, we added a news feed section. This feature lets users publish posts and communicate with each other.
Please note that gamification supplements a regular training session for young soccer adepts. The app user is strongly encouraged by AI to develop his skills, but he also received dedicated training sets from his coach. In addition, the application acts as a socializing element within a soccer club and a source of healthy competition between players.
Trainer’s panel
A soccer coach can log in to the system through the coaching panel. It allows them to view the whole group of players under supervision and receive and assess soccer drills finished by the users. In addition, coaches can send feedback on the elements that need improvement, assign additional training sessions or create an individual training plan. An essential feature for a soccer coach is to be a part of the community, thanks to accessing the player’s list, ranking, and news feed.
Admin’s panel
Admins have their panel dedicated to managing roles and granting permissions for all user groups. For example, only they can add new users and assign them to the coach of choice. In addition, administrators have access to published posts, uploaded videos, and a preview of the user’s list with full details.
Results
The cooperation resulted in a Flutter mobile application published to Apple and Google app stores. The mobile application features are crafted to let soccer adepts maximize their growth. Soccer adepts are not overwhelmed nor forced to train, but the app introduces a social aspect and healthy competition in training, promoting engagement. We designed the mobile application to encourage the desire to progress.
Thanks to this revolutionary project, coaches and players can achieve better results in an easy and approachable way. In addition, talented soccer adepts that have not yet been discovered have a chance to demonstrate their skills and stand out from the crowd. Currently, the app is being tested by one of the first-league professional polish soccer teams, as its managers plan to train and discover new talents.
Trusted by leading brands
There is no better recommendation than the opinion of a satisfied customer. See what founders and managers say about cooperation with CrustLab.
With CrustLab’s expertise in sports betting development, we were able to refine the initial concept to better meet market requirements. The whole team brought a creative flair to overcoming challenges and offered unique solutions.
The most impressive aspects of CrustLab’s work were the level of technical expertise and ability to understand the project from a business perspective. They cared about our goals from the beginning, which helped us plan better and develop faster.
CrustLab was able to successfully deliver a fully-functioning product, much to the client’s delight. The team was highly communicative, and internal stakeholders were particularly impressed with CrustLab’s management skills. They’re on a straight road to success.
The CrustLab with the experienced team gave us a lot of development energy to build a user-friendly application. Within two weeks, they delivered the first round of iOS and Android apps. Within 3 months our application was launched without any major bugs. The quality is the DNA of the CrustLab.
The best part of working with CrustLabs was their attention to detail in every development process step. They were great about taking the initiative to suggest new enhancements and features that our product owners hadn’t thought of and sharing with us the best practices.
I was looking for a design team that had experience in sports betting. CrustLab helped me complete a full UX design project for my product. It was a very collaborative process, which is what I wanted. When I’m ready to do my next project, they’re going to be my first phone call.
CrustLab successfully delivered a product that was able to maintain its performance despite some sudden surges in the site’s traffic. Thanks to their experience and ability to predict problems, we found solutions and built the project on time.
We finished an MVP in 3 weeks. It was very valuable that CrustLab was able to evaluate the feasibility of our solution and estimated the effort and cost that was required to request the funding. CrustLab can be a business partner in addition to an excellent software development agency.
We hired CrustLab to introduce several modifications to improve one of the Pocco Finance apps and integrate it with the new version of the SDK. The project was completed on time and in line with the planned budget. I strongly recommend CrustLab as a software partner.
CrustLab’s implementation of our solutions has almost doubled our revenues. All aspects of cooperation were very good. I felt that we were treated as very important clients because we received a very high standard of service. The team delivered the results at the time and budget.
We are really satisfied with the cooperation with CrustLab. Very good technical skillset, good communication, and work done on time! After creating a customizable widget, we entrusted them with redefine of another application, and the results are splendid.
We take advantage of CrustLab’s experience in the field of payments, new functionalities, and user-friendly design. The development process itself ran smoothly and according to plan. It was important for us to complete the project on time, so I cannot imagine a better partner for this project.
CrustLab consistently adds value to our organization in many ways. We’ve received very positively feedback on the system CrustLab has delivered. Our customers regard it as an excellent product. Our experience working with them has far exceeded those of other vendors.
The team provided professional services that added value to the core functions of the business. They were fast and felt like our internal IT department, working during the night when we were deploying important features. That was fantastic, and I’m happy they’ve worked with me.
This team is hungry, sharp, “on it” and very customer-focused. I had no idea that I could find such great help from the other side of the world – especially a firm that could understand our product requirements even though I’m not a tech product manager.
Our cooperation with CrustLab concerned body leasing. They offered us highly skilled and experienced Android developers. I am fully satisfied with the ease of contact, the speed of completing the formalities, but most of all of the man they recommended to us.
More mobile development case studies
See other mobile applications implemented by CrustLab
