Inspiration
We realized that many people, especially nowadays with addictive social media, can scroll for hours, but seem to struggle with studying - even for a few minutes. We noticed that it isn't about grasping attention, it's about how the content is delivered. So, we decided to take the most addictive format in today's world - short-form scrolling - and transformed it into a learning experience.
What it does
FlashCrash turns your studying material into a Tiktok-style feed, and tests your understanding in real-time. You scroll through "short-form content" (flash cards, bites of information) and after a few swipes, it quizzes you to help you retain what you just learned.
How we built it
FlashCrash was built using a modern web stack focused on performance and a seamless user experience. The frontend was developed with Next.js, React, TypeScript, and Tailwind CSS, using shadcn-style UI components to create a clean, responsive interface. This handled the upload flow, swipeable feed, flashcards, quizzes, and smooth scrolling interactions.
For the AI layer, we used Gemma 4 via the Gemini API. When a user uploads notes, the system extracts the text, sends it to the AI with structured prompts, and converts the response into a JSON format. This structured output allows the frontend to reliably render study cards and quiz questions in a consistent, swipeable format.
To support a fluid “infinite scroll” experience, the feed is generated in batches. As the user scrolls, additional content is fetched asynchronously, ensuring the interface remains fast and continuous despite AI processing latency.
The backend logic was handled using Next.js API routes, connecting user input, AI processing, and frontend delivery into a unified pipeline. The application was deployed on Vercel for fast and reliable hosting.
Challenges we ran into
One big challenge we happened to run into was integrating the AI output into a smooth user flow. Early on, the batch processing wasn't functioning properly, and information appeared to be inconsistent, We solved the bugs and structured the AI output into a fixed format, which made sure that the content stayed clean and according to the input fed into the application.
Accomplishments that we're proud of
Overall, we're proud of how we were able to create a fully functional experience from a simple idea - within such a short time. We were able to deliver a complete and cohesive product from uploading files to generate a TikTok-style feed and integrating real-time quizzes
What we learned
We learned how to work in a team environment and solve any conflicts that occurred. We were able to learn how important simplicity can be in certain settings like this, by just focusing on the core experience. Instead of focusing and building many features, we decided to prioritize on one or two features, which worked in our case.
What's next for FLASH
For FlashCrash, we would focus on improving the personalization aspect (app focuses on user's weak spots and helps refine it). We also plan to expand the input formats and integrate with certain popular platforms that students use.
Built With
- gemma
- html
- javascript
- languages
- next.js
Log in or sign up for Devpost to join the conversation.