Créer un site web de zéro avec Crewdle Build
Suivez une création réelle, d’une brève description à une page publiée : questions guidées, guide de style, parcours, plan, puis la page finie en direct.
Mis à jour le
Crewdle Build transforme une brève description en langage courant en un véritable site web fonctionnel, pas une maquette, en vous guidant à travers six étapes. Ce guide suit une création du début à la fin : une page d'accueil pour Fern & Co, une boutique fictive de plantes d'intérieur.
Étape 1 : Décrivez ce que vous voulez construire
Ouvrez Build et décrivez le site en langage courant : à quoi il sert, à qui il s'adresse et quelles sections il doit avoir. Choisissez un type de départ comme Page d'accueil, ou écrivez votre propre description. Nous avons utilisé : « Une page d'accueil chaleureuse et terreuse pour Fern & Co, une boutique de plantes d'intérieur. Il faut une section d'accueil, une section plantes en vedette, une section conseils d'entretien, les heures et l'emplacement du magasin, et une inscription à la newsletter. »
Étape 2 : Répondez à quelques questions rapides
Avant d'écrire quoi que ce soit, Build pose quelques questions rapides pour cerner l'ambiance : le style recherché, le public visé, si vous avez du vrai contenu ou préférez des espaces réservés soignés, et s'il faut respecter une marque existante.
Build pose quelques questions rapides avant d'écrire quoi que ce soit, pour que le résultat corresponde à votre intention dès le départ.
Comment répondre aux questions de configuration
- Cliquez sur une des réponses suggérées, ou tapez la vôtre dans la zone en dessous.
- Cliquez sur Suivant après chaque question ; la dernière a un bouton Soumettre.
- Lisez la vision que Build résume, puis cliquez sur Oui, construis-le ! pour la verrouiller.
Étape 3 : Regardez le plan et le guide de style se former
Une fois confirmé, Build verrouille un Plan de projet écrit — objectifs, utilisateurs cibles, portée, ton, et une palette de couleurs et de polices de départ — puis construit le Guide de style : vos jetons de couleur, la typographie, l'espacement et chaque composant réutilisable (boutons, cartes, sections) que le design exige.
Le plan de projet capture les objectifs, les utilisateurs et la portée avant qu'un seul composant ne soit construit.
Le guide de style contient la palette de couleurs et la typographie que Build a choisies pour la description.
Ouvrez n'importe quel composant dans l'onglet Composants pour voir son aperçu en direct, ses variantes et son tableau de propriétés.
Chaque composant, comme ce HeroSection, obtient son propre aperçu avec des variantes et un tableau de propriétés.
Étape 4 : Passez en revue le parcours utilisateur, la structure et le plan
Avant d'assembler la page, Build cartographie trois autres éléments que vous pouvez inspecter et réorienter :
- Parcours utilisateur : comment chaque type de visiteur passe de la curiosité à l'action, étape par étape, avec ses émotions, ses pensées et ses points de friction.
- Structure : une carte d'architecture de l'information montrant comment votre contenu se connecte, ainsi que la navigation qui en découle.
- Plan : chaque objectif du visiteur décomposé en tâches et sous-tâches, chacune liée à l'écran et au composant précis qui la réalise.
Le parcours utilisateur cartographie l'arc émotionnel de chaque persona à travers la page, étape par étape.
La structure montre comment votre contenu se connecte et la navigation qui en découle.
Le plan relie chaque objectif du visiteur à l'écran et au composant précis qui le concrétise.
Vous pouvez répondre dans le chat à tout moment pour réorienter l'un de ces éléments ; Build intègre votre réponse dans l'étape suivante.
Étape 5 : Découvrez la page finie assemblée et en direct
Une fois le plan établi, Build assemble tous les composants dans la page réelle, en générant au passage les visuels nécessaires (comme une photo d'accueil), et la déploie automatiquement vers un aperçu en direct.
Cliquez sur Présenter pour voir votre prototype fini et en direct, du début à la fin.
Comment prévisualiser et continuer à ajuster
- Cliquez sur Présenter dans la barre supérieure pour voir la page finie en plein écran, ou consultez le panneau d'aperçu ancré à droite de n'importe quel onglet.
- Décrivez tout changement dans le chat, par exemple « remplace par la vraie adresse du magasin », et Build met à jour les composants concernés.
- Une fois satisfait, cliquez sur Publier pour la mettre en ligne, ou Dupliquer pour créer une variante.
Et ensuite ?
Tout est du vrai code que vous pouvez continuer à façonner : intégrez vos propres photos et textes, connectez un domaine personnalisé, ou confiez-le à un développeur via l'éditeur de code intégré ou le Build CLI. Voir Crewdle Build pour la vue d'ensemble.
Questions fréquentes
Faut-il savoir coder pour construire un site complet de cette façon ?
Non. Vous décrivez ce que vous voulez et répondez à quelques questions guidées en langage courant ; Build s’occupe du système de design, de la structure et du code. Les développeurs peuvent optionnellement aller plus loin dans l’éditeur de code ou le Build CLI.
Puis-je changer mes réponses ou le design après le démarrage de Build ?
Oui. Répondez dans le chat à tout moment, par exemple pour ajuster l’ambiance, intégrer du vrai contenu ou modifier une section, et Build met à jour le système de design et la page en conséquence.
Qu’obtient-on à la fin : un vrai site ou juste un design ?
Un vrai site web fonctionnel, avec du code réel, déployé automatiquement vers un aperçu en direct pendant sa construction. Publiez-le pour le mettre en ligne, et connectez votre propre domaine personnalisé.