Beispiel: Textbasierten UI-Generator

Dieses Tool generiert eine textbasierte Benutzeroberfläche basierend auf der Beschreibung. Der vollständige Quellcode wird bereitgestellt, damit Sie ihn ausprobieren können.

Wir sind Befürworter der KI-gesteuerten Entwicklung, wie sie von https://eastagile.com praktiziert wird. Um dies zu unterstützen, nutzen wir KI, um uns bei der Entwicklung von Benutzeroberflächen zu helfen. Dieses Tool generiert eine textbasierte Benutzeroberfläche basierend auf der Beschreibung und einer (optionalen) Anfrage nach bestimmten Benutzerschnittstellenelementen. Die Eingabeaufforderung für das Tool fragt nach Designelementen sowie nach entsprechendem UI-Text. Dieses Beispiel wird als konkretes und praktisches Beispiel für ein Tool präsentiert, das man erstellen und im gesamten Team einsetzen könnte. Hier ist ein Beispiel für die Verwendung. Benutzereingabe:

Generierte Ausgabe:

Sie fügen Ihr benutzerdefiniertes Tool-JSON in Genstudio ein.

Hier ist das tatsächliche JSON, das Sie in einer Datei aktualisieren würden (d.h. text-based-ux-designer.json).

{
"version": "0.1",
"metadata": {
"avatar": "",
"creator": {
"name": "Inspiriert von Khoa Tran",
"email": "admin@eastagile.com",
"organization": "East Agile"
},
"timestamp": "2023-06-01T10:00:00Z",
"variables": [
{
"name": "Funktionsbeschreibung",
"type": "text",
"default": "",
"description": "Eine kurze Beschreibung der Funktion oder Funktionalität."
},
{
"name": "UI-Komponenten",
"type": "text",
"default": "Alles, was angemessen und konventionell ist",
"description": "Die Art der Benutzeroberflächenkomponenten (z. B. Optionsfeld, Mehrfachauswahl)."
}
],
"parameters": {
"top_p": 1,
"max_tokens": 1024,
"temperature": 0.7,
"presence_penalty": 0,
"frequency_penalty": 0
},
"avatar_type": "base64",
"description": "Dieses Tool generiert eine textbasierte Benutzeroberfläche basierend auf Ihrer Beschreibung und den angegebenen Benutzeroberflächenkomponenten.",
"prompt_name": "Textbasierter Benutzeroberflächen-Generator",
"usage_notes": "Geben Sie eine Beschreibung an, welche Art von Benutzeroberfläche, Funktion oder App Sie generieren möchten (Funktionsbeschreibung) und jede spezifische Art von Benutzeroberflächenelementen, die Sie verwenden möchten (UI-Komponenten). Diese Anwendung soll die KI-gesteuerte Entwicklung (AiDD) unterstützen, wie sie von East Agile https://eastagile.com praktiziert wird.",
"model_version": [
"gpt-3.5",
"gpt-4",
"claude",
"palm"
],
"expected_output": {
"type": "text"
}
},
"model_prompt": "Generieren Sie eine textbasierte Benutzeroberfläche mit Formulierungen für die folgende Funktion oder Funktionalität:\n\nFunktionsbeschreibung: {{Funktionsbeschreibung}}\nBenutzeroberflächenelemente: {{UI-Komponenten}}.\n\nBitte befolgen Sie diese bewährten Praktiken für effektives UX-Texten:\n1. Machen Sie es benutzbar: Priorisieren Sie Funktionalität und Benutzerfreundlichkeit über cleveren Ausdruck oder unkonventionelles Design.\n2. Machen Sie es hilfreich: Geben Sie nützliche Informationen, die den Benutzern helfen, ihre Ziele zu erreichen.\n3. Machen Sie es zugänglich: Verwenden Sie einfache, klare Sprache und konventionelle Designelemente, die es allen Benutzern, einschließlich Menschen mit Behinderungen, erleichtern, zu verstehen.\n4. Machen Sie es klar: Vermeiden Sie Fachjargon und Mehrdeutigkeiten; Benutzer sollten den Inhalt und die UI schnell und einfach verstehen können. Wo möglich, sollten UI-Angebote offensichtlich sein, ohne dass Text gelesen werden muss.\n5. Machen Sie es angemessen: Berücksichtigen Sie den kulturellen Hintergrund und den Kontext Ihrer Benutzer, falls vorhanden, und stellen Sie sicher, dass der Inhalt integrativ und respektvoll ist.\n6. Verwenden Sie die aktive Stimme: Ermutigen Sie die Benutzer, Maßnahmen zu ergreifen, indem Sie aktive, direkte Sprache verwenden.\n7. Schreiben Sie positiv: Konzentrieren Sie sich auf positive Aussagen und vermeiden Sie negative Formulierungen, es sei denn, es ist absolut notwendig.\n8. Seien Sie prägnant: Halten Sie die Sätze kurz und auf den Punkt, indem Sie unnötige Worte und Phrasen beseitigen.\n9. Führen Sie ständige A/B-Tests durch: Testen und verfeinern Sie kontinuierlich den Inhalt, um sicherzustellen, dass er effektiv und benutzerfreundlich ist.\n10. Halten Sie die Markenstimme und den Ton konsistent: Stellen Sie sicher, dass der Inhalt mit der Gesamtmarkenpersönlichkeit übereinstimmt und in der gesamten Benutzererfahrung einen konsistenten Ton beibehält.\n11. Verwenden Sie handlungsorientierte Sprache: Ermutigen Sie die Benutzer, Maßnahmen zu ergreifen, indem Sie klare, direkte Sprache verwenden, die sich auf spezifische Aufgaben konzentriert.\n12. Halten Sie die kontextuelle Relevanz aufrecht: Bieten Sie relevanten Kontext, um sicherzustellen, dass der Inhalt leicht lokalisiert und für verschiedene Sprachen und Kulturen übersetzbar ist.\n\nGenerierter UX-Textinhalt:\n"
}

Sie könnten Ihr eigenes Icon erstellen und es als Base64-Textblock in dieses JSON eingeben. Andernfalls wird ein schönes Standard-Icon verwendet.

Last updated