Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This application is an e-commerce platform for a modern store specializing in women's bags, wallets, and caps. The main purpose is to provide a seamless shopping experience, featuring a clean and user-friendly interface that highlights products while ensuring easy navigation.

## CORE FEATURES
1. **Product Categories**: Organized sections for bags, wallets, and caps, allowing users to filter products by category with ease.
2. **Full-Width Map Layout**: A visually engaging layout that optimizes product display across all screen sizes.
3. **Product Filtering System**: Advanced filters for users to sort products by category, type, and price, enhancing the shopping experience.
4. **Responsive Design**: Ensures that the application is fully functional on all devices, maintaining a minimalist aesthetic and user-friendly interface.
5. **User Registration Form**: A streamlined sign-up process for users to create accounts and receive newsletters.
6. **Structured Footer**: Includes essential information such as contact details, social media links, privacy policies, and return policies, ensuring transparency and accessibility.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist - Emphasizes a clean, simple design with abundant white space, ensuring that products stand out while maintaining focus on typography.
- **Color Mode**: Light theme with dark text on light backgrounds, promoting readability and a modern aesthetic.
- **Layout**: 
  - **Header**: Simple navigation bar with logo, links to product categories, and a search bar.
  - **Slider**: Featured products or promotions in a large, visually appealing slider at the top.
  - **Main Content**: Grid layout for product display with categories easily accessible.
  - **Footer**: Well-structured with clear sections for contact, policies, and social media.
- **Typography**: 
  - Primary font: Sans-serif for modernity and easy legibility (e.g., Montserrat or Open Sans).
  - Font hierarchy: Use larger sizes for headings, medium for subheadings, and regular for body text to establish a clear visual hierarchy.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS for utility-first styling and responsive design.
- **UI Components**: Utilize shadcn/ui for pre-designed components that align with the minimalist aesthetic.
- **State Management**: Use React Context or Redux for managing global state if needed.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript and install Tailwind CSS.
2. **Create Layout Components**: Build header, footer, and main content components following the specified design.
3. **Implement Routing**: Set up React Router for navigating between different pages (Home, Shop, About Us, Contact).
4. **Design Product Filtering**: Create a filtering component that updates the product display based on user selection.
5. **Add Product Display**: Implement a grid layout to display products dynamically fetched from a mock API or database.
6. **Responsiveness**: Utilize Tailwind's responsive utility classes to ensure the layout adapts across devices.
7. **Testing and Debugging**: Conduct thorough testing on various devices and browsers to ensure functionality and responsiveness.

## USER EXPERIENCE
Users will enter the site greeted by a sleek header and a prominent slider showcasing featured products. Navigation is intuitive, allowing users to quickly browse categories. The filtering system enables them to refine their search, while the minimalist design keeps distractions to a minimum. Users can easily register via a simple form and access essential information in the footer at any point, enhancing their overall experience. The application’s responsiveness ensures that it remains functional and visually appealing on any device.