A fantasy-themed platform for self-reflection and goal tracking built by Vincent Do, Sengdao Inthavong, Richard Yang, and Sreyansh Mamidi at HackIllinois 2024.
Our inspiration for Serenitree sprang from a simple, yet profound realization: personal growth and goal achievement are akin to nurturing a living organism. We envisioned a platform where users could visualize their progress and achievements as the growth of a magical tree, making the journey towards personal goals both visually rewarding and emotionally engaging. This concept aims to motivate users by providing them with a serene and immersive environment to reflect on their achievements and learn from their experiences.
Serenitree is a fantasy-themed mobile application that allows users to set personal goals and track their completion. Each goal is represented as a quest for the user's magical tree, which grows and thrives as tasks are accomplished. At the end of each week, users reflect on their progress, marking goals as completed or pending, and write a short reflection on their experiences. This process not only promotes accountability, but also encourages users to celebrate their victories and learn from challenges.
Serenitree was brought to life using a modern tech stack that includes TypeScript, React, and Hono.js for serverless functions, Next.js for server-side rendering, Tailwind CSS for styling, Postman for API testing, GitHub for version control, JavaScript and Node.js for the backend, PostgreSQL for our database, and AWS for hosting. This combination allowed us to create a responsive, user-friendly interface, as well as a scalable backend infrastructure capable of handling user data securely and efficiently.
Integrating the diverse set of technologies was our primary challenge, especially ensuring seamless communication between the frontend, the backend, and the database. Additionally, implementing the tree growth animation to reflect real-time user progress required creative coding solutions and optimizations to ensure smooth performance across devices.
We are proud of developing a fully functional prototype within the limited timeframe, which not only meets our initial vision but also provides a solid foundation for future enhancements. The user interface is intuitive and visually appealing, thanks to Tailwind CSS and React. Our backend, built with Node.js and PostgreSQL, efficiently manages user data, ensuring a smooth and secure user experience. The magical tree animation, which grows with user achievements, stands as a testament to our team's creativity and technical skills.
This project was a tremendous learning opportunity for our team. We gained hands-on experience integrating various technologies and frameworks, deepening our understanding of full-stack development. Working under time constraints honed our problem-solving skills and taught us the importance of effective communication and teamwork. Additionally, we learned about the psychological aspects of gamification and its potential to motivate and engage users.
Looking forward, we plan to enrich Serenitree with more features, such as social elements that allow users to share their trees and achievements with friends, enhancing motivation through community support. We aim to implement AI-driven insights to offer personalized goal-setting advice and motivational tips. Expanding the ecosystem with more themes, quests, and rewards will make the user experience even more engaging. Ultimately, our vision is to see Serenitree evolve into a platform that not only helps users achieve their goals, but also fosters a community of growth and support.