Learn With Laughter, Grow With Culture!
Notice: This project is developed as part of my ALX Africa Software Engineering program and is intended to demonstrate skills and knowledge I acquired during the course
Welcome to Qubee Games! This Flutter application is designed to provide an engaging and educational experience for users, focusing on language learning and interactive gameplay. The app currently features three main MVP (Minimum Viable Product) features: Hibboo Language Learning Game, Playhouse Video Browsing Experience, and QubeeQuest Letter Tracing.
- Qubee Games
Qubee Games is an educational Flutter application that aims to make learning Afan Oromo fun and interactive. The app is built using the Flutter framework, which allows for cross-platform development, ensuring a consistent user experience across different devices. The app features a clean architecture pattern, state management using Provider, and a modern UI design.
The Hibboo Language Learning Game is an interactive mini-game that helps users learn traditional Oromo words through word-based puzzles. The game features a visual growth progression system, achievement tracking, and an interactive hint system.
-
Game Mechanics:
- Word-based puzzles presented in question-answer format.
- Interactive hint system with scrambled letters.
- Custom UI designed to match QubeeGames style.
-
Progress & Achievement System:
- 5-level progression system with visual representation.
- Achievement tracking for users reaching 85+ correct answers.
- Growth points system that ties into visual tree evolution.
-
Visual Growth Representation:
- Animated tree that evolves through 5 distinct stages.
- Special visual effects for higher-level achievements.
-
Educational Approach:
- Lenient answer matching to improve the learning curve.
- Success dialogs showing both the user's answer and the correct spelling.
- Detailed feedback to enhance vocabulary retention.
The Playhouse feature transforms the application into a clean, modern video browsing experience with search and category filtering. The new implementation includes automatic playback of the next video in the queue and a loop-back feature once all videos are watched.
-
Entities and Models:
- Added
Videoentity to include categories. - Created
VideoModelto match the newVideoentity.
- Added
-
Data Layer:
- Implemented
PlayhouseDatasourcefor fetching video data. - Added
PlayhouseRepositoryand its implementation.
- Implemented
-
Use Cases:
- Created
TrackVideoProgressuse case for managing the playback progress of videos.
- Created
-
Providers:
- Implemented
PlayhouseProviderto handle search, filtering, and auto-play features.
- Implemented
-
UI Components:
- Designed
PlayhouseDashboardPagewith a new layout for video browsing. - Added
PlayhousePlayingPageto handle video playback with auto-advance. - Developed
VideoCardWidgetfor displaying video information. - Updated
VideoPlayerWidgetto auto-continue to the next video.
- Designed
-
Dependency Injection:
- Configured DI setup to include the new Playhouse feature.
-
Routing:
- Added necessary routes for the new video playback flow.
-
Theme:
- Updated the app theme to use Material 3 for a modern look.
QubeeQuest is an interactive educational feature that helps users learn the Qubee alphabet through guided letter tracing exercises. This feature provides an engaging way for learners to practice writing letters while receiving real-time feedback on their accuracy.
-
Letter Tracing Mechanics:
- Intuitive tracing interface with visual guides.
- Real-time accuracy feedback.
- Path coverage calculation using a sampling-based approach.
- Multiple segments requiring 70% coverage per segment.
-
Gamification Elements:
- Points system based on tracing accuracy and path coverage.
- Letter unlocking progression system.
- Celebration overlay with confetti upon successful completion.
- Treasure word collection feature.
-
Learning Aids:
- Audio pronunciation support.
- Example words and sentences.
- Visual demonstrations of letter forms (capital and small).
- Practice count tracking.
Before you begin, ensure you have met the following requirements:
- Flutter SDK installed on your machine (version 3.10.0 or later)
- Dart SDK installed on your machine (version 3.0.0 or later)
- An IDE such as Visual Studio Code or Android Studio
- Git installed on your machine
- A basic understanding of Dart and Flutter
-
Clone the repository:
git clone https://github.com/venopyx/QubeeGame.git
-
Navigate to the project directory:
cd QubeeGame -
Install the dependencies:
flutter pub get
-
Run the application:
flutter run
The home screen serves as a gateway to all features of Qubee Games. From here, you can:
- Navigate to any of the game modules
- View featured games
- Access settings and preferences
- Navigate to the Hibboo dashboard from the home page.
- Start playing the game by answering word-based puzzles.
- Use the hint feature if you're stuck on a particular question.
- Track your progress and achievements through the visual growth system.
- Celebrate your achievements as you reach higher levels.
- Access the Playhouse dashboard from the home page.
- Browse and search for videos using categories and filters.
- Tap on a video to start playback.
- Enjoy automatic playback of the next video in the queue.
- Use the category filter to find videos on specific topics.
- Open the QubeeQuest map page from the home page.
- Select a letter to start tracing.
- Follow the on-screen guides to trace the letter.
- Receive real-time feedback on your tracing accuracy.
- Collect treasure words as you complete letter tracing exercises.
The project follows a clean architecture pattern with a feature-first approach:
lib/
├── app/ # Application-level configurations
│ ├── di/ # Dependency injection setup
│ ├── routes/ # Application routes
│ └── app.dart # Main application widget
├── core/ # Core utilities and constants
├── features/ # Feature modules
│ ├── hibboo/ # Hibboo language learning game
│ ├── home/ # Home screen
│ ├── playhouse/ # Video browsing feature
│ ├── qubee_quest/ # Letter tracing game
│ └── word_matching/# Word matching game
├── shared/ # Shared widgets and themes
└── main.dart # Entry point
Each feature follows the same structure:
- data: Data sources, models, and repository implementations
- domain: Entities, repository interfaces, and use cases
- presentation: UI components, state management, and widgets
- Flutter: Cross-platform UI toolkit
- Provider: State management
- Clean Architecture: Architectural pattern
- Material Design 3: UI design system
- Lottie: Animation library for visual effects
- Google Fonts: Typography customization
Contributions are welcome! Please follow these steps to contribute:
- Fork the repository.
- Create a new branch:
git checkout -b feature-branch - Make your changes and commit them:
git commit -am 'Add new feature' - Push to the branch:
git push origin feature-branch - Create a new Pull Request.
- Follow the Flutter style guide and best practices
- Write clean, maintainable code
- Include appropriate tests for new features
- Update documentation as necessary
- Ensure your code passes all existing tests
- Oromo Language Translator - Afan Oromo English translator
- Oromo Kids - Quickly teach your kids AFAAN OROMO alphabets and ABC, colors, numbers, body parts.
- Learn Afaan Oromo language - It includes words and phrases to get you started in the exciting language of Afaan Oromo.
This project is licensed under the MIT License - see the LICENSE file for details.
Growing up in Ethiopia, I witnessed firsthand how technology could be leveraged to preserve cultural heritage while making education accessible. The Afan Oromo language, despite being spoken by over 35 million people, had very few digital learning resources. This gap inspired me to create Qubee Games during my journey at ALX Africa's Software Engineering program.
My vision was simple yet ambitious: build an educational platform that makes learning Afan Oromo engaging, interactive, and accessible to anyone with a smartphone.
One of my biggest challenges was implementing Clean Architecture in Flutter. I wanted to create a codebase that was maintainable, testable, and scalable. The solution was to organize the project into three layers:
- Presentation Layer: UI components using Provider for state management
- Domain Layer: Business logic and use cases
- Data Layer: Data sources and repository implementations
This separation allowed me to develop features independently and ensure that business logic wasn't tightly coupled with UI or external data sources.
// Example of clean architecture in the Hibboo feature
// Domain layer - Use case
class GetHibbooList {
final HibbooRepository repository;
GetHibbooList(this.repository);
Future<List<Hibboo>> call() async {
return await repository.getHibbooList();
}
}The QubeeQuest feature required a sophisticated algorithm to track a user's finger movement and calculate how accurately they traced a letter. The solution involved:
- Breaking down letters into segments
- Using path sampling to track coverage of each segment
- Implementing a tolerance system to accommodate different tracing styles
// Simplified version of the tracing accuracy algorithm
double calculatePathCoverage(Path userPath, Path templatePath) {
final sampledUserPoints = samplePath(userPath, sampleCount: 100);
final sampledTemplatePoints = samplePath(templatePath, sampleCount: 100);
int coveredPoints = 0;
for (final templatePoint in sampledTemplatePoints) {
if (isPointCovered(templatePoint, sampledUserPoints, tolerance: 15.0)) {
coveredPoints++;
}
}
return coveredPoints / sampledTemplatePoints.length;
}This was particularly challenging because it needed to be performant on low-end devices while still providing accurate feedback to users.
-
State Management Complexity: Initially, I used setState() for state management but quickly realized its limitations for complex features. Transitioning to Provider significantly improved code organization but came with its learning curve.
-
Performance Optimization: The letter tracing feature initially caused frame drops on older devices. I had to refine the algorithm to use fewer computational resources while maintaining accuracy.
-
Offline-First Approach: Learning resources needed to be available offline, which required careful planning of data storage and synchronization strategies.
| Week | Milestone |
|---|---|
| Week 1 | Research, wireframing, and architecture planning |
| Week 2 | Core app structure and Hibboo feature implementation |
| Week 3 | Playhouse video platform development |
| Week 4 | QubeeQuest letter tracing implementation |
| Week 5 | Testing, optimization, and release preparation |
Qubee Games is just beginning its journey. Future iterations will include:
- Multiplayer Competitions: Allow friends to compete in language learning challenges
- AI-Powered Personalization: Adapt difficulty based on user learning patterns
- Expanded Cultural Content: Add more traditional stories and cultural elements
- Voice Recognition: Implement pronunciation practice with feedback
This project pushed me far beyond my comfort zone. As a developer who primarily worked on backend systems, diving into mobile development with Flutter was both exciting and intimidating. There were nights of debugging gesture detectors and days of refactoring provider implementations, but each challenge taught me valuable lessons about software design, user experience, and the impact technology can have on cultural preservation.
Qubee Games represents not just a technical achievement, but a personal mission to use technology for cultural and educational empowerment. While it's still a work in progress, I'm proud of what it's become and excited about where it's going.
"The beauty of programming isn't just in what we build, but in how our creations can preserve what matters to us." — Personal motto during this project
- ALX Africa Software Engineering Program for providing the opportunity to develop this project
- The Flutter community for their excellent documentation and support
- Google Fonts for providing beautiful typography options
- All contributors who have helped improve this project
If you have any questions or suggestions, feel free to contact me:
- Email: venopyx@gmail.com
- GitHub: @venopyX
- LinkedIn: VenopyX
Don't forget to Star the repo 😄
Thank you for using Qubee Games! I hope you enjoy the educational and interactive experience.