home page with mood trackers, health AI powered assistant
Landing page
support groups chat groups where users can also chat with proffesionals
Appointments page for ongoing, cancelled and pending appointments

Project Story: Mind Harmony - A Mental Health Management System

Inspiration

The inspiration for Mind Harmony came from the growing need for accessible and effective mental health resources. With the increasing awareness of mental health issues, there is a significant demand for tools that can help individuals manage their mental well-being. We aimed to create a platform that not only provides valuable information but also offers practical tools and activities to support mental health.

What it does

Mind Harmony provides a comprehensive suite of tools and resources designed to help users manage their mental health. The platform includes a mood tracker, mental health articles, helpful videos, stress reduction tools, and guided exercises for mindfulness, cognitive-behavioral therapy (CBT), mindful eating, and self-care routines. By offering a variety of resources, Mind Harmony aims to cater to different aspects of mental wellness.

How we built it

Mind Harmony was built using a combination of modern web development technologies:

Frontend: We used React and Next.js to create a responsive and interactive user interface. This allowed us to leverage server-side rendering for better performance and SEO.
Styling: We utilized SCSS for styling our components, ensuring a consistent and visually appealing design.
Images: The Next.js Image component was used for optimized image handling and loading.
Version Control: Git and GitHub were used for version control, facilitating collaboration and code management.
Deployment: The project was deployed on Vercel, taking advantage of its seamless integration with Next.js for efficient build and deployment processes.

Challenges we ran into

Throughout the development of Mind Harmony, we encountered several challenges:

Handling Unescaped Entities: One of the issues we faced was ensuring that all entities in our JSX code were properly escaped to avoid rendering errors and comply with linting rules.
User Experience Design: Designing an interface that is both functional and aesthetically pleasing required multiple iterations and user feedback to get right.
Deployment Issues: We ran into some deployment errors related to our build process, which required debugging and optimizing our codebase to ensure a smooth deployment on Vercel.
Balancing Features and Simplicity: Striking the right balance between offering a comprehensive set of features and maintaining a simple, user-friendly interface was a constant challenge.

Accomplishments that we're proud of

We are proud of several accomplishments with Mind Harmony:

Comprehensive Resource Collection: Successfully integrating a wide range of mental health resources into a single platform.
User-Friendly Design: Creating an intuitive and engaging user interface that enhances the overall user experience.
Effective Tools: Developing practical tools that users can actively use to manage their mental health, such as the mood tracker and stress reduction exercises.
Seamless Deployment: Overcoming deployment challenges to ensure the platform is stable and accessible to users.

What we learned

Through this project, we learned a great deal about the various aspects of mental health and the importance of a holistic approach to mental wellness. We delved into research on anxiety, depression, stress management, and mindfulness. Additionally, we gained valuable insights into user experience design, ensuring our platform is user-friendly and engaging. On the technical side, we honed our skills in web development, particularly in using React and Next.js for building responsive and dynamic applications.

What's next for Mind Harmony

We have several exciting plans for the future of Mind Harmony:

Mobile App Development: Expanding the platform to include a mobile app for easier access and on-the-go use.
Community Features: Introducing community features such as forums and support groups to foster a sense of connection among users.
Personalization: Enhancing personalization features to tailor content and resources to individual users' needs.
Additional Resources: Continuously updating the platform with new articles, videos, and tools based on user feedback and emerging mental health research.

Despite the challenges, we are proud of what we have accomplished with Mind Harmony. Our platform aims to make a positive impact on individuals' mental health by providing them with the resources and tools they need to manage their well-being effectively.

Built With

Submitted to

DeKUT Hack

Created by

Being part of the frontend team, I worked on various UI components which were integrated with the backend for a seamless user experience.

Brian Mwaura
I worked on the backend wherby i got my first real world test in creating api endpoints using djangorest framework

SAMWEL MUGO
Backend development

WALTER ONYANGO
BACKEND DEVELOPMENT, AI/ML
I worked on the chat functionality backend where I used Node.js, Express.js, MongoDB and Socket.io to set up live chat endpoints.
It was a great challenge and a wonderful learning experience.

Clint Simiyu
I worked d on the frontend.It was my first time participating in a hackathon. I worked using next js with Typescript and sassy css. The experience was uplifting and taught me alot.

@BrianChege