Inspiration
Once upon a time, in the far away mystical land of Kitchener, Waterloo, humans and wildlife lived in harmony. But that all changed when the geese attacked.
Humans could not leave their homes without cowering in fear of a potential goose mauling. Everywhere they stepped, poop. Everywhere they went, honking. It became too much for them to bear on their own
Together with the power of friendship (and Honklert), humans can defend themselves from these avian nightmares. This application utilises cutting edge technology that connects users and allows them to share their experiences with geese. The nightmare is finally over.
What it does
The user flow begins with the index page where the user gets the latest highlights of geese news. Next, the user navigates to the CAPTGHA™ (Completely Automated Public Turing Test to Tell Geese and Humans apart). The main functionality appears on the next page, where the user is able to pin the location of where they last spotted a goose onto a map and upload a picture with relevant captions that alert other users of the danger level of this specific sighting.
How we built it
We created a mockup of the website using Figma, then implemented it using HTML, CSS, and JavaScript. Then, we experimented with various storage databases such as Firebase, Amazon S3, and Cloudinary to develop the user-generated photobase. For the map, we employed the Google Maps Javascript API and its Advanced Markers for users to mark geese sightings
Challenges we ran into
The integration of the Google Maps API into our website was one of our biggest struggles. We managed to make the markers work with user input after many attempts, but we were not quite able to fully implement a hover feature over the markers that allows users to view the details of the goose sighting. Our website is also more front-end heavy as many of the technologies we wanted to use were not within our skillset. A big part of this is due to the storage buckets, which is where the user inputted images were intended to be stored. Associating the images with the location pins, storing them in a bucket, and then retrieving them to use in our website was incredibly difficult and we were not able to implement this.
Accomplishments that we're proud of
We are incredibly proud of the API integration into our website as it was our first time using such technologies. Along with that, we all significantly improved our web development skills from front to back-end. Overall, we are satisfied with the creative idea we came with and seeing it come to life.
What we learned
Through this hackathon, we learnt about API testing processes such as functional and integration testing. As we collaborated, we utilized version control and developed our Git skills. We improved upon our basic HTML, CSS and JavaScript. We also learnt about buckets as we dealt with handling large amounts of data.
What's next for Honkler
There are many opportunities to continue developing Honklert. We can work on implementing an online database of geese pictures using buckets, as well as using the stored data to generate heatmaps. In addition, we can streamline the pinning process by training an AI model to detect important information within photos, such as aggression, hunger, number of geese, and amount of poop. To help users safely navigate their surroundings, Honklert can employ pathfinding algorithms to find the most efficient routes to avoid wildlife. Finally, Honklert can be expanded beyond geese to include more wildlife, like bears or coyotes in Vancouver. Not only does this website help us stay safe, it also aids in reducing human-wildlife interaction, promoting conservation and decreasing the disruption we cause to natural habitats.
Built With
- css
- figma
- github
- google-maps
- html
- javascript
- replit
Log in or sign up for Devpost to join the conversation.