Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This web application is an e-commerce platform designed for selling mobile phones, inspired by the Shopee marketplace. The application will provide users with a seamless shopping experience, allowing them to browse, compare, and purchase mobile devices easily.

## CORE FEATURES
1. **User Authentication**: Users can create accounts, log in, and manage their profiles securely.
2. **Product Listings**: A clean, categorized display of mobile phones with images, specifications, and pricing.
3. **Search and Filter Options**: Users can quickly find products using search functionality and apply filters based on brand, price range, and other specifications.
4. **Shopping Cart**: Users can add products to their cart, view the cart, and proceed to checkout with a streamlined process.
5. **Order Management**: Users can view order history and track the status of their purchases.
6. **Responsive Design**: The application will be fully responsive, ensuring a seamless experience across all 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.
- **Layout**: A grid layout for product listings, with a sidebar for filters. The header will include navigation links and a search bar, while the footer will contain contact information and links to policies.
- **Typography**: Use a modern sans-serif font for headings (e.g., Montserrat) and a readable serif or sans-serif font for body text (e.g., Lato). Ensure a clear hierarchy with different font sizes and weights for headings, subheadings, and body text.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS for efficient styling and responsive design.
- **UI Components**: Utilize shadcn/ui for pre-built components to ensure consistency and save development time.
- **State Management**: Use context API or Redux for managing global state, particularly for the shopping cart and user authentication.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript and configure Tailwind CSS.
2. **Design Layout**: Create a basic layout structure using Tailwind CSS to ensure responsiveness.
3. **Develop Authentication**: Implement user authentication using a service like Firebase or JWT for secure login and registration.
4. **Create Product Listing Page**: Build the product listing component with the necessary filtering and search functionalities.
5. **Implement Shopping Cart**: Develop the shopping cart functionality, allowing users to add, remove, and modify product quantities.
6. **Set Up Order Management**: Create components for users to view their order history and track their purchases.
7. **Test Responsiveness**: Ensure the application is fully responsive across various devices and screen sizes.
8. **Deploy Application**: Deploy the application using a platform like Vercel or Netlify for public access.

## USER EXPERIENCE
Users will experience a straightforward and intuitive interface. They can easily search for mobile phones, view detailed product information, and add items to their cart. The authentication process will be quick, allowing users to log in seamlessly. The checkout process will be optimized to minimize steps, ensuring a smooth transition from browsing to purchasing. The design will focus on clarity and ease of navigation, enhancing overall user satisfaction.