Logo Relancio Borges
All projects

↘ Case study · 2024

Interactive Quiz

Interactive classroom quiz inspired by The Burnout Society by Byung-Chul Han

Animated project demonstration for Interactive Quiz

This project is a quiz designed to help a class interact with a presentation about Byung-Chul Han’s book The Burnout Society. During a Humanities class, our group needed both to present the subject and to involve the entire class. I suggested building a quiz based on our presentation so everyone could test how closely they had followed it.

Development

Front end

The front end was developed with React, Next.js, and TypeScript. The application contains three main pages:

  • /: The homepage, with options to play or open the settings menu.
  • /games: Lists the available games; currently, it offers a multiple-choice mode.
  • /games/multipla-escolha: Starts the quiz.

The quiz contains ten questions and checks whether the user has selected an answer before allowing them to continue. At the end, it presents each question, the user’s answer, the correct answer, the total number of correct answers, and the final percentage score.

Questions are stored in JSON. Next.js API Routes could have been used, but JSON kept the project intentionally simple and focused.

Considerations

  • The games page was inspired by the game menu from Overwatch.
  • Animations were created with Framer Motion.