Greatful & Grounded

Breaking stigma with AI, Grateful & Grounded blends empathy and tech to bridge silence in ignored communities. From cat-themed AI venting to shared journals, we empower youth to find their voice.

Comment

Inspiration

Our mission is inspired by mindfulness and mental health awareness, focused on encouraging young people to express and manage their mental health in their own language, context, and voice.

Our design was inspired by glassmorphism (frosted glass effects with soft shadows), pastel gradients (gentle blues, purples, pinks, and yellows), friendly mascots (cat icons on the central hub and in various other animations), and a minimalist UI. These design practices allowed our website to look clean and clutter-free, allowing us to prioritize user experience and stability.

What it does

There, they can access a variety of mental health tools that come in different forms: Affirmations, Journal, Doodle, Diary Entry, Play Games, and AI Chatbox. Each node opens into a focused space for a calm, relaxing way to declutter their mind.

Affirmations: A dedicated space to rewire your mindset and practice self-compassion. This page provides daily positive affirmations and empowering statements designed to ground you in the present moment, meant to guide you through your journey of personal growth.

Journal: A place to explore the 'why' behind your day. There are short prompts available to help you start writing and simple mood tags to see growth over a long time period. Share how you're feeling with others to meet like-minded people in your community about the real you. Inspire others, and grow with them!

Doodle Studio: An interactive drawing page where you can scribble, highlight thoughts, or just drag stickers around when words are too hard. Soft pastel colors and brush sizes are available along with fun elements like hearts, stars, arrows, and stickers. There is no need to save or share the pressure; it’s just for you.

Diary Entry: A private space to log the 'what' of your day, where you can record what you did, how you felt, and what tiny win you had. The ability to view your history and past entries means you can use this feature to keep track of the person you have been and are soon growing to be. Unlike the journal feature, your diary is private and unique to you.

Play Games: A collection of lighthearted, low-stress games designed to give your mind a break. Whether you need a quick distraction or a way to practice focus, these games offer a playful path to mindfulness and a gentle reset for your day. We currently have Tic Tac Toe, Minesweeper, Wordle, and Tetris featured, along with a link to coolmathgames.com, as well as the Bored button.

AI Chatbox: A cat‑themed AI agent that listens to your venting, asks soft follow‑up questions, and helps you organise messy thoughts. We have designed it to be warm and non-judgmental for sensitive topics, and it can easily be plugged into a real Gemini-powered agent. Furthermore, it remembers the conversation while you’re chatting, allowing for longer, more personalized therapy sessions. Disclaimer—this tool is purely meant to be a means of getting frustrating thoughts or conflicting ideas out of one’s mind, and in no way does it replace professional counseling sessions; seek the guidance you need from trusted individuals as well.

How we built it

First, we designed all the pages separately to establish a neat UI/UX using tools like Canva and Microsoft Whiteboard. We then wrote our code for all the pages on GitHub, using HTML and CSS. Once we were done creating the individual pages, we connected the pages to the home page. Finally, we used Gemini 3 Pro in Perplexity for polishing the code and asking for some suggestions. We used the following technologies:

HTML5 – Semantic markup CSS3 – Custom animations, glassmorphism, gradients TailwindCSS (CDN) – Utility-first styling JavaScript (Vanilla) – Interactivity and DOM manipulation Lucide Icons – Clean, modern iconography Google Fonts – Plus Jakarta Sans + Playfair Display

Challenges we ran into

We wanted to use an API key as part of our project, but it would be visible on our public GitHub repo. Everything in our front end is also sent to the user’s browser, so any user on our website can go to Developer Tools (F12), go to the Network tab, and see the exact key being used in the risk. Both of these access methods have limitations since exposing an API key, as advanced as the AI feature may be, risks account privacy and confidential billing information related to Google Cloud.

Accomplishments that we're proud of

We wanted to explore new animation features, and we got inspiration from Perplexity. These animations include the various cats on our website that “pop-up”/jump with touch, along with the colors that light up on the home page in response to a click on the main node. On the home page, hovering around the nodes makes the icons move in response, encouraging greater user-interface interactions. We are also proud of how readily accessible our website is across different browsers. Currently, it fully supports Chrome, Firefox, Safari, Edge, Opera, and Brave.

What we learned

We learned to design the interface of our website in a manner that is calming to the user. Much of our focus was built around the user experience, something we haven’t done in previous objects. For instance, integrating cat icons on virtually every page, along with building backgrounds with pleasing colors, are features designed to make the user feel safe and understood.

What's Next for Greatful & Grounded

In the future, we hope to improve our diary and journal pages by adding more features, like changing font sizes and changing font styles in the journaling section. With time, we also hope to integrate more features to the doodle page, like diversifying our color palette options and making more brush styles available, similar to other whiteboard apps and websites. Additionally, our current Game page only has external links provided, which will redirect the user to the games on other sites. However, we hope to have these games integrated onto our website soon. We also hope to add localStorage for saving journal/diary entries, implement actual AI chatbot integration (OpenAI/Gemini API), build more mini-games (memory match, breathing exercises), add a dark mode toggle, create a mobile-responsive version, export diary entries as PDF, add meditation timer feature, and enable multi-language support.

Built With

Share this project:

Updates