OnWise

Interactive Digital Literacy Platform

Team Members: Himansi, Sathwika, Unnati, Jamera


Inspiration

Our inspiration for OnWise came from a casual conversation about our parents and their online presence—especially on Facebook. We were laughing about how our moms love to send us interesting reels or posts that aren’t always accurate. That conversation sparked an idea: what if there was a way to help people like our parents safely navigate the internet without falling for misinformation or spam?

We wanted to create an environment where our relatives—and anyone learning digital literacy—could confidently scroll through social platforms without being misled by suspicious content. That vision became the foundation for OnWise.


What It Does

OnWise is an interactive learning platform that teaches users how to recognize misinformation, spam, and clickbait online.

The app simulates a familiar social media feed where each post includes a mix of trustworthy (“green flags”) and suspicious (“red flags”) elements. When users click on a potential red flag—like an urgent headline or shortened link—an AI-driven voice coach starts a conversation to guide their reasoning.

The user explains their thought process aloud, and the system provides structured educational feedback. This hands-on, conversational approach helps users build real online literacy skills in a low-stakes, engaging way.


How We Built It

We built OnWise using a multi-layered architecture that combines a React Native frontend, a Node.js/Express backend, and an AI-driven coaching system.

Frontend (React Native)

  • Displays a dynamic, scrollable feed built from a structured JSON dataset.
  • Each post includes profile info, media descriptions, and clickable “flag chips.”
  • Integrates LiveKit for real-time speech input and transcription as well at TTS for natural voice prompts and feedback.

Backend / API

  • /api/posts → returns the post dataset for the feed.
  • /api/coach → sends the user’s selected red flag to GPT 4o using Groq APIs, which generates guiding questions and produces structured feedback.
  • /api/token → provides authentication tokens for LiveKit voice sessions.

AI & Voice Stack

  • Layer 0 (Heuristics): Detects basic post signals (e.g., caps ratio, emoji count, domain age).
  • Layer 1 (Coach): Uses GPT 4o to generate guiding questions and structured conversation loops through prompt engineering, and LiveKit turn detector plugin for seamless conversation flow and interrupts.
  • Voice I/O: LiveKit (transcription + voice responses).

Challenges We Ran Into

Like most hackathon teams, we faced several technical hurdles:

  • Wi-Fi instability: Limited network access made it difficult to test API integrations.
  • Frontend–Backend integration: React Native compatibility issues prevented our AI agent from functioning correctly at first.
  • LiveKit setup: Configuring secure connections (HTTPS and TURN/STUN) caused repeated disconnects.
  • Dependency conflicts: Version mismatches between libraries led to runtime bugs in speech recognition.

Despite these obstacles, we managed to get our core features running smoothly.


Accomplishments That We’re Proud Of

  • Successfully built a functional AI-driven voice coaching system.
  • Developed a realistic mock social media feed powered by a structured JSON schema.
  • Integrated LiveKit for a conversational voice experience.
  • Designed a scalable architecture separating coaching, adjudication, and visualization layers.
  • Created a prototype that genuinely helps users improve their online literacy.

What We Learned

  • How to design conversational AI experiences that are both educational and user-friendly.
  • The importance of UX design in digital learning.
  • Building real-time speech-to-text pipelines using LiveKit.
  • Integrating multiple AI models (GPT 4o) for reasoning.
  • Effective teamwork and parallel workflows between frontend, backend, and AI engineering.

What’s Next for OnWise

  • Expand the dataset with diverse post types (news, memes, short videos).
  • Add personalized learning progress tracking.
  • Integrate multilingual support for global accessibility.
  • Partner with schools, libraries, or community programs.
  • Deploy a full web version with secure hosting and user accounts.

Built With

  • React Native — Frontend and UI
  • Node.js + Express — Backend APIs
  • LiveKit — Speech input and real-time transcription and conversational voice interface
  • GPT 4o — AI reasoning and feedback
  • JSON Schema — Structured post data and annotations
Share this project:

Updates