Una app para ofrecer mis servicios de electricista, que sea en español por favor
Generated Prompt
## APPLICATION OVERVIEW The application is a web app designed to connect users with electrical services offered by a professional electrician. It allows users to easily request services, view pricing, and contact the electrician, ensuring a seamless experience for clients seeking electrical solutions. ## CORE FEATURES 1. **Service Listings**: Display a list of available electrical services with detailed descriptions, pricing, and estimated completion times. 2. **Booking System**: An integrated booking feature that allows users to schedule appointments directly through the app, selecting date and time slots. 3. **Contact Form**: A simple contact form for users to inquire about services or request quotes, ensuring direct communication with the electrician. 4. **Testimonials Section**: Showcase client testimonials to build trust and credibility, enhancing the professional image of the services offered. 5. **About Section**: A brief description of the electrician's background, qualifications, and experience, helping users feel connected. 6. **Location Map**: An embedded map showing the service area covered, allowing users to see if their location is within the operational range. ## 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 hero section with a call to action, followed by service listings, testimonials, and a contact form, all arranged in a single-scroll format for easy navigation. ## TECHNICAL REQUIREMENTS - **Framework**: React with TypeScript. - **Styling**: Tailwind CSS. - **UI Components**: shadcn/ui. - **State Management**: Context API or Redux (if needed for more complex state handling). ## IMPLEMENTATION STEPS 1. **Set Up the Project**: Initialize a new React project with TypeScript and install necessary dependencies (React Router, Tailwind CSS). 2. **Design the Layout**: Create the main components including Header, Hero, Services, Testimonials, and Contact sections, applying Tailwind CSS for styling. 3. **Implement the Booking System**: Set up a form to capture booking information, integrating a date picker for scheduling. 4. **Create the Contact Form**: Develop a simple form that captures user inquiries and integrates with an email service for notifications. 5. **Add Testimonials Section**: Create a component to dynamically display user testimonials, allowing for easy updates. 6. **Integrate Google Maps**: Embed a Google Maps component to show the service area, ensuring it is responsive and easy to navigate. ## USER EXPERIENCE Users will experience a clean and intuitive interface that allows them to quickly access information about electrical services. Navigation will be straightforward with clear calls to action for booking services or contacting the electrician. The layout will be responsive, ensuring usability on both mobile and desktop devices, with seamless transitions between sections to maintain engagement. This web app will effectively showcase the electrician's services while providing a user-friendly platform for clients to connect and schedule their needs.
Loved by thousands of makers from
From early prototypes to real products, they started here.







































Generate optimized prompts for your vibe coding projects
Generate prompt
Enter a brief description of the app you want to build and get an optimized prompt
Review and use your prompt
Review (and edit if necessary) the generated prompt, then copy it or open it directly in your chosen platform
Get inspired with new ideas
Get AI-generated suggestions to expand your product with features that will surprise your users
Frequently Asked Questions
Everything you need to know about creating better prompts for your Lovable projects
Still have questions?
Can't find what you're looking for? We're here to help!
