Skip to main content
Durée estimée : 10 minutes Parfois, le design dont vous voulez partir existe déjà en ligne : votre site actuel, ou une page dont vous voulez reproduire l’apparence. Import from URL recrée un site web sous forme de frame de design que vous pouvez explorer, affiner et transformer en application interactive. Vous utiliserez creative-studio-landing.replit.app, une page d’accueil pour un studio créatif construite par Replit, comme exemple.

Avant de commencer

Vous avez besoin de :
  • Un compte Replit.
  • L’URL d’un site web public, ou l’exemple ci-dessus.

Importer le site web

1

Copier l'URL du site

Utilisez votre propre site, ou copiez l’exemple : https://creative-studio-landing.replit.app.
La page d'accueil de Kosmo Studio avec le titre We craft bold ideas and visuals that truly work, au-dessus d'un éventail de cartes d'œuvres

Le site d'exemple : Kosmo Studio, une page d'accueil de studio créatif.

2

Ouvrir Replit Design

Rendez-vous sur replit.com/design et sélectionnez Import URL sous la zone de prompt. Agent recrée l’apparence et l’ambiance du site comme point de départ.
La page d'accueil de Replit Design avec l'option Import URL sélectionnée et une infobulle indiquant Paste a link to any website and Agent will recreate its look and feel as a starting point

Import URL sur la page d'accueil de Replit Design : collez un lien vers n'importe quel site web.

3

Coller l'URL et commencer à construire

Sélectionner Import URL préremplit le prompt : « Recreate the look and feel of this website: ». Collez votre URL après, puis sélectionnez Start.
La zone de prompt de Replit Design indiquant Recreate the look and feel of this website suivi de l'URL d'exemple, avec le bouton Start

Le prompt de recréation prérempli avec l'URL d'exemple, prêt à démarrer.

Agent recrée le site sous forme de frame de design dans votre projet.
La page d'accueil recréée de Kosmo Studio sous forme de frame de design dans Replit Design, avec l'exécution marquée comme terminée dans le panneau de chat

La page d'accueil recréée de Kosmo Studio sous forme de frame de design dans Replit Design.

Faites-en le vôtre

Sélectionnez la frame importée et commencez à la remodeler :
  • Suivez une suggestion : l’import arrive avec des prochaines étapes proposées, comme une variante éditoriale sombre, un affichage mobile, ou une page de contact. Chacune génère une nouvelle frame, de sorte que l’originale reste disponible pour comparaison.
  • Discutez-en : utilisez le champ de saisie sous la frame et briefez-la avec vos propres mots, « remplace les photos du portfolio », « rends le titre de la section principale plus épais ».
La frame recréée Creative Studio sélectionnée dans Replit Design, avec le panneau Suggested next steps à côté proposant une variante éditoriale sombre, un affichage mobile, une page de contact, et différentes approches

La frame importée sélectionnée, avec des prochaines étapes suggérées proposant une variante éditoriale sombre, un affichage mobile et une page de contact.

Étapes suivantes

Suggestions d'exploration

Explorez quoi concevoir ensuite, un clic à la fois.

Visual Editor

Peaufinez le texte, les couleurs, l’espacement et les images directement.

Construire votre design

Transformez la frame terminée en application fonctionnelle.