Student Hub

Inspiration The inspiration for the Student Hub came from the common frustrations students face with complex, dated, and often inaccessible institutional portals. We wanted to create a "Student Center 2.0"—a platform that isn't just a database, but a proactive assistant that adapts to every student's individual needs, whether those are situational, temporary, or permanent.

What it does Student Hub is a comprehensive student management platform that centralizes academics, finances, and schedules into a premium, high-performance dashboard. Beyond typical features, it hosts a suite of advanced accessibility tools:

AI-Powered Accessibility: Integrated ElevenLabs Text-to-Speech for reading content aloud and Gemini-powered AI chat for instant support. Adaptive UI: High-contrast modes, dyslexia-friendly typography, and "Concise English" mode for improved comprehension. Proactive Scheduling: A smart "Swap Class" feature that detects time conflicts and seat availability in real-time. Global Support: Multi-language captions that translate English UI elements on the fly for international students. How we built it We utilized a modern, scalable stack to ensure the application remains fast and responsive:

Framework: Next.js with TypeScript for a robust, type-safe frontend. Styling: Tailwind CSS for a premium, custom-designed aesthetic. AI Integration: Google Gemini for the intelligent campus assistant and ElevenLabs for natural-sounding AI voice generation. State Management: React Context API for synchronizing complex accessibility settings across the entire system. Icons: Lucide React for a clean, consistent visual language. Challenges we ran into One of the primary challenges was implementing a truly universal High Contrast mode. We found that global CSS rules often interfered with complex components like progress charts and interactive cards. We had to develop a hybrid approach using CSS variables and local state detection to ensure that while the UI became high-contrast, it stayed functional and didn't lose critical data visualization. We also worked through the logic of real-time conflict detection in the scheduling module to provide immediate feedback to users.

Accomplishments that we're proud of We are incredibly proud of the Deep Accessibility Integration. Instead of accessibility being an afterthought, we built it into the core architecture. Seeing the ElevenLabs AI "Read Aloud" button appear seamlessly when a user selects text, or watching the entire system's language and complexity shift instantly via the accessibility menu, felt like a major win for inclusive design.

What we learned This project was a deep dive into Accessibility-First Design. We learned that designing for the most extreme use cases (like high-contrast or concise language modes) actually results in a better, cleaner experience for all users. We also gained significant experience in orchestrating multiple AI APIs to work together within a single cohesive user journey.

What's next for Student Hub The future of Student Hub involves even deeper integration with campus ecosystems:

Real-time Campus Navigation: Integrating maps and room-finding services. Predictive Academic Modeling: Using AI to help students plan their degree paths multiple semesters in advance based on their goals. Peer Support Integration: Adding collaborative features for study groups and peer-to-peer mentoring directly into the dashboard.