A Mood-Tracking App That Turns Your Emotions into Art
MoodMosaic is a unique app that blends mental health tracking with creative expression. Built with React Native and Expo, it allows users to log their daily emotions and transforms them into beautiful, personalized digital art pieces. Whether it's a mosaic, painting, or animation, MoodMosaic turns your emotional journey into a visual masterpiece.
- Daily Mood Logging: Easily log your mood each day with a simple and intuitive interface.
- Emotion-Based Art Generation: The app creates unique digital art (e.g., mosaics, paintings, animations) based on your mood data.
- Mood Mosaic Timeline: Visualize your emotional journey over weeks or months with a stunning "mood mosaic."
- Therapeutic & Engaging: Combines mental health awareness with creativity, making self-reflection both meaningful and enjoyable.
- Customizable Art Styles: Choose from various art styles to personalize your mood art.
MoodMosaic is more than just a mood tracker—it's a creative companion that helps you understand and express your emotions in a visually captivating way. By turning your feelings into art, MoodMosaic makes mental health tracking a fun and rewarding experience.
- React Native: A powerful framework for building cross-platform mobile apps.
- Expo: A toolchain that simplifies React Native development with built-in features like hot reloading and easy deployment.
Here’s an overview of the project structure:
MoodMosaic/
├── android/ # Android-specific files (auto-generated by Expo)
├── assets/ # Contains images, icons, fonts, and other static files
├── app/ # Main app directory (Expo Router structure)
│ ├── (tabs)/ # Tab-based navigation (optional, if using tabs)
│ │ ├── index.tsx # Main tab navigator
│ │ ├── mood.tsx # Mood logging screen
│ │ └── gallery.tsx # Art gallery screen
│ ├── _layout.tsx # Root layout for the app (shared styles, navigation container)
│ ├── index.tsx # Entry point for the app (home screen or initial route)
├── components/ # Reusable UI components (e.g., buttons, cards)
├── constants/ # Constants (e.g., colors, API endpoints)
├── hooks/ # Custom React hooks
├── scripts/ # Utility scripts (e.g., build scripts)
├── .expo/ # Expo-specific configuration files
├── .gitignore # Specifies files to ignore in version control
├── app.json # Expo app configuration
├── babel.config.js # Babel configuration
├── expo-env.d.ts # TypeScript environment declarations for Expo
├── package.json # Dependencies and project metadata
├── package-lock.json # Lockfile for dependencies
├── README.md # Project documentation
├── tsconfig.json # TypeScript configuration
└── metro.config.js # Metro bundler configuration (if needed)
- Log Your Mood: Open the app daily and select your current mood (e.g., happy, sad, calm, excited).
- Generate Art: The app uses your mood data to create a unique piece of digital art.
- Explore Your Mood Mosaic: Over time, your mood entries are compiled into a visual timeline, showcasing your emotional journey.
- Reflect & Share: Use your mood art as a tool for self-reflection or share it with others to spread awareness about mental health.
To run MoodMosaic locally, follow these steps:
-
Clone the Repository:
git clone https://github.com/your-username/MoodMosaic.git
-
Install Dependencies:
cd MoodMosaic npm install -
Run the App:
expo start
-
Launch on Your Device:
- Use the Expo Go app on your mobile device to scan the QR code displayed in the terminal.
- Alternatively, run the app on an emulator or simulator.
We welcome contributions! If you'd like to help improve MoodMosaic, please follow these steps:
- Fork the repository.
- Create a new branch for your feature or bug fix.
- Submit a pull request with a detailed description of your changes.
MoodMosaic is licensed under the MIT License. See LICENSE for more details.
Turn your emotions into art with MoodMosaic—where mental health meets creativity! 🎨✨