Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a web application designed as a prank simulator for Roblox, where players can send fake Robux gift notifications to each other. The application will mimic the Roblox interface, allowing users to select the amount of Robux to display and choose another player to send a simulated gift. The goal is to create a fun, interactive experience that resembles the aesthetics of older Roblox games without the transfer of real Robux.

## CORE FEATURES
1. **User Registration/Login**: Players can create an account or log in to access the simulator.
2. **Robux Selection Menu**: Upon joining, users can choose from various amounts of Robux to display in their gift notifications.
3. **Player Selection**: Users can browse a list of online players in the server and select one to send a fake Robux gift.
4. **Gift Notification System**: After selecting a player and an amount, a realistic pop-up notification animates to simulate sending the Robux gift.
5. **Gift Animation**: Visual animations will enhance the realism of the gift being sent.
6. **Leaderboard (optional)**: Track users who have sent the most fake gifts, adding a gamification element.

## 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 main layout will feature a top navigation bar, a central content area for the Robux selection and player list, and a footer with additional information. The user interface will prioritize clarity and ease of navigation.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: React Context API or Zustand for state management of user sessions and notifications

## IMPLEMENTATION STEPS
1. **Set Up Development Environment**:
   - Initialize a new React project with TypeScript.
   - Install Tailwind CSS and configure it for the project.
   - Integrate shadcn/ui for UI components.

2. **Create the Authentication Flow**:
   - Implement user registration and login functionalities.
   - Use local storage or a simple backend to manage user sessions.

3. **Design the Main Interface**:
   - Build the navigation bar with links to the home screen and user profile.
   - Create the central area for Robux selection and player list.

4. **Implement Robux Selection**:
   - Design a dropdown or slider for selecting the Robux amount to display.
   - Ensure the UI is responsive and accessible.

5. **Develop Player Selection Feature**:
   - Create a list component to display online players.
   - Allow users to select a player and trigger the gift notification.

6. **Build the Notification System**:
   - Implement the gift notification animation using CSS or a library for smooth transitions.
   - Ensure the notification appears realistic in terms of timing and design.

7. **Test and Optimize**:
   - Conduct user testing to refine the interface and interactions.
   - Optimize performance for a smooth user experience.

## USER EXPERIENCE
Users will first register or log into the application. Upon entering, they will see a simple interface with a Robux selection menu and a list of available players. After selecting the amount of Robux and a player to gift, they will trigger a notification that appears in a styled pop-up. The animation will create a sense of realism, simulating the experience of sending a gift in Roblox. The application will be responsive, ensuring a seamless experience on both desktop and mobile devices.