
J'ai créé un site à 10 000€ avec Claude (sans coder)
Audio Summary
AI Summary
This video demonstrates how to leverage powerful AI tools to create a professional e-commerce website with a perfect design, multilingual capabilities, and full functionality in just a few minutes, bypassing the need for expensive agencies. The focus is on three specific tools: Cloud Design, Cloud Code, and Wiglot.
The scenario involves launching a new French-made cosmetic brand with four products, targeting 25-45 year olds, with prices between €35-€65. While France is the primary market, the goal is to expand internationally to Belgium, Switzerland, Germany, and Italy. Traditionally, an agency could charge up to €10,000 for such a project, making it difficult for new businesses to be profitable. Existing alternatives like Wix or Squarespace can be design-limited, while freelance developers can be costly and offer less control.
The first step uses Cloud Design to create the website's structure and mock-up. Cloud Design is available with a standard Cloud subscription. To illustrate, a new project named "cosmetic site" is created with a classic design. The user then provides a detailed prompt describing the brand, products, target audience, and desired visual style. This prompt, available in a free community playbook, includes specifics like "clean cosmetic brand made in France," four products, price range, and target demographic (men and women aged 25-45). The AI processes this information, generating a brand name, color palette, product ideas, and the complete site design. Within minutes, a high-quality design is ready, including mock reviews and a Q&A section, all with impressive tonal consistency. The design quality is sufficient at this stage, eliminating the need for further design work.
Next, Cloud Code is used to bring the design to life. Cloud Code is a powerful tool for creating websites and applications without traditional coding. Before using Cloud Code, a hosting environment is set up using Versel, a user-friendly tool for one-click deployment, offering a free account sufficient for this purpose.
The process then shifts to Cloud Code. A new project folder named "cosmetic site" is created. The user interacts with the AI agent using natural language, instructing it to connect to the Versel account (created via Google) and deploy the cosmetic site. The AI guides the user step-by-step, handling installations and commands, and explaining everything in simple French, requesting user clicks in the browser when necessary for validation. After authorization, Versel is successfully installed and connected, preparing the hosting environment.
With the design ready and hosting configured, the mock-up from Cloud Design is transferred to Cloud Code. This is done by selecting "handover to Cloud Code" from the "share" option in Cloud Design, which generates a prompt. This prompt is then pasted into Cloud Code, preceded by context instructing the AI to transform the mock-up into a functional, live website accessible via a web address. Additional instructions are provided (also in the playbook) to ensure the site is fast, clean, responsive, and that features like "add to cart" buttons are fully functional, with the cart incrementing correctly.
The intelligent agent analyzes the mock-up, translates it into code, and creates real code files in the correct directories. It autonomously handles tasks like implementing the "add to cart" functionality and correcting issues, such as downloading images directly when faced with access restrictions. Cloud Code also automatically tests all functionalities, including adding products to the cart, pre-order pages, and mobile responsiveness. Once complete, the site is deployed online via Versel. The resulting live site perfectly mirrors the Cloud Design mock-up, with all functionalities working, including on mobile.
Finally, to address international expansion, Wiglot is introduced. Wiglot is an easy-to-use tool for automatic website translation. A free Wiglot account is created, and the project is named "cosmetic project," with French as the base language. The Versel URL is pasted into Wiglot, and with a single click, the site is automatically translated into English, maintaining the design and layout. A partnership with Wiglot offers a 3-month free trial using the code "Henry X Wiglot 3." With a pro plan, up to five languages can be added. The video demonstrates adding German, Italian, and Spanish.
To integrate Wiglot, a JavaScript code snippet provided by Wiglot is copied. This code is then pasted into Cloud Code, again with natural language context, instructing the AI to insert the code into the site's main code and redeploy it. This process instantly makes the site accessible to potentially millions of new customers in five different markets. The deployed site now features a language widget, allowing users to switch between languages seamlessly. While minor layout adjustments might be needed (e.g., for titles in different languages), Wiglot's visual editor allows for easy manual modifications, including language adjustments, tone customization, and SEO optimization for each translated version.
This comprehensive workflow, utilizing Cloud Design for mock-ups and content, Cloud Code and Versel for rapid coding and deployment, and Wiglot for multilingual capabilities, enables the creation of a professional, responsive, and internationally accessible e-commerce site for a fraction of the cost and time compared to traditional methods. The playbook, available in the description, offers all resources for mastering these tools.