Lerni — AI-Powered Emotion-Aware Study Platform

Inspiration

Every learner has a different learning style, pace, and set of challenges. Sometimes, students feel confused, overwhelmed, or lose focus while studying, but traditional learning platforms continue presenting the same content without considering these difficulties.

This inspired us to build Lerni — an AI-Powered Emotion-Aware Study Platform. Our vision was to make digital learning more personalized by combining AI, emotion-aware interaction, and structured learning resources to help students learn with greater confidence.

What It Does

Lerni provides an interactive learning environment that brings personalized study support into one platform.

• Emotion-Aware Learning: Uses webcam-based facial-expression analysis to estimate emotional cues and offer relevant, optional learning support.
• Structured Study Modules: Organizes subjects into modules and lessons, helping students explore topics and progress step by step.
• AI Tutor: Provides conversational learning assistance, explanations, and guidance when students need additional help.
• Quizzes and Progress Tracking: Helps learners practise concepts, review their understanding, and track their learning progress.
• Personalized Dashboard: Gives users access to their learning activities and progress through their own accounts.

Rather than treating every learner the same way, Lerni aims to make learning more responsive to individual needs.

How We Built It

We developed Lerni as a full-stack web application using modern web technologies.

• Frontend: React 18, JavaScript, React Router, and CSS for a responsive and interactive learning experience.
• Backend: Node.js and Express.js for authentication, API endpoints, and application logic.
• Emotion Detection: Integrated webcam-based facial-expression analysis to estimate visual cues and support optional learning recommendations.
• AI Integration: Designed an AI Tutor experience to help learners understand topics and receive additional explanations.
• Database: Used SQLite for local development, with PostgreSQL configured for production deployment.
• Authentication: Implemented account registration and sign-in with password hashing and user-specific access to learning features.

We focused on creating a unified experience in which learners can study lessons, practise through quizzes, receive additional support, and revisit their progress.

Challenges We Faced

One of our main challenges was integrating multiple components—frontend navigation, backend APIs, authentication, database persistence, and AI-powered functionality—into a consistent application.

We also worked on making webcam-based emotion analysis useful without interrupting the learning experience. Facial expressions do not always accurately reflect a person's understanding, so our approach treats emotional cues as estimates and keeps learning recommendations optional.

Another challenge was ensuring that user accounts, saved progress, and navigation behaved consistently across sessions and deployment environments. Testing and debugging these interactions helped us improve the reliability and usability of the platform.

What We Learned

Building Lerni strengthened our understanding of full-stack development, API integration, database management, authentication, and the practical application of AI in education.

We learned that an effective AI-powered product requires more than connecting a model to an interface. It also requires thoughtful user experience design, reliable data handling, responsible AI practices, and careful testing.

Most importantly, we learned to approach AI as a tool that can support learners—not as a replacement for their judgment or an unquestionable measure of their emotions.

What's Next

We aim to improve Lerni with more personalized learning recommendations, richer lesson content, adaptive practice questions, and better progress insights.

We also want to evaluate the usefulness of its recommendations through learner feedback and testing, while strengthening privacy protections around webcam-based features.

Our long-term vision is to make learning more accessible, supportive, and personalized—helping students understand not only what they are learning, but also when they might benefit from a different explanation or approach.

Built With

• api
• bcrypt
• css
• detection
• edtech
• emotion
• express.js
• flask
• full-stack
• generative
• javascript
• jwt
• node.js
• postgresql
• python
• react
• recognition
• rest
• sqlite
• webcam