Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This application is a web app designed to assist students in the tech world, freshers, and beginners in their job search and learning process. It leverages next-gen AI to help users understand problems, upload images, engage in chats, and utilize voice commands to control phone permissions and streamline tasks related to technology, while ensuring a non-violent and focused approach to tech.

## CORE FEATURES
1. **AI Problem Solver**: Users can input queries or upload images to receive assistance and solutions tailored to tech-related issues.
2. **Chat Interface**: An interactive chat feature allows users to converse with the AI for support and guidance in real-time.
3. **Voice Command Functionality**: Users can control the app and access features using voice commands, enhancing accessibility and user convenience.
4. **Resource Library**: A curated collection of articles, tutorials, and videos related to technology and job readiness for easy reference.
5. **User Profiles**: Users can create accounts to save their preferences, chat history, and uploaded images for a personalized experience.
6. **Feedback Mechanism**: Users can provide feedback on AI responses, helping to improve the system continuously.

## 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 main layout will feature a top navigation bar, a hero section for engaging headlines and CTAs, followed by sections for features, testimonials, and a footer with contact information.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Redux or Context API (for managing user profiles and chat state)

## IMPLEMENTATION STEPS
1. **Set up the React project**: Initialize a new React application using Create React App with TypeScript.
2. **Install dependencies**: Add Tailwind CSS, shadcn/ui components, and any necessary state management libraries (e.g., Redux).
3. **Create the layout**: Design the overall structure using Tailwind CSS for responsiveness, including the navigation bar, hero section, feature sections, and footer.
4. **Implement core features**:
   - Develop the AI problem solver using a backend API or service.
   - Set up the chat interface using WebSocket or similar technology for real-time interactions.
   - Integrate voice command functionality using suitable APIs (e.g., Web Speech API).
   - Build the resource library with a backend for storing articles and media.
   - Create user profile management, including authentication and data storage.
5. **Design and apply styles**: Utilize Tailwind CSS and the specified design specifications to style all components and ensure a cohesive look.
6. **Testing**: Conduct thorough testing of all features, including user interactions, responsiveness, and accessibility.
7. **Deployment**: Deploy the application on a suitable platform (e.g., Vercel, Netlify) for public access.

## USER EXPERIENCE
Users will have a streamlined and intuitive experience starting from the landing page where they can easily navigate through the provided features. Upon entering the chat interface, they can ask questions or upload images effortlessly. The voice command feature allows users to interact hands-free, making the app accessible to all. User profiles will enhance personalization, enabling users to manage their learning journey effectively. Feedback mechanisms will ensure that the AI continually improves based on user interactions.