KapturaLumina
Basic Photography Learning Mobile Applications with Gamification
Part of my Bachelor Thesis research in gamification design and implementation.
Previews
Home Page | Leaderboard | Profile |
---|---|---|
Learn | Quiz | |
App Theme color inspired by Dracula Theme color palette
Tech Stacks, Dependencies
- Framework : Ionic v5 - React
- Database + Auth : Firebase
- Tools, Libraries :
- Ionic Capacitor
- TypeScript
- Cloudinary for image storage
- CloudImage for image resizing, compression, (image transformer) and acceleration / optimization
- Deployment : Vercel (Formerly Zeit) for PWA (Web App) Version
Getting Started
SettingUptheFirebase
In order for the application to run, you will need to connect it to Firebase Auth and Database.
- Create a firebase project
- Go to project settings, add a web app to acquire the API key
- Go to Authentication -> Sign In Method -> Enable Email/Password
- Go to Database -> pick Realtime Database -> import this sample database file
Getting Started
- Download and install node.js
- Install ionic CLI :
npm install -g ionic
- Clone this repo
git clone https://github.com/sozonome/kapturalumina.git
- Run
npm i
oryarn
from project root - Run
npx cap sync android
to synchronize capacitor deps / native bridges - Run
ionic s
Build Guide (android)
Make sure you have installed Android Studio
General Build Guide
npm run build-release-android
ornpm run build-clean-release-android
Build to APK Guide
npm run build-release-android
,npm run debug-android
, wait until Android Studio Open and finish setting up Gradle etc- Clean Project + Rebuild Project if needed
- Go to Build > Generate Signed Bundle / APK
- Put in the password of the KeyStore
- Done
Room for Improvements
- [ ] Auth
- [x] Forgot Password / Request Password Reset
- [ ] Register / Sign In with Google Account / Twitter
- [ ] Content (materials, discussions)
- [ ] community generated content section
- [ ] Admin Dashboard
- [ ] a separate project to manage material contents
- [ ] Internationalization / i18n