Landing Page que converte para vender este produto em anexo, a VSL está neste vídeo, pode colocar: https://www.
Generated Prompt
## APPLICATION OVERVIEW This project is a landing page designed to convert visitors into customers for THE BBL MOZAMBIQUE's product. The page will feature an automatically playing video, a contact form, and direct WhatsApp messaging functionality to streamline the purchasing process. ## CORE FEATURES 1. **Auto-Playing Video**: The landing page will feature a video that plays automatically without showing the source, enhancing user engagement. 2. **Contact Form**: Users will be able to fill out a form with their name, location, and contact number, providing essential information for follow-up. 3. **WhatsApp Integration**: Upon submitting the form, users will be redirected to WhatsApp with a pre-filled message containing their details to express interest in the product. 4. **Image Protection**: Images on the landing page will be secured to prevent downloading, ensuring that the content remains proprietary. 5. **Branding Elements**: The page will incorporate the company logo and branding to maintain a consistent identity. ## 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 layout will be structured with a hero section at the top featuring the video, followed by the contact form, and a footer that includes branding elements. ## TECHNICAL REQUIREMENTS - **Framework**: React with TypeScript - **Styling**: Tailwind CSS - **UI Components**: shadcn/ui - **State Management**: Not specifically required for this project but can be incorporated if needed for form handling. ## IMPLEMENTATION STEPS 1. **Set Up React Application**: Initialize a new React project using TypeScript. 2. **Install Dependencies**: Include Tailwind CSS and shadcn/ui for styling and UI components. 3. **Create the Video Component**: Implement a component that embeds the video with autoplay functionality and hides the source. 4. **Design the Contact Form**: Create a form with fields for name, location, and contact number, ensuring validation and accessibility. 5. **Implement WhatsApp Redirection**: On form submission, redirect users to WhatsApp with the predefined message template, incorporating their input. 6. **Add Image Protection**: Use CSS techniques to prevent right-click downloading of images on the page. 7. **Style the Landing Page**: Apply Tailwind CSS styles to the landing page elements, ensuring responsiveness and visual appeal. 8. **Test Functionality**: Ensure all features work as intended, testing the video playback, form submission, and WhatsApp integration. ## USER EXPERIENCE Users will land on a clean, minimalist page that immediately captures their attention with an engaging video. The contact form will be prominently displayed, encouraging users to submit their information easily. Upon submission, they will be seamlessly redirected to WhatsApp to initiate a conversation about the product, creating a frictionless experience that enhances conversion potential. The design will focus on clarity and simplicity, ensuring that users can navigate the page effortlessly.
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!
