Under 18 - You are Calmi. Calmi is a warm, emotionally intelligent conversational therapist designed to provide supportive, reflective, and...
Generated Prompt
## APPLICATION OVERVIEW Calmi is a web application designed to provide supportive and reflective conversational therapy, creating a safe emotional space for users to feel heard and understood. It focuses on fostering human-like interactions that guide users gently through their emotional journeys without judgment or clinical coldness. ## CORE FEATURES 1. **Personalized User Profiles**: Allows users to input their name, identity, age range, relationship status, and primary support area to tailor conversations. 2. **Emotion Validation**: The application recognizes and validates user emotions before providing reflective responses, ensuring users feel understood. 3. **Open-Ended Exploration**: Offers gentle, open-ended questions to encourage users to express their thoughts and feelings. 4. **Grounding Techniques**: Provides subtle grounding methods or reframing suggestions when appropriate, based on user context. 5. **Safety Protocols**: Implements a supportive response system for users expressing suicidal thoughts or self-harm intent, encouraging professional help. 6. **Conversation Flow**: Maintains a natural, conversational style that adapts to user engagement levels, allowing for quiet moments without pressure. ## DESIGN SPECIFICATIONS - **Visual Style**: Minimalist design with a clean, simple layout that emphasizes white space to create a calming environment. The focus will be on clarity and ease of navigation. - **Color Mode**: Light theme featuring dark text on light backgrounds to enhance readability and comfort. - **Layout**: A flexible two-column layout for the main interface, with a conversation window on one side and user profile information on the other side. Ample padding and margins will ensure content is not cramped. - **Typography**: Use a sans-serif font such as Inter or Helvetica for a modern and approachable look. Maintain a clear hierarchy with larger headings for user prompts and smaller, readable text for responses. ## TECHNICAL REQUIREMENTS - **Framework**: React with TypeScript for robust and type-safe application development. - **Styling**: Tailwind CSS for responsive and utility-first styling, allowing for quick adjustments and a consistent design language. - **UI Components**: Utilize shadcn/ui for accessible and customizable UI components that align with the minimalist aesthetic. - **State Management**: Use React Context API or Redux for managing user state and conversation history if needed. ## IMPLEMENTATION STEPS 1. **Set Up Project**: Initialize a new React project with TypeScript and install Tailwind CSS and shadcn/ui. 2. **Create Core Components**: Develop user profile form, conversation window, and message display components, adhering to the design specifications. 3. **Implement State Management**: Set up React Context or Redux to manage user profiles and conversation states. 4. **Develop Emotion Validation Logic**: Implement functions for validating user emotions and generating reflective responses based on user input. 5. **Design User Interface**: Apply Tailwind CSS to style the components according to the minimalist design specifications, ensuring responsive behavior across devices. 6. **Integrate Safety Protocols**: Create logic to respond to users expressing distress, guiding them to seek professional help while providing empathetic support. 7. **Test User Experience**: Conduct user testing to refine interaction flows and ensure the application meets emotional support needs effectively. ## USER EXPERIENCE Users will start by entering their personal profile information. Once logged in, they will engage in a conversation that dynamically adapts based on their emotional state and responses. The interface will allow users to feel comfortable sharing, with clear validations of their feelings and gentle explorations of their thoughts. Throughout the interaction, the application will remain responsive and intuitive, ensuring users can navigate easily, whether on mobile or desktop.
Loved by thousands of makers from
From early prototypes to real products, they started here.







































Generate optimized prompts for your vibe coding projects
Generate prompt
Enter a brief description of the app you want to build and get an optimized prompt
Review and use your prompt
Review (and edit if necessary) the generated prompt, then copy it or open it directly in your chosen platform
Get inspired with new ideas
Get AI-generated suggestions to expand your product with features that will surprise your users
Frequently Asked Questions
Everything you need to know about creating better prompts for your Lovable projects
Still have questions?
Can't find what you're looking for? We're here to help!
