NOVA: Gamified Substance Awareness Platform

Team PESIMENS

NOVA is a gamified web application developed to raise awareness among teenagers about the effects of drug and substance abuse.

The platform combines interactive storytelling, quizzes, habit tracking, progression systems, and social competition to create a more engaging learning experience.

This project was developed for the National-Level Ideathon ARAMBH, conducted as part of INCUB8 at NITK Surathkal, where our team secured 3rd place. The solution was shaped around a simple objective: use gamification and user engagement to address a serious social issue in a memorable way.

Team

• Team Name: PESIMENS
• Darshan P Pawar
• Atharva Bidre
• Sharvesh K

Overview

NOVA presents users with a hero-themed learning journey. After registering and logging in, users can continue the story, complete quizzes, track healthy habits, earn XP, level up, maintain streaks, and review their standing on a leaderboard.

The codebase is organized into two main parts:

• frontend/ - React single-page application
• backend/ - Express and MongoDB API for authentication, progress tracking, quizzes, and leaderboard data

At A Glance

Item	Details
Project	NOVA
Team	PESIMENS
Event	ARAMBH, INCUB8 at NITK Surathkal
Outcome	3rd Place at National Level
Purpose	Substance abuse awareness through gamification

Demo

• Register or log in to enter the dashboard and continue the learning journey.
• Explore the story mode to make choices that update progress and achievements.
• Complete quizzes to earn XP, review explanations, and level up.
• Check the leaderboard to compare progress with other users.
• Use the habit tracker to simulate healthy daily routines and reinforcement habits.

Features

• User registration and login with JWT-based authentication
• Personalized dashboard with level, XP, streak, and chapter progress
• Interactive story mode with branching choices and progress updates
• Quiz system with scoring, explanations, and XP rewards
• Leaderboard sorted by level and experience
• Profile page with language preference controls
• Habit tracker interface for daily wellness habits
• Seed endpoint for loading demo quiz content

Technology Stack

Frontend

• React 18
• React Router
• Axios

Backend

• Node.js
• Express
• MongoDB with Mongoose
• JWT authentication
• bcryptjs for password hashing
• CORS and dotenv for runtime configuration

Application Flow

Authentication

Users register with a username, email, and password. The backend hashes the password, creates the user record, initializes progress data, and returns a JWT token. During login, the application also updates the user streak based on the last login date.

Progression and Rewards

• Completing a story chapter grants XP and may unlock achievements
• Completing quizzes awards XP based on the final score
• Level progression is based on accumulated experience, with each level requiring level * 200 XP
• The dashboard displays the current level, XP, streak, and completed chapters

Story Mode

The story feature currently includes an early prototype titled The Echoes of Nova. Each choice advances the narrative and updates progress. The implementation serves as the foundation for a larger interactive learning experience.

Quiz Mode

Quizzes are retrieved from the backend and presented as interactive challenges. After submission, the application displays the score, completion percentage, per-question review, correct answers, and explanations.

Habit Tracker

The habit tracker currently operates as a local interface that allows users to toggle healthy habits, view daily progress, and stay motivated. It reflects the product concept, even though the current implementation is not yet backed by persistent storage.

Leaderboard

The leaderboard ranks users by level and experience and highlights the current user when available.

Backend API

The backend exposes the following endpoints:

• POST /api/register - create a new user and return a JWT token
• POST /api/login - authenticate a user and update streak data
• GET /api/progress - fetch authenticated user progress
• POST /api/progress - update chapter progress, choices, or achievements
• GET /api/quizzes - list quizzes, optionally filtered by category or language
• POST /api/quizzes/:id/attempt - submit quiz answers and receive scored results
• GET /api/leaderboard - fetch top users
• PUT /api/profile - update username or language
• GET /api/seed-data - remove existing quizzes and insert sample content
• POST /api/seed-data - same operation via POST

Data Models

The backend uses three primary MongoDB models:

• User - stores username, email, password, avatar, level, XP, streak, language, and timestamps
• Progress - stores chapter progress, completed chapters, story choices, and achievements
• Quiz - stores quiz metadata, questions, options, answers, explanations, category, difficulty, and language

Project Structure

nova-web-app/
├── backend/
│   ├── package.json
│   ├── server.js
│   └── models/
│       └── sseedData.js
├── frontend/
│   ├── package.json
│   ├── public/
│   │   └── index.html
│   └── src/
│       ├── App.js
│       ├── App.css
│       ├── index.js
│       ├── index.css
│       ├── components/
│       │   └── Navbar.js
│       ├── contexts/
│       │   ├── AuthContext.js
│       │   └── GameContext.js
│       └── pages/
│           ├── Dashboard.js
│           ├── HabitTracker.js
│           ├── Home.js
│           ├── Leaderboard.js
│           ├── Login.js
│           ├── Profile.js
│           ├── Quiz.js
│           ├── Register.js
│           └── Story.js

Local Setup

Prerequisites

• Node.js 18 or later
• MongoDB instance or MongoDB Atlas connection string

Installation Checklist

1. Clone the repository and open the project root.
2. Set up the backend dependencies and environment variables.
3. Start the backend server.
4. Set up the frontend dependencies.
5. Update the frontend API URL if you want to run locally.
6. Start the frontend application.
7. Open the app in your browser and seed sample quiz data if required.

Backend

Install dependencies:

cd backend
npm install

Create a .env file inside backend/:

MONGO_URI=your_mongodb_connection_string
JWT_SECRET=your_secret_key
PORT=5000

Start the backend:

npm run dev

Frontend

Install dependencies:

cd ../frontend
npm install

Start the frontend:

npm start

Quick Start Summary

If you prefer a short version, the local flow is:

1. Configure backend/.env.
2. Run npm install and npm run dev inside backend/.
3. Run npm install and npm start inside frontend/.
4. Seed quiz data if the quizzes page is empty.

Local Development Note

The frontend currently points to the deployed backend URL in AuthContext.js and GameContext.js:

• https://nova-web-app-aqho.onrender.com

To run the project fully locally, update those API calls to your local backend URL, such as http://localhost:5000.

Loading Sample Data

If the quiz list is empty, call the seed endpoint after starting the backend:

http://localhost:5000/api/seed-data

If you are using the deployed backend, use:

https://nova-web-app-aqho.onrender.com/api/seed-data

This clears the quiz collection and inserts sample awareness-focused quizzes.

Implementation Notes

• The story mode is currently a prototype with only the first few chapters implemented.
• The habit tracker currently uses local state rather than backend persistence.
• The frontend uses hardcoded backend URLs, so local setup requires a small manual change.
• The backend exposes a profile update endpoint, but the current profile page does not yet call it.

Project Intent

NOVA was designed to demonstrate how gamification can be applied to a social-impact problem. Rather than building a conventional awareness app, the project frames the experience as a guided journey where learning, progress, and motivation reinforce one another.

The ideathon experience also played an important role in shaping the project. Working overnight at NITK Surathkal, refining ideas under time pressure, and collaborating closely helped strengthen both the solution and our teamwork.

Recognition

We are grateful for the opportunity to participate in ARAMBH at INCUB8, NITK Surathkal, and for the collaborative effort that led to a 3rd place finish at the national level.

Future Improvements

• Persist habit tracker data in the backend
• Expand the story into a full multi-chapter journey
• Add multilingual content beyond the current profile preference selector
• Connect the profile save action to the backend update API
• Add deeper analytics and more advanced reward mechanics