Bienvenue dans ce tutoriel sur la création d'une landing page à partir d'une simple capture d'écran en utilisant les Artifacts de Claude.

L'une des fonctionnalités les plus puissantes de Claude AI à ce jour est sa capacité à produire des Claude Artifacts - des résultats structurés tels que des rapports détaillés, des résumés et des recommandations exploitables. Ces artefacts transforment les données brutes en informations précieuses, permettant aux entreprises de prendre de meilleures décisions et d'augmenter leur productivité.

Dans ce tutoriel, vous apprendrez comment exploiter les capacités de Claude AI pour créer une page d'accueil professionnelle à partir d'une simple capture d'écran en moins de 10 minutes.

C'est parti, découvrons ensemble le potentiel de Claude AI pour votre entreprise !

Recréation d'une page d'accueil

Pour commencer, rendez-vous sur Claude et créez un compte si vous n'en avez pas encore (gratuit ou payant).

Il est maintenant temps de recréer la page d'accueil de votre choix. Nous allons prendre celle de Dupple.

‍

Pour le transmettre à Claude, il vous suffit d'ajouter votre image et un texte qui correspond à vos besoins et voilà ! Voici quelques exemples de prompts que vous pouvez utiliser :

Génère un site web qui ressemble à celui-ci et inclus le code dans ta réponse

Voici le résultat pour notre exemple. Si vous essayez ceci chez vous (ce que nous vous recommandons vivement !), vous remarquerez peut-être que le résultat n'est pas qu'une simple page web, mais qu'il inclut également des boutons permettant de connecter vos autres pages générées par Claude.

Vous pouvez également publier la page sur internet ! Voici notre page.

Comme vous pouvez le constater, le résultat est loin d'être parfait (pas d'images... ce qui est normal) mais la structure est en place et vous pouvez maintenant facilement l'améliorer de manière itérative.

Personnalisation de votre site web

Bien entendu, ce que Claude vous fournit peut ne pas correspondre exactement à vos attentes.

Pas de souci : vous pouvez modifier le résultat avec des prompts très simples.

Par exemple, disons que je souhaite une version sombre de la page d'accueil.

Prompt :

Crée une version sombre de la page d'accueil

‍

Amusons-nous maintenant !

Version plus high-tech :

‍

Plus dans le style du "Bloomberg ou du Financial Times" (bon d'accord, c'est peut-être un peu ambitieux) :

Exporter le site web

Pour exporter et partager le site web, cliquez sur le bouton "Chat controls" (en haut à droite de votre écran), et retrouvez tout le contenu joint dans Artifacts.

Le code est conçu par Claude pour être déployé rapidement et de manière autonome, donc la majeure partie du travail de développement est déjà accomplie !

‍