Inspiration💡
80% of wildlife admitted to rehabilitation centers are directly or indirectly affected by human activities, underscoring the urgent need for conservation efforts. Countless animals all around the world are hurt by humans without a second thought. These animals that preserve and benefit the environment are uprooted by our greed. Because of this we created Wildlife Connect, a catalyst that will promote animal safety through rehabilitation centers.
What it does
Wildlife Connect promotes animal safety in 4 main ways.
- An AI Chat bot along with a map guide users who have found hurt or lost animals to nearby rehabilitation centers. This ensures that the animals get the care they need as soon as possible.
- It lets users symbolically "adopt" our animals by donating money to the cause. Wildlife Connect then uses this money to spread the message farther, and the user gets updates on its animals.
- Workshops and Social Media Posts are used to spread the message so more people care about animal safety.
- Educational Resources such as articles, and documentaries to encourage users to delve into this topic farther on their own.
How we built it
We used Create t3 App to make a template NextJS app with a tRPC backend. The tRPC backend communicated with the Open AI API and IP Info API. Then the NextJS front end presented this data in a easy to read chat bot and map format. To communicate between the back end and front end, we used typescript to ensure type safety on both ends. Lastly we used Vercel to host the website.
Challenges we ran into
Our biggest hurdle was learning how to use API's. It was our first time integrating API's into a large project and we got confused over all the new terminology like API keys, and different types of requests. This stumped us for hours until we decided to take a power nap. After viewing the situation with more clarity, we realized that there were libraries that handled all the HTTPS requests and simply required a function call.
Accomplishments that we're proud of
One of our greatest accomplishments was combining all these technologies we had basic understandings of together. Before this Hackathon we learned a little about NextJS, API's, web design, etc. but didn't have much experience. After spending 36 hours designing, prototyping, developing, and publishing Wildlife Connect, we are proud that we were able to seamlessly connect everything we were learning together.
What we learned
During this Hackathon we learned many things such as designing websites in Figma and how to integrate OpenAI's Chat GPT into our website. Before this Hackathon, we never designed a website before coding. However this time we used Figma to design our website before making it and were able to code it all rapidly since we didn't need to think about designing while we made the website.
What's next for Wildlife Connect
Our future plans are to expand beyond New Jersey and improve our Chat BOT. Currently our rehabilitation center database only contains centers within NJ, however we plan to steadily increase our list so other Wildlife Connect can expand to other states. Moreover, we want to improve our Chat BOT to work on the go. Right now our bot only works with text, which can be impractical if a user is trying to drive an animal to safety. We plan to give user speech to text and the bot text to speech so the use can seamlessly chat with the user as if they were on a phone call.
Built With
- ipinfo
- nextjs
- openai
- trpc
- typescript
- vercel
Log in or sign up for Devpost to join the conversation.