Her Monarchs

A web application that provides a personalized plan for users to help monarch butterfly populations based on their location, the prevalence of deer in their area, light conditions, and soil type.

Comment

Inspiration

  • Wanted to help people understand the importance of protecting endangered Monarch Butterflies through growing native plants and reducing pesticide use

What it does

  • Displays an "about" page and each of the remaining webpages

How we built it

  • Used Figma, coded in React, and utilized Anima to convert Figma to React code

Challenges we ran into

  • Running a local server and sharing the server among teammates

  • Converting figma into react

Accomplishments that we're proud of

  • Created a working UX/UI design

  • Generated react code for each individual webpage using Anima

  • Coded database file on React to store user data

  • Coded quiz file on React

    What we learned

  • How to help our local community conserve monarch butterflies

  • How to work with Figma, react, and anima

  • Running a local server

  • Collaborating on VS Code

    What's next for Her Monarchs

  • User registration and login system: allow users to keep track of their sightings and contribute to the data collection effort

  • Social sharing: allow users to share their sightings and the project on social media platforms. Image upload: allow users to upload pictures of the monarch butterfly sightings.

  • AI-powered image recognition: to validate the species of the butterfly in the picture uploaded.

  • Historical data analysis: provide statistical analysis of the migration patterns and population trends over time.

Built With

Share this project:

Updates