Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
ImpulsaIngreso is a robust Single Page Application (SPA) designed for an educational SaaS platform targeting B2B2C markets. The application enables institutions to upload student assessment data and provides a dashboard for students to access their performance analytics while ensuring data integrity and a seamless user experience.

## CORE FEATURES
1. **Public Onboarding View**: Features a hero section with a compelling headline and dual CTAs, plus benefits displayed in a grid format, allowing potential users to easily understand the platform's value.
2. **Admin Dashboard**: A comprehensive interface for educational institutions, featuring KPI cards, a drag-and-drop mass upload tool, and classroom management functionalities.
3. **Student Dashboard**: Provides students with a gamified experience displaying their progress, emotional check-ins, and personalized tips, along with detailed historical performance analytics.
4. **Dynamic Data Management**: Supports bulk uploading of student data and processes it to generate real-time analytics displayed in various chart formats.
5. **Responsive Design**: Adapts to different screen sizes, ensuring usability across devices with a collapsible sidebar and dynamic grid layouts.
6. **Micro-interactions and Animations**: Enhances user engagement through thoughtful animations during transitions and feedback for user actions.

## 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 application features a clean top navigation bar for student interactions, a collapsible sidebar for admin functionalities, and a grid-based layout for dashboards and data visualization.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Context API or Zustand for user session simulation and data handling.

## IMPLEMENTATION STEPS
1. **Set Up Project Environment**: Initialize a new React project using Vite or Next.js with TypeScript and Tailwind CSS.
2. **Install Dependencies**: Add necessary packages including Lucide React, Recharts or Chart.js, React Hook Form, Framer Motion, and Sonner or react-hot-toast.
3. **Create Folder Structure**: Organize the application files into components, pages, services, and styles directories for maintainability.
4. **Implement Routing**: Set up React Router for navigation between the Public Onboarding, Admin Dashboard, and Student Dashboard views.
5. **Develop UI Components**: Create reusable components for buttons, cards, modals, and forms, applying Tailwind CSS for styling.
6. **Build State Management Layer**: Implement Context API or Zustand to manage user authentication and application data.
7. **Integrate Data Mocking**: Develop mock services to simulate backend interactions and provide realistic data responses for the UI.
8. **Responsive Design**: Ensure all components are responsive, utilizing Tailwind's utility classes to adjust layouts for mobile and desktop views.
9. **Add Animations**: Implement Framer Motion for transitions and micro-interactions to enhance user experience.
10. **Testing and Optimization**: Conduct thorough testing of all features and optimize performance, focusing on load times and responsiveness.

## USER EXPERIENCE
Users will experience a seamless journey from onboarding to analytics. Admins will benefit from an intuitive dashboard that allows for easy data management and student tracking, while students will engage with their performance metrics in a gamified interface that provides real-time feedback and motivational insights. Interactions are designed to be smooth and responsive, ensuring a professional and premium feel throughout the application.