MindGPS
A mental wellness app where people map emotions as a branching diagram instead of collapsing a day into one mood score.
Team project note: A four-person team project. Cierra and Ayanna built the backend; Andre worked on frontend and the community feature. The work described below is Andy's.
Overview
Context
MindGPS is a mental wellness web application built by a four-person team. Andy was one of two frontend developers and owned the frontend's integration with the backend.
The problem
What it needed to solve
Most mood trackers flatten a complicated day into a single number. It is easy to store and almost useless to reflect on a month later.
An emotion wheel based on Robert Plutchik's model feeds a visual concept map, so a check-in becomes a set of connected feelings with reasons attached rather than a rating.
Contribution
My role in the work
- Built the frontend design system the rest of the team worked from — the shared card, button, and input components, plus the theme layer that replaced the starter styles.
- Integrated Firebase Authentication into the React frontend: auth context and provider, protected app flow, session persistence across refresh, and sign-out.
- Wrote the frontend API layer connecting journal entries to the Express and MongoDB backend, passing Firebase ID tokens for per-user access.
- Connected the concept map to its backend so maps persist between sessions.
- Designed and built the emotion wheel check-in flow, and the Burn Book — a venting space that deliberately saves nothing.
- Traced a CORS misconfiguration that was blocking the team from testing against the API, and fixed it in the server config.
Decisions
Key decisions
- Used Plutchik's emotion wheel instead of a mood slider, so a check-in captures several named feelings and how they relate — data that is worth revisiting later.
- Kept journaling and the Burn Book separate. Reflection you keep and venting you want gone are different needs, and sharing one interface would have compromised both.
- Built shared components before feature screens, so four people adding features wouldn't produce four visual languages.
- Replaced emoji with icon components across the UI, avoiding inconsistent cross-platform rendering.
Implementation
How it was built
- React 18 and TypeScript frontend styled with Tailwind CSS.
- Firebase Authentication for identity; Express and MongoDB for application data, with routes protected by verified ID tokens.
- Concept maps stored as positioned, linked nodes, cached locally so the canvas stays responsive while syncing.
Outcome
What exists today
A deployed application with authentication, persistent journaling, and the emotion-mapping check-in working end to end.