StudentFocus

Inspiration

StudentFocus was inspired by the daily struggles students face when trying to stay organized. Between deadlines, tasks, exams, distractions and stress, it’s hard to find a tool that is simple, fast, modern and actually enjoyable to use. We wanted to create something that feels like a true second brain for students, helping them stay productive effortlessly.

What it does

StudentFocus centralizes everything students need to stay on track. It includes a clean dashboard that displays tasks, the calendar and progress, a full Kanban board, smart task planning, daily study roadmaps, built-in analytics, a guided tutorial system that adjusts depending on the page, global keyboard shortcuts, gamification with XP and streaks, multiple easter eggs like a Konami Code surprise, a complete Clear All Data system and an integrated AI assistant powered by Kiro to help with planning, explanations and feedback. The entire experience is built to feel smooth, fast and motivating.

How we built it

We built StudentFocus using Next.js with the App Router, TypeScript, TailwindCSS combined with ShadCN UI, Zustand for state management, local storage persistence, custom hooks for shortcuts, tutorial behavior, Konami detection and mobile handling, as well as a modular component-based architecture. The project was fully designed, implemented and deployed on Vercel within the 48-hour hackathon window.

Challenges we ran into

One of the biggest challenges was creating a tutorial system that positions every instruction in the correct place across all pages. Maintaining clean UX despite a large number of components was difficult too. Ensuring smooth performance, keeping everything responsive, designing a modern interface under time pressure and integrating many advanced features without breaking the flow were all significant challenges.

Accomplishments that we're proud of

We’re proud of delivering a polished and complete platform in such a short amount of time. The UI and UX quality, the interactions, the Kanban board, the analytics dashboard, the shortcuts, the onboarding system, the fun easter eggs and the overall fluidity of the experience are all accomplishments we value. StudentFocus feels like a real product, not just a hackathon prototype.

What we learned

We learned how to structure a large project extremely fast, how to polish the interface to create a modern experience, how to take full advantage of Next.js and modular components and how important animations, shortcuts and small details are. We also learned how to balance speed and quality under hackathon pressure.

What's next for StudentFocus

The next steps include cloud sync, real multi-device support, a full mobile app version, AI-generated study plans, group study spaces, deeper analytics, calendar integrations and more customization options. StudentFocus is only the beginning and the long-term goal is to become the definitive productivity companion for students.

Built With

• chart.js
• javascript
• kiro
• kiro.dev
• nextjs
• node.js
• react
• shadcn/ui
• tailwindcss
• typescript
• zustand