Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This web application is designed for the analysis and organization of karyotypes, allowing users to upload images of disordered chromosomes. The app will automatically identify and pair the chromosomes, highlighting potential numerical and structural anomalies using AI-driven analysis. It aims to streamline the karyotyping process for researchers and healthcare professionals.

## CORE FEATURES
1. **Image Upload**: Users can easily upload images of karyotypes, with support for common image formats.
2. **Automated Chromosome Sorting**: The application utilizes AI to detect and sort chromosomes into their correct pairs.
3. **Anomaly Detection**: The app analyzes the organized karyotype and identifies potential anomalies in number and structure.
4. **Visual Representation**: Users can view a clear visual representation of sorted chromosomes alongside identified anomalies.
5. **Downloadable Reports**: Users can generate and download detailed reports of the analysis for further review or documentation.
6. **User Account Management**: Allows users to create accounts to save their analysis history and access it later.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist, featuring a clean and simple design with ample white space for better focus on content.
- **Color Mode**: Light theme with dark text on light backgrounds to ensure readability and a modern aesthetic.
- **Layout**: 
  - A top navigation bar for easy access to different sections (Upload, Analysis, Reports).
  - A main content area divided into two sections: the image upload area and the results display area.
  - A sidebar for user account options and navigation links.
- **Typography**: 
  - Primary font: Sans-serif (e.g., Roboto or Open Sans) for clear readability.
  - Font sizes: Larger headings for section titles, medium for subheadings, and standard size for body text.
  - Consistent spacing for line height to enhance readability.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for type safety and improved developer experience.
- **Styling**: Tailwind CSS for utility-first styling and rapid design iteration.
- **UI Components**: shadcn/ui for pre-built components that align with the minimalist design principles.
- **State Management**: Use React Context API or Zustand for managing global state across the application.

## IMPLEMENTATION STEPS
1. **Set Up Development Environment**: Initialize a new React project using Create React App with TypeScript.
2. **Install Required Dependencies**: Install Tailwind CSS and shadcn/ui for styling and UI components.
3. **Create Core Components**:
   - Develop the image upload component allowing file selection and preview.
   - Implement the sorting and anomaly detection features using a pre-trained AI model.
   - Build the results display component to show sorted chromosomes and identified anomalies.
4. **User Authentication**: Set up user account management functionalities, allowing sign-up, login, and profile management.
5. **Report Generation**: Integrate functionality to generate downloadable reports based on the analysis results.
6. **Responsive Design**: Ensure that the application is fully responsive, adjusting layout and components for various screen sizes.
7. **Testing**: Conduct thorough testing of all features, focusing on image uploads, AI analysis accuracy, and overall user experience.
8. **Deployment**: Deploy the application on a hosting platform (e.g., Vercel or Netlify) for public access.

## USER EXPERIENCE
Users will begin by uploading an image of their karyotype via the intuitive upload interface. Once the image is processed, the app will automatically sort the chromosomes, presenting them in pairs. Users can easily navigate to the results area to see identified anomalies highlighted, with options to generate reports or save their analysis history. The minimalist design ensures that users can focus on their work without unnecessary distractions, facilitating a smooth and efficient workflow.