Aplicativo web pessoal de metas, calendário, tarefas, foco e ideias, com uma interface extremamente minimalista, sofisticada, futurista e responsiva.
Generated Prompt
```markdown # APPLICATION OVERVIEW The project is a personal web application designed for managing goals, calendar events, tasks, focus sessions, and ideas. It features a sophisticated, minimalist interface that prioritizes user experience and responsiveness across various devices, ensuring a comfortable and functional interaction regardless of screen size. # CORE FEATURES 1. **Calendar Management**: Provides a clean, minimalistic calendar interface that allows users to view monthly, weekly, and daily agendas. Users can add, edit, and delete events with ease. 2. **Task Tracking**: Users can create and manage tasks, set reminders, and mark tasks as complete. The task interface is designed for quick interaction. 3. **Goals Tracker**: A dedicated section where users can set goals, track progress with visual indicators, and manage recurring tasks. 4. **Focus Area**: Users can select focus playlists and log productivity levels throughout the day, helping them maintain concentration. 5. **Idea Repository**: A space to quickly jot down ideas, with options to prioritize and categorize them for easy retrieval. 6. **Responsive Design**: The application will adapt seamlessly to various screen sizes, ensuring a unique experience on desktop, tablet, and mobile devices. # DESIGN SPECIFICATIONS - **Visual Style**: minimalist - Clean, simple design with plenty of white space, minimal color palette, and focus on typography - **Color Mode**: Light theme with dark text on light backgrounds - **Primary Color**: #1978E5 (accent for buttons, links, highlights) - **Typography**: Use Inter from Google Fonts for headings, Inter for body text and UI elements - **Border Radius**: 8px (moderately rounded) for buttons, cards, and inputs - **Layout**: The layout will feature a sidebar for navigation on larger screens, with a top navigation bar on mobile. Key sections will include the calendar, task list, goals, focus area, and ideas, each designed to occupy ample space with negative space to enhance readability and interaction. # TECHNICAL REQUIREMENTS - **Framework**: React with TypeScript - **Styling**: Tailwind CSS - **UI Components**: shadcn/ui - **State Management**: Zustand for state management, ensuring a smooth and efficient user experience. # IMPLEMENTATION STEPS 1. **Set Up Project**: Initialize a new React project with TypeScript and install required dependencies (Tailwind CSS, Zustand, shadcn/ui). 2. **Create Layout Structure**: Design the main layout with a sidebar for navigation on larger screens and a mobile-responsive top navigation bar. 3. **Develop Calendar Component**: Implement a calendar component that allows users to view and manage their events. 4. **Build Task Management System**: Create a task manager that integrates with the calendar, allowing users to add and track tasks effectively. 5. **Implement Goals Tracker**: Design the goals section with progress indicators and options for adding/editing goals. 6. **Create Focus Area**: Build the focus area for managing productivity sessions and playlists, integrating with external music platforms if necessary. 7. **Develop Idea Repository**: Implement a straightforward interface for users to quickly jot down and manage their ideas. 8. **Ensure Responsiveness**: Test and refine the application for various screen sizes, making adjustments to layouts as needed. 9. **Focus on Accessibility**: Implement accessibility features, ensuring keyboard navigation, adequate contrast, and semantic HTML. 10. **Conduct User Testing**: Gather feedback from users to identify areas for improvement and iteratively enhance the user experience. # USER EXPERIENCE The application will facilitate intuitive user interactions with minimal clicks required to perform actions. Users will navigate between sections using a responsive sidebar or top navigation, with smooth transitions and micro-interactions enhancing the overall experience. The focus will be on maintaining a clean interface where every element serves a purpose, minimizing distractions and fostering productivity. ```
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!
