Built with ❤️ &
The inspiration behind InnerYou came from the desire to create a digital space that promotes emotional well-being. In today's fast-paced world as students, we often neglect our mental and emotional health. InnerYou aims to address this by offering a platform where users can nurture and explore their emotions and well-being through a variety of features. We also acknowledge that due to circumstances and poor mental health, functioning daily tasks everyday can be hard. Thus, our web app strives to provide motivation for users to stay active and functioning in their lives in an attempt to improve their mental health and quality of life.
As a general overview, users can talk to InnerYou’s chatbot and be provided with a list of activities daily catered specifically on their mood. The user can then complete the to-do list and update the progress bar, also accomplishing streaks if all tasks are completed daily. The more tasks completed, the happier the player character will look. It is meant to resemble the user’s mood and mental health. The web app always has the chatbot ready to talk if the user wants to express their emotions or they can express their feelings through writing in InnerYou’s journal. InnerYou strives to provide incentive to complete tasks in the form of achieving streaks and seeing a happier character.
Taking a deeper dive InnerYou is a web app designed to enhance users' emotional well-being. It offers three core features:
-
Emotion-Based Activity Recommendations: Users can express their current thoughts, and InnerYou's chatbot will suggest a few activities tailored to their feelings. Whether someone is feeling stressed, happy, sad, or anxious, InnerYou provides suggestions to improve their mood.
-
To-Do List: Users can create and manage their to-do lists directly within the app. This feature helps users stay organized and focused on their tasks and responsibilities. For every task completed, the progress bar increases.Each day that the user completes all their tasks, they get a streak running.
-
Personal Journal: InnerYou allows users to maintain a digital journal where they can reflect on their thoughts, emotions, and experiences. It's a safe and private space for self-expression and self-discovery.
InnerYou was built using a combination of front-end and back-end technologies. Here's an overview of our tech stack:
-
Design: The web pages were designed using Figma to ensure a user-friendly and captivating interface. We also used a variety of plugins such as Iconify, Blobs, and Beautiful Shadows.
-
Front-end: We leveraged a combination of React, TailwindCSS, HTML5, CSS3, and JS to create a responsive and user-friendly interface.
-
Back-end: Our back-end is powered by Node.js and Express.js, providing a robust and scalable server infrastructure.
-
APIs: The emotional intelligence of our assistant was enhanced through the integration of TwinwordAPI, whereas Cohere's LLM Co.Generate allows us to generate a list of activities based on the detected emotion and curated prompts.
-
Summary: Figma, Figma Plugins, React, TailwindCSS, HTML5, CSS3, JS, Node.js, Express.js, integration of TwinwordAPI and Cohere's LLM Co APIs.
-
Design Integration: We faced difficulties in implementing design elements to create web pages that were both visually appealing and user-friendly. Collaborating on merging diverse design components posed difficulties among team members, especially when every team member had no prior experience with Figma.
-
Backend: This is also everyone’s first time using Node and Express, so much of our time was used in reading documentations and getting familiar with new syntaxes. Some of the problems we encountered include fetching, CORS issues, and communicating with the APIs.
-
Frontend: A few members are new to React and TailwindCSS, so we decided to invest some time in learning the basics. We also spent a lot of time figuring out how communication between the frontend and backend works. There were also issues with how the designs were rendered in the web app, which required a lot of tweaking. Alignments also proved to be tedious at times. .
-
Collaboration: We decided on using Git version control to collaborate and experienced a few merge conflicts along the way.
Despite the challenges, we're proud of several accomplishments:
-
Successfully incorporating the TwinWord API and Co.Generate into our code despite encountering hundreds of errors.
-
Mastered new technologies like Figma, React, TailwindCSS, Node.js, Express.js, despite having no prior experience, all within a mere 36 hour timeframe.
-
Custom creating the characters for the web app was very fun and we’re happy with how cute they turned out 🙂
-
Creating a visually appealing design and following it throughout the project
During the development of InnerYou, we learned many valuable things:
-
API Functionality: From having just basic web development skills, we learned how APIs function, how to troubleshoot, and how to integrate it within the code.
-
Text Generation: Exploring Co.Generate from Cohere broadened our horizons in text generation, enabling us to provide insightful and engaging content to our users.
-
Utilising Databases: Due to time constraints, we were not able to store data efficiently. We are hoping to leverage databases like MongoDB in the future.
-
Community Building: Building a community platform within InnerYou, where users can connect, share experiences, and support each other.
-
Chatbot: We would like to improve our chatbot functionality from a one-way conversation where it just gives you activities to a more interactive conversation.
-
Characters: We would like to add more character emotions and emotion changing functionality as well as a way to customise your character.