Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
EL ADN CROMÁTICO is a web application that applies psychology to coding, focusing on how color influences user experience in a fitness setting. It features a streamlined interface for gym members to register, track workouts, and interact with staff, all while leveraging color psychology to enhance usability and engagement.

## CORE FEATURES
1. **User Registration Flow**: A simplified sign-up process for new users, allowing them to create accounts with essential information and set up security PINs.
2. **Daily Check-In**: A streamlined check-in system for existing users where they can authenticate their identity and receive feedback on their payment status.
3. **Training Dashboard**: A central hub for users to track workouts, view exercise routines with animated GIFs, and check off completed exercises.
4. **Instructor Management Panel**: A tool for instructors to manage student lists, create workout routines using a drag-and-drop interface, and update in real time.
5. **Admin Analytics Dashboard**: Provides insights into user attendance, financial metrics, and quality control measures based on student feedback.
6. **Glow Store**: An e-commerce section where users can browse and purchase fitness products seamlessly through a direct WhatsApp integration.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist with a clean, simple design that prioritizes white space and a limited color palette. Emphasizes typography for clarity and usability.
- **Color Mode**: Light theme with dark text on light backgrounds to ensure readability and a sense of openness.
- **Layout**: 
  - Main layout consists of a clean top navigation bar with logo and links to core features.
  - A sidebar for quick access to functionalities like the training dashboard, check-in, and store.
  - Content areas are divided into clear sections with ample spacing, promoting a smooth flow of information.
- **Typography**: 
  - Primary Font: Sans-serif typeface (e.g., Inter or Roboto) for readability.
  - Hierarchy: 
    - Headings (h1, h2): Bold and larger sizes to denote importance.
    - Body text: Regular weight, medium size for readability.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for robust type checking and component management.
- **Styling**: Tailwind CSS for rapid, responsive styling with a utility-first approach.
- **UI Components**: Utilize shadcn/ui for pre-built components that align with the minimalist design.
- **State Management**: Implement Zustand or React Context API for effective state management across components.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript and install Tailwind CSS and shadcn/ui.
2. **Create Main Layout**: Design the main layout structure with a top navigation bar and sidebar using Tailwind CSS for styling.
3. **Implement User Registration**: Develop the user registration flow including form validation and PIN setup, ensuring a clean UI experience.
4. **Develop Daily Check-In System**: Build the check-in interface where users input their DNI and authenticate with their PIN.
5. **Construct Training Dashboard**: Create the dashboard displaying personalized workout routines, integrating animated GIFs for exercises, and checkboxes for user progress tracking.
6. **Build Instructor and Admin Panels**: Implement management tools for instructors and admins to track users, manage routines, and analyze performance metrics.
7. **Design Glow Store**: Set up the e-commerce functionality, ensuring a seamless browsing experience and direct WhatsApp purchasing option.

## USER EXPERIENCE
The application is designed to offer a smooth user journey from registration to workout tracking. New users will find the sign-up process intuitive, with clear prompts and feedback along the way. Active users will enjoy a dynamic dashboard that reflects their workout history and progress, encouraging them to stay engaged. Instructors and admins can efficiently manage operations with user-friendly panels that provide real-time updates, ensuring that the experience is cohesive and seamless across all user roles. 

This application aims to create an engaging and visually stimulating environment that enhances user motivation and satisfaction through thoughtful design and color psychology.