Sci-Bono Ai Hub

The Sci-Bono AI Hub is a free, open-access learning. It exists to give every South African learner, student, educator, professional, or curious mind a clear pathway into artificial intelligence, from understanding the basics all the way to building and running AI agents.

✨ Features

🎓 Learning Management

• 6 Comprehensive Modules: AI Foundations, Generative AI, Advanced Search, Responsible AI, Microsoft Copilot, AI Impact
• 45+ Interactive Chapters: Rich content with SVG graphics, inline examples, and real-world applications
• Dynamic Content Loading: Database-driven lesson delivery with bookmark and note-taking support
• Progress Tracking: Real-time tracking of lesson completion and course progress

📝 Assessment System

• Interactive Quizzes: 6 module-level assessments with auto-grading
• Question Randomization: Randomized question and answer order for academic integrity
• Multiple Attempts: Support for retakes with best/latest/average scoring options
• Quiz Analytics: Detailed performance metrics and question difficulty analysis
• Instructor Override: Manual grading and partial credit assignment

🚀 Project Submission & Grading

• File Upload System: Drag-and-drop interface for PDF, images, and code files
• Submission History: Version tracking with multiple submission support
• Rubric-Based Grading: Structured grading criteria for consistent evaluation
• Instructor Dashboard: Dedicated grading queue with pending submissions

🏆 Gamification & Achievements

• 16 Achievements: Unlockable badges across 6 categories (Learning, Mastery, Engagement, Milestones, Special, Loyalty)
• Points System: Earn points for completing lessons, quizzes, and projects
• Leaderboard: Compete with peers on weekly/monthly/all-time rankings
• Achievement Tiers: Bronze, Silver, Gold, Platinum badges
• Unlock Animations: Eye-catching GSAP-powered notifications

🎨 Modern UI/UX

• GSAP Animations: Smooth, professional animations across all dashboards
• Animated counters for statistics
• Progress bar animations with pulse effects
• Slide-in/fade-in effects for content
• Achievement unlock animations with glow effects
• Responsive Design: Mobile-first approach, works on all device sizes
• Role-Based Dashboards: Customized interfaces for Students, Instructors, and Admins
• Progressive Web App: Installable on devices, offline-capable

🔐 User Management & Security

• JWT Authentication: Secure token-based authentication
• Role-Based Access Control (RBAC): Student, Instructor, Admin, Super Admin roles
• Password Hashing: bcrypt encryption for secure password storage
• Token Blacklist: Secure logout with token invalidation
• XSS/SQL Injection Protection: Prepared statements and output escaping

📜 Certification System

• Automated Certificate Generation: PDF certificates on course completion
• 2 Certificate Templates: Professional designs with verification codes
• Certificate Verification: Public verification via unique codes
• Certificate History: View and download earned certificates

👤 Profile Building & Social Features

• Detailed User Profiles: Bio, headline, location, social links (Website, GitHub, LinkedIn, Twitter)
• Privacy Controls: Granular privacy settings (public/private profile, show/hide email/achievements/certificates)
• Profile Completion Tracking: Animated progress bar showing 0-100% completion
• Public Profile Viewing: Privacy-aware profile pages respecting user settings
• Learner Directory: Searchable directory with filters (role, search by name/headline/location)
• Profile Analytics: View count tracking with self-view prevention
• Social Discovery: Find and connect with fellow learners in the community

📊 Admin Features

• Content Management: CRUD operations for courses, modules, lessons, quizzes
• User Management: Create, update, deactivate users
• Enrollment Management: Assign students to courses
• Analytics Dashboard: System-wide statistics and reports
• Activity Logs: Track user actions and system events

🛠 Technology Stack

Backend

• PHP 8.0+: Server-side logic with modern OOP patterns
• MySQL 8.0/MariaDB 10.5+: Relational database with 34+ tables
• PDO: Prepared statements for SQL injection prevention
• JWT (JSON Web Tokens): Stateless authentication

Frontend

• HTML5: Semantic markup with 85+ pages
• CSS3: Pure CSS with CSS variables for theming (no frameworks)
• Vanilla JavaScript (ES6+): No frameworks, 19 modular JS files
• GSAP 3.12.2: GreenSock Animation Platform for smooth animations
• Font Awesome 6.1.1: Icon library
• Quill.js: Rich text editor for student notes

Progressive Web App

• Service Worker: Offline caching strategy
• Web App Manifest: Installable on mobile/desktop
• Cache-First Strategy: Fast load times with network fallback

Development Tools

• Composer: PHP dependency management
• Git: Version control
• Apache/Nginx: Web server with mod_rewrite