Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This web application will allow users to create custom names for their Roblox accounts, manage Robux (the in-game currency), and send it to other users. The application will focus on a clean and intuitive user experience, enabling easy navigation and interaction.

## CORE FEATURES
1. **Account Creation**: Users can create an account using their email and password to manage their Roblox names and Robux balance.
2. **Name Customization**: A feature that allows users to customize their Roblox names according to their preferences, with available options and suggestions.
3. **Robux Management**: Users can view their current Robux balance, top up, and track transactions within the app.
4. **Send Robux**: A simple interface for users to send Robux to other Roblox users, including a transaction history.
5. **User Profiles**: Users can view and edit their profiles, including their Roblox names and transaction settings.
6. **Support and FAQs**: A section dedicated to providing users with help regarding common issues or questions related to Roblox and the application.

## 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**: A single-column layout with a header, main content area for features like name customization and Robux management, and a footer for support and contact information.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Redux or Context API (if needed)

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project using Create React App with TypeScript.
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui to the project.
3. **Create Component Structure**: Build the main components (Header, Sidebar, Main Content Area, Footer).
4. **Implement Routing**: Use React Router to set up navigation between different sections of the app.
5. **Develop Core Features**: 
   - Implement the account creation and user authentication process.
   - Create the name customization component and integrate it with state management.
   - Develop Robux management functionality, including sending Robux and transaction history.
6. **Ensure Responsiveness**: Use Tailwind CSS utilities to create a responsive design that works on various devices.
7. **Testing**: Conduct user testing to ensure all features work seamlessly and provide a good user experience.
8. **Deployment**: Deploy the application on a suitable hosting platform like Vercel or Netlify.

## USER EXPERIENCE
Users will start by signing up or logging in to their accounts. After logging in, they'll be directed to their dashboard where they can customize their Roblox name, manage their Robux balance, and send Robux to friends easily. The application will guide users through each feature with clear prompts and a simple, intuitive interface, ensuring a smooth experience from start to finish.