Inspiration

VTHacks has a prehistoric theme, so we decided that there was no cooler topic to focus on than dinosaurs!

What it does

Dinologue offers insightful information on three time periods, a dinosaur chatbot named Atticus that can vocally answer your most curious dinosaur questions, and artsy 3D graphics to ensure an immersive experience.

How we built it

We build our application on the Next.js framework, using Tailwind CSS and daisyUI for the frontend, and leveraged OpenAI NLP and ElevenLabs text-to-speech models on the backend. Additionally, we built an interactive 3D model via Blender.

Challenges we ran into

Configuring the models to our niche needs took a lot of effort, as well as displaying the 3D model to the user. For many of us, it was our first time utilizing the technologies mentioned above, so there was a substantial learning curve overall.

Accomplishments that we're proud of

We are proud of how well we were able to divide the project into individual deliverables. A lot of communication and teamwork was needed to make sure everyone's code was combined seamlessly, and that iterative process is what made this hackathon experience both fulfilling and enjoyable.

What we learned

We gained an understanding of full-stack web development fundamentals and explored various effective tools that complemented that process.

What's next for Dinologue

There are many exciting ideas for Dinologue! We believe we can build an even more immersive experience by including user prompts directly within the static web pages. That is, instead of rendering all of the information of a time period at once, we would divide the sections and allow for user interaction directly. Additionally, we were thinking about implementing a timeline so that users can view how far along they are, and include progress information to allow users to recall what topics they have covered. Most importantly, we believe this template for learning can be applied to various topics, which is our main takeaway from this project!

Built With

  • blender
  • daisyui
  • elevenlabs
  • next.js
  • openai
  • tailwindcss
Share this project:

Updates