ReefRiches

Homepage!
Financial Learning Sections
Player Progress

Inspiration

Quizlet inspired us with this idea. We thought it would be fun and cool to combine a quiz and a game together and provide a fun and engaging experience for children to learn about money.

What it does

Our website includes three sections, each of which covers one specific topic about money: saving, spending, and management. Users will do a quiz for each topic and collect points. The questions are generated by Gemini dynamically so that users will get different questions each time they play again. The purpose of our game is to teach children the basics about money in a fun and engaging way.

How we built it

Our first step was to draw up a blueprint of the project, including the basic logic, the languages and frameworks we would use, and what the final project would look like. Based on our blueprint, we chose the React library. Firstly, we built a barebones frame. The questions were hard-coded, and the UI was simple. Then we improved our website by adding more features, and enhanced the UI step by step, such as integrating Gemini APIs.

Challenges we ran into

To generate the related questions, we need very specific prompts, and we also need to define the format of the response so that we can render the data correctly using JavaScript.
We reached a credit limitation of the Gemini APIs. So to test our website, we had to register new Google accounts. ## Accomplishments that we're proud of
Being able to use the Gemini API and dynamically render the response we got. ## What we learned
The integration of web applications and generative AI APIs.
The state management and reducer in React. ## What's next for ReefRiches
Add more sections about money.
Dynamically generate content for users to learn.
Generate more questions for each section.
Add authentication functions so that user can access their learning status anywhere.