Clarity: Hear What Isn't Being Said

Overview

Clarity is a real-time classroom feedback platform that bridges the communication gap between students and educators. Built during our first venture into full-stack web development, Clarity empowers students to anonymously share confusion points while giving teachers AI-powered insights into what their class truly needs.

What We Built

For Students

  • Anonymous Submission Portal: Share confusion points without fear of judgment
  • Course Enrollment: Join classes with unique Course IDs
  • Dashboard Interface: View and manage enrolled courses

For Teachers

  • Real-Time Analytics Dashboard: Monitor student confusion as it happens
  • AI-Powered Insights: Get Gemini-generated summaries identifying common themes and knowledge gaps
  • Instant Classroom Pulse: Track submission frequency and top pain points
  • Course Creation & Management: Create courses with unique IDs for student access

Tech Stack

Frontend: Next.js and React, designed in Figma with a clean, modern aesthetic

Deployment: Vercel for seamless frontend hosting

AI Integration: Google Gemini API for intelligent content summarization

Key Features

  • Complete Anonymity: Students can voice concerns without identity exposure
  • Smart Summarization: Gemini clusters similar confusion points into actionable themes
  • Thoughtful Design: Custom color palette and typography for clarity and accessibility
  • Real-Time Updates: See confusion submissions as they come in

Accomplishments that we're proud of

  • Built a fully functional teacher-student ecosystem with course management
  • Integrated Gemini AI for contextual understanding and summarization of student confusion
  • Designed an intuitive and cohesive Next.js interface from scratch using Figma
  • Created a tool that genuinely has potential to improve classroom communication and learning outcomes

What we learned

  • How to bridge frontend and AI seamlessly in a single application
  • How to design for empathy, focusing on usability, anonymity, and trust in educational tools
  • How to prompt-engineer Gemini to deliver meaningful, structured learning materials
  • The entire process of taking a concept from design to deployed application
  • How to work with Next.js routing, component state management, and API routes
  • The importance of environment variable management and deployment pipelines with Vercel

What's next for Clarity

We plan to expand Clarity with:

  • Backend infrastructure with database integration for persistent data storage
  • Upvote system for students to validate peer confusion points
  • AI-generated study materials including flashcards and personalized summaries
  • Live heatmaps to visualize confusion spikes across lecture topics
  • WebSocket integration for instant dashboard updates without refresh
  • Notification system to alert teachers when confusion levels spike
  • Sentiment analysis to detect frustration levels in submissions
  • Study group matching to pair students struggling with similar concepts
  • LMS integration with Canvas, Blackboard, and Moodle
  • Mobile app for on-the-go submissions
  • Voice-to-text submissions for easier input
  • Analytics dashboard for long-term learning trends

Why Clarity Matters

In large lecture halls and hybrid classrooms, dozens of confused students stay silent. Clarity gives them a voice while giving educators the insights they need to teach more effectively. We're not just building a tool - we're reshaping classroom communication for the better.

Built by first-time full-stack developers who learned to code by building something that matters.


Built With

Share this project:

Updates