CAPIT is a US-based startup focused on creating educational software to aid children's reading and writing skills. Their main product, the CAPIT Reading application, is designed to make learning engaging and effective for young students.

1. Outdated Framework: CAPIT’s application was built on Haxe, a niche framework with a small user base and insufficient documentation, making development challenging.

2. Selective Deployment: CAPIT needed to release updates more frequently while maintaining high standards. Specifically, they aimed to implement Level 4 for a dedicated user group without deploying it across all districts. This selective approach was crucial for beta testing and segmented pricing.

3. Performance Issues: The application sometimes displayed images slowly or not at all, impacting the user experience and student engagement.

4. Update Challenges: Updates during school periods were problematic due to centrally managed devices. When CAPIT deployed a new version, not all users consistently updated the native application to the latest version. As a result, some devices did not receive new improvements and bug fixes.

5. Lack of User Data: CAPIT lacked insights into actual end-user behaviour, hindering data-driven decision-making.

SnapSoft brought extensive expertise in application development and AWS cloud solutions, offering a strategic approach to modernize CAPIT’s educational platform.

AWS was chosen for its robust cloud infrastructure, providing scalable, secure, and reliable services essential for modern application development and deployment.

Roadmap Creation

SnapSoft initiated the project by creating a detailed roadmap to understand the connection between existing challenges and future goals. This roadmap guided the modernization project tasks and feature implementations.

Code Review and Knowledge Update

The project began with a thorough code review and domain knowledge update regarding game development and potential feature implementations. SnapSoft reviewed and validated existing exercises to ensure they could be implemented with a new framework. The code review includes uniformed coding standards and guidelines with multiple tools like various linters, code formatting, and strict Merge Request review for changes. These tools are configured to behave in a certain way for a given environment to further enhance the quality and the speed of development.

The old configuration and build tools were outdated and not fully optimised, so they were upgraded to Webpack and Babel with a more robust configuration. These upgrades included HMR and optimization tools for images and CSS (e.g., Tailwind, PostCSS). Additionally, certain libraries were replaced or updated to the latest versions to enhance compatibility and align with modern standards. The steps for build and local development were simplified and partially automated to ensure a consistent way of app development.

Game development framework migration

The primary challenge was the outdated game development framework. SnapSoft researched and implemented Pixi.js as the new game development framework, continuously migrating old Haxe-based exercises to the new framework. A proof-of-concept exercise validated the compatibility of Pixi.js with the existing architecture.

During development a well planned architecture ensures the changeable requirements and some future possibilities as well Haxe compatible integration.

The goal is to completely eliminate the Haxe-based exercises while retaining the functionality of the existing ones. Given the size of the application, we need to use the old framework alongside Pixie, as a full refactor is not feasible all at once. Instead, we can gradually release the new implementations, transitioning to the new framework exercise by exercise. To ensure a smooth transition, we’ve implemented feature flags for the new exercises. This way, if any issues arise, we can instantly revert to the original exercises.

Key Elements of Pixi.js Implementation:

• Game architecture
  • Exercises are easily switchable and stateful
• User experience improvement
  • Multiple visual notifications
  • Higher FPS
  • Clearer images (with SVG based configurations)
• Removal of obsolete components
• Separation of concerns for various parts of the application
  • Asset loading, Audio playing etc… have their own service which can be switched easily.
• Resolution of over 10,000 linter issues
• Modern Web standard API usage (like WEBGL)
• Caching improvements

Mobile Development Framework Migration

Parallel to game development modernization, SnapSoft migrated the mobile development framework from Cordova to Capacitor, addressing issues such as:

• Multi-target deployment
• Automated CI/CD process
• Over the air (OTA) updates By migrating Cordova to Capacitor we not only ensured the application is running on an up to date framework, we could use its maturity to use additional features like Over the air (OTA) updates. Using the OTA service on every app start we could download the updates seamlessly to the phones and make sure they are using the latest version. Application bundle is served from our server in a secure way, encrypted with our private key, therefore tampering with the bundle during the OTA download is not possible at all, as the client ensures a tampered bundle is dropped.

By integrating into our CI/CD pipeline we ensured we could publish any version with a click. We have separated our targets to our 3 core environments (development, testing, production) and on each push a release is being made for the respective target. The development version is now up to date with the web version in all cases. We have eliminated all the manual work, secrets are now truly secrets and a version is available within 10 minutes.

Feature Implementation

SnapSoft implemented several new features to address customer challenges and improve the application:

• Flagsmith: Enabled customization of exercise parameters and Level 4 beta lessons for dedicated users without developer intervention. Flagsmith is hosted in the customer’s own AWS account.
• Google Analytics: Provided insights into end-user behavior to inform product development decisions.
• Sentry: Offered detailed bug tracking and resolution.

Test Strategy and Management

SnapSoft developed a comprehensive test strategy for the reading application, implementing Qase as the test management tool. A repository of over 100 test cases covered end-to-end testing from login through all exercises. Key Testing Elements:

• Centralised support process
• Automated bug management
• User journey-based test plans
• Manual test cases for all exercises
• Regression test process for web and iOS applications
• Deployment strategy for multiple environments with quality assurance

The modernization project yielded significant benefits for both CAPIT and its end-users:

Benefits to the End-Users:

• Implementation of 3 new exercise types with faster loading times for lesson pictures and sound files due to caching and CDN updates.
• Seamless deployment of new native versions without logging users out or requiring manual updates, ensuring consistent access to the latest application version.
• Improved production deployment security and quality, reducing the likelihood of bugs reaching the production environment.

Benefits to CAPIT:

• The feature flag tool enabled the customization of exercises and Level 4 beta testing for dedicated users, enhancing user experience and product testing capabilities.
• Google Analytics integration provided valuable insights into user behaviour, informing product development.
• Automated iOS CI streamlined the deployment process, reducing manual steps and potential security issues.
• Sentry offered deep insights into system bugs, facilitating prompt resolution.
• Prepared CAPIT’s ecosystem for implementing Level 4, which includes new exercises and support for older students to improve their reading and writing skills.