Touch Flower | Devpost

Inspiration

Gardening with an ecological impact. We want to motivate people to connect with nature by gardening and by making sustainable lifestyle choices.

What it does

Our trivia game encourages people to learn about the environment and sustainability. Correct answers are rewarded with flowers, which are added to the user's garden. Whenever a flower is added, or when the corresponding button is pressed, the user can view their garden. The questions are roughly arranged in order of difficulty, and getting the last 5 questions correct unlocks one of the rarest flowers. This reward will encourage people to care about the environment.

How we built it

We used HTML, JavaScript, and CSS. The JavaScript code contained the logic of the game, including the set of questions, the progression between them, a score counter, and functions to switch between different screens. We used HTML and CSS to design the layout of each of these screens and the buttons and sprites in them.

Challenges we ran into

We were all re-familiarizing ourselves with HTML, CSS, and JavaScript. One challenge we faced was related to displaying the questions and answers in the appropriate font. We also had to simplify our project: we were going to have users log in and save their progress using Firebase, but that proved unfeasible given the time crunch.

Accomplishments that we're proud of

Our 25-question trivia game includes a score display and allows the user to view the garden at any point. This means the user can gauge their progress whenever they want. If the user has not progressed far enough, certain flowers will be "locked," and the user will have to keep playing to unlock them.

What we learned

We (re)learned how to create a site from backend to frontend using HTML, CSS, and JavaScript. Through this project, we better understood the process of creating online quizzes and games. Since this was the first time some of us used GitHub for a group project, we had to learn how to merge our commits without any conflicts.

What's next for Touch Flower

In the future, users will be able to log into Touch Flower and save their progress. They will also be able to customize their garden; instead of unlocking one particular flower, they will be given a choice of what to add to their garden.

We also want to implement other minigames through which users can earn certain flowers. These will be distinct from the flowers that can be earned through the trivia game.