Présentation de la fonctionnalité Kimi Websites

Qu’est-ce que Kimi Websites

Kimi Websites est le produit de création de sites web full-stack de Kimi Agent, propulsé par Kimi K3, un modèle d’IA agentique visuel multimodal. Sa capacité principale est la programmation visuelle (Vibe Coding) : vous pouvez générer un site web full-stack complet à partir de langage naturel, d’une maquette ou d’un enregistrement d’écran, puis le prévisualiser en ligne et le publier en un clic.

Les sites web générés par Kimi Websites peuvent inclure :

• Frontend : structure de pages HTML, mises en page et styles CSS, ainsi que logique d’interaction JavaScript (effets de mouvement, animations, etc.)
• Backend : stockage persistant en base de données, connexion utilisateur et authentification
• Ingénierie : gestion automatique des versions, prévisualisation full-stack et déploiement public

Fonctionnalités du produit

Utilisation

Méthode 1 : accès sur le Web

Rendez-vous sur la page dédiée de Kimi Websites

1. Ouvrez un navigateur : utilisez un navigateur courant comme Chrome, Safari, Edge ou Firefox.
2. Ouvrez l’adresse officielle d’accès : page dédiée Kimi Websites : https://www.kimi.com/zh/websites (interfaces en chinois et en anglais prises en charge)
3. Connectez-vous à votre compte : connectez-vous avec un compte Kimi (inscription par numéro de téléphone mobile ou par e-mail possible)
4. Saisissez votre tâche de création de site. Kimi Websites propose trois grands modes de création :
   1. Saisie de texte : saisissez la tâche dans la boîte de dialogue et décrivez en langage naturel le site que vous souhaitez ;
   2. Remix d’image/de site web : importez une maquette ou une capture d’écran d’un site web que vous aimez pour déclencher la fonctionnalité correspondante ;
   3. Création à partir d’un modèle : créez rapidement un site standard en choisissant un modèle prédéfini et en modifiant le contenu ;
5. Lancez la création : accédez à l’interface de la fonctionnalité Websites, choisissez un modèle ou créez directement par conversation.

Méthode 2 : accès depuis l’application mobile

Sélectionnez l’outil dédié aux sites web dans l’application mobile

Les applications officielles sont disponibles pour iOS, Android et HarmonyOS (nom de l’application : « Kimi »). Au-dessus de la zone de saisie, touchez la barre d’outils (Taskbar) → passez en mode Websites. Elle inclut des outils de génération multimodale et des capacités Agent, ce qui vous permet de fournir une entrée visuelle et de générer du code frontend.

Méthode 3 : mode Agent général

En mode Agent général, saisissez vos exigences de création de site web

Sur le site officiel ou sur mobile, sélectionnez le modèle K3 et saisissez des instructions liées à la création d’un site web. Kimi invoquera les capacités de programmation visuelle et les outils d’exécution de code.

Étapes

Créer un site web par conversation

Décrivez vos besoins en langage naturel dans la zone de saisie, et Kimi les comprendra puis les exécutera. Trois méthodes de création sont prises en charge :

Exemple pratique

Text

Vue d’ensemble du flux de création de site web

Text

Kimi Websites active le SKILL de création de webapp, un agent de génération de code multi-tour dédié à la construction de sites web. Il exécute de manière autonome le flux de travail suivant :

1. Analyse des exigences : analyse automatiquement les modules fonctionnels du site, le style visuel et la logique d’interaction
2. Planification des tâches : décompose le travail en sous-tâches comme la conception, le développement et la préparation des assets
3. Solution technique : sélectionne automatiquement une architecture technique adaptée (par exemple React + Tailwind CSS)
4. Génération d’assets : génère au besoin des assets visuels comme des images et des icônes
5. Construction du code : écrit la structure des pages, les styles et le code d’interaction
6. Optimisation multi-tour : ajuste automatiquement le site à partir de la prévisualisation jusqu’à ce qu’il soit terminé

Prévisualiser et ajuster

• Prévisualisation en temps réel : génère une URL de démonstration HTML que vous pouvez ouvrir immédiatement dans un navigateur
• Modifications par conversation : poursuivez la conversation pour demander des changements, par exemple « change la barre de navigation pour un style sombre »

Exemple réel

Text

Interface du panneau de prévisualisation

Une fois le site généré, le panneau de prévisualisation s’ouvre à droite, et des cartes de version apparaissent également dans la conversation. Les principales entrées d’action sont les suivantes :

Barre d’outils supérieure du panneau de prévisualisation (de gauche à droite) :

Cartes de version dans la conversation : affichent le nom du site, le numéro de version (par exemple V2) et l’URL. Cliquez sur Prévisualiser pour ouvrir la version correspondante ; cliquez sur Restaurer pour revenir à cette version. La carte Tous les fichiers permet de consulter ou de télécharger l’ensemble des fichiers du projet. Pour connaître l’utilisation détaillée de chaque bouton, consultez les sections correspondantes ci-dessous.

Modification visuelle

• Optimisation multi-tour : ajustez finement les détails du site web au fil de la conversation
• Modes de modification :
  • Mode annotation : cliquez sur la partie de la page web que vous souhaitez modifier et ajoutez des commentaires en langage naturel
  • Mode sélection : sélectionnez n’importe quel élément de la page web et ajoutez des commentaires
  • Utilisez des rectangles, des flèches, des pinceaux, le changement de couleur et d’autres outils de sélection et de modification pour ajouter des suggestions de changement
• Après avoir ajouté des annotations à plusieurs endroits, ajoutez-les à la conversation et envoyez toutes vos suggestions à Kimi en une seule fois

Déploiement et publication du code

À propos de « URL personnalisée » : 3 à 30 caractères, uniquement des lettres minuscules, des chiffres et des traits d’union. Ne peut pas commencer ni se terminer par un trait d’union, et ne peut pas être composé uniquement de chiffres. Certains mots réservés (comme kimi, www, login, etc.) ne sont pas disponibles. Si le nom est déjà pris ou indisponible, veuillez en choisir un autre.

À propos des limites de « Télécharger et déployer » : la connexion avec un compte Kimi et la base de données cloud gérée par la plateforme sont fournies par la plateforme Kimi et ne migrent pas avec le code exporté. Si vous déployez le code sur votre propre serveur, la méthode de connexion doit être remplacée par un système nom d’utilisateur/mot de passe fondé sur votre propre base de données, et les données doivent également être migrées vers votre base de données. Pour un simple accès public, nous recommandons d’utiliser directement Publication en un clic ; la connexion avec compte Kimi et les données cloud continueront alors de fonctionner normalement. Consultez Pourquoi le site web que j’ai créé ne fonctionne-t-il pas ? pour en savoir plus.

Prévisualisation par version

Une fois la génération terminée, vous accédez à la page de prévisualisation. Dans l’interface de prévisualisation, vous pouvez cliquer sur différentes versions de déploiement et télécharger les fichiers de différentes versions.

Publier, partager et annuler la publication

Avant publication, le site web ne peut être prévisualisé que dans la conversation. Pour permettre à d’autres personnes d’y accéder, cliquez sur Partager dans l’angle supérieur droit du panneau de prévisualisation afin d’ouvrir le panneau de publication :

1. URL personnalisée : vous pouvez modifier le nom dans l’URL par défaut, par exemple en le remplaçant par yourname.ok.kimi.link ;
2. Cliquez sur Copier le lien pour obtenir l’URL publique, ou sur Ouvrir le site web pour l’afficher dans un nouvel onglet. Après publication, le haut du panneau affiche Publié, et toute personne disposant du lien peut y accéder ;
3. Pour mettre le site hors ligne, sélectionnez Annuler la publication dans le menu … situé dans l’angle supérieur droit du panneau. Le site ne sera plus accessible publiquement (le code et les données sont conservés, et vous pouvez le republier à tout moment).

Modification multi-tour

Si une partie précise ne vous convient pas, cliquez sur le bouton de modification dans la fenêtre de prévisualisation pour continuer à l’affiner. Vous pouvez aussi envoyer des instructions à Kimi en langage naturel et poursuivre la modification avec Agent. Lorsque le résultat vous convient, téléchargez le code HTML/CSS/JS complet et déployez-le directement, ou continuez à le peaufiner dans un éditeur.

À qui s’adresse cette fonctionnalité

• Développeurs : concevez des prototypes produit et des démos frontend, en réduisant fortement le temps nécessaire pour partir de zéro.
• Entrepreneurs : créez rapidement des sites officiels, des landing pages et des pages de présentation produit lorsque les ressources sont limitées.
• Chefs de produit : transformez rapidement un PRD ou une maquette en prototype interactif démontrable, sans attendre la planification du développement.
• Utilisateurs non techniques : aucune connaissance en code n’est requise. Décrivez votre idée ou importez une image de référence, et passez du concept à une page web exécutable.

Exemples de prompts

Vous pouvez vous inspirer des scénarios et prompts suivants pour générer du contenu