Interactive Learning Assistant with Customizable 3D Avatars
Built by Youssef Salem Hassan
01
Overview
Immersive learning experience with customizable 3D avatars and emotional interaction
02
The Problem
Remote learners disengage when digital classrooms lose emotional cues, embodied identity, and lightweight accessibility affordances.
03
The Solution
This assistant couples React with Three.js scenes so students personalize avatars, receive expression-driven feedback, leverage text-to-speech reading paths, and anchor guided prompts—bridging LMS integrations or standalone hosting scenarios.
Technologies used
8Languages
JavaScript
Experience & UI
React
Other
Three.js3D GraphicsText-to-SpeechWeb DevelopmentEducational TechnologyUI/UX
04
Key Outcomes
- Novel fusion of WebGL avatars + instructional UX patterns aimed at motivation science.
- Accessibility-forward touches such as TTS reading lanes alongside visual feedback.
05
Screenshots & gallery
Product UI
3 imagesMore projects
- Al Jawad Group — Field Operations SystemOne system for a Riyadh facility-management company: customer app, staff app, admin dashboard, company website and a Laravel API, Arabic first.
- 92 Call Center — Product WebsiteArabic-first, bilingual marketing site for a cloud call-center subscription: ten sections from the marketing brief, real app screenshots, pricing, and the privacy and terms pages the app stores require.
- Technology 92 CRM — Sales & Client PipelineTechnology 92's internal sales CRM: clients, LinkedIn leads, quotations and a live dashboard, Arabic first, built on Laravel and Next.js.