Kimi Websites

Kimi versteht visuelle Eingaben (UI-Mockups, Screenshots, Interaktionsvideos) sowie natürlichsprachliche Anweisungen und übersetzt sie in vollständigen, lauffähigen Frontend-Code – nicht nur statische Oberflächen, sondern auch dynamisches, interaktives Verhalten.

Funktionsüberblick

Wie verwendet man Kimi Websites?

Methode 1: Die Kimi-Websites-Seite aufrufen

1. Browser öffnen: Nutzen Sie Chrome, Safari, Edge, Firefox oder einen anderen gängigen Browser
2. Aufrufen: kimi.com/websites (unterstützt Chinesisch und Englisch)
3. Anmelden: Mit Ihrem Kimi-Konto (Telefonnummer oder E-Mail)
4. Aufgabe eingeben:

5. Aufbau starten: Wählen Sie eine Vorlage oder beginnen Sie im Dialog

Methode 2: Mobile App

Für iOS, Android und HarmonyOS gibt es die offizielle Kimi-App. Tippen Sie im Eingabebereich auf die Taskleiste → wechseln Sie in den Websites-Agent-Modus, der multimodale Generierungswerkzeuge und Agent-Funktionen umfasst.

Methode 3: K2.6-Agent-Modus verwenden

Wechseln Sie in den K2.6-Agent-Modus und geben Sie eine Aufgabe zum Website-Aufbau ein. Kimi nutzt dann seine visuellen Coding-Fähigkeiten und Werkzeuge zur Codeausführung.

Wie funktioniert Kimi Websites?

Schritt 1: Eine Website im Dialog erstellen

Beschreiben Sie Ihre Anforderungen in natürlicher Sprache. Es werden drei Erstellungsmethoden unterstützt:

Beispiel-Prompt:

Text

Schritt 2: Aufbauprozess

Kimi Websites aktiviert das webapp-building SKILL – einen spezialisierten Agenten für mehrstufige Codegenerierung:

1. Anforderungsanalyse: Analysiert Website-Module, visuellen Stil und Interaktionslogik
2. Aufgabenplanung: Zerlegt die Aufgabe in Teilaufgaben für Design, Entwicklung und Asset-Vorbereitung
3. Tech-Stack-Auswahl: Wählt eine passende Architektur (z. B. React + Tailwind CSS)
4. Asset-Generierung: Erzeugt Bilder, Symbole und weitere visuelle Assets
5. Code-Erstellung: Schreibt Seitenstruktur, Styling und Interaktionscode
6. Mehrstufige Optimierung: Passt sich anhand der Vorschauergebnisse selbst an, bis alles fertig ist

Schritt 3: Vorschau & Anpassung

• Live-Vorschau: Erzeugt eine HTML-Demo-URL zur sofortigen Ansicht im Browser
• Dialogbasierte Bearbeitung: Setzen Sie den Dialog fort, um Änderungen anzufordern, z. B. „Mach die Navigationsleiste dunkel“

Schritt 4: Visuelle Online-Bearbeitung

• Mehrstufige Optimierung: Feinabstimmung der Details im laufenden Dialog
• Bearbeitungsmodi:
  • Annotationsmodus: Klicken Sie auf Bereiche, um natürlichsprachliche Anmerkungen hinzuzufügen
  • Auswahlmodus: Wählen Sie ein beliebiges Element aus und fügen Sie Anmerkungen hinzu
  • Nutzen Sie Rechtecke, Pfeile, Pinsel und Farbwechsel, um Änderungsvorschläge zu markieren
• Senden Sie alle Änderungsvorschläge auf einmal an Kimi

Schritt 5: Bereitstellung & Veröffentlichung

Nach der Generierung können Sie:

• Auf verschiedene Bereitstellungsversionen klicken, um die Versionsdateien herunterzuladen
• Auf die Teilen-Schaltfläche klicken, um einen öffentlich bereitgestellten Link zu erhalten (oder auf privat stellen)
• Auf die Bearbeiten-Schaltfläche klicken, um weiter zu überarbeiten
• Den vollständigen HTML-/CSS-/JS-Code zur direkten Bereitstellung oder weiteren Verfeinerung herunterladen

Zielgruppe

Referenzszenarien