Vercel startet UI SDK: eine Bibliothek von Verhaltensweisen für Agenten zum Bau von Interfaces

Vercel hat am Donnerstag (12.) das UI SDK gestartet, eine Open-Source-Bibliothek in öffentlicher Beta, die KI-Agenten Interface-Verhaltensweisen gibt – statt fertiger Komponenten –, damit sie die Komponenten zusammenbauen können, die ein Projekt braucht. Das Projekt wurde von shadcn, dem Schöpfer von shadcn/ui, und Shu Ding erstellt; der Code liegt auf GitHub unter der Apache-2.0-Lizenz.

Die Idee, erklärt auf der offiziellen Website, beginnt mit einem Beispiel: Statt einem Agenten eine fertige Select-Komponente zu geben, gibt das UI SDK ihm die Teile, aus denen ein Select funktioniert – das Popup (createPopup), die Auswahl-Logik (createSelection) und die Suche beim Tippen (createTypeahead). Mit denselben Teilen kann der Agent auch ein Autocomplete, eine Combobox oder eine Komponente bauen, die noch niemand entworfen hat.

Über 50 Verhaltensweisen, fünf Frameworks

Das UI SDK vereint über 50 Verhaltensweisen, darunter Tastaturnavigation, Fokus, Auswahl, Popups, Drag-and-Drop, Größenänderung, Canvas mit Verschieben und Zoomen, virtualisierte Listen und Screenreader-Unterstützung. Sie funktionieren in React, Vue, Svelte, Solid und Web Components, mit Adaptern im Paket @ui-sdk/core. Das Projekt liefert außerdem eine Starter-Komponentenbibliothek mit, die vollständig aus denselben Verhaltensweisen gebaut ist. Zur Nutzung genügt es, die Pakete zu installieren und den UI-SDK-Skill zum Agenten hinzuzufügen.

Agenten, die die Oberfläche auch bedienen

Agenten lernen nicht nur zu bauen, sondern auch zu nutzen, was sie bauen: Eine Agent-Bridge lässt sie die Seite lesen und die Steuerelemente direkt bedienen, ohne Screenshots. Laut Vercel macht das den Agenten mehr als doppelt so schnell bei weniger als der Hälfte der Kosten – Zahlen des Unternehmens selbst, ohne unabhängige Überprüfung. Das Repository überschritt am Starttag 1.000 Sterne auf GitHub.

Erste Schritte

Um das UI SDK zu nutzen, installieren Sie die Pakete für Ihr Framework – zum Beispiel npm install @ui-sdk/react @ui-sdk/core – und fügen Sie den Skill mit npx skills add vercel-labs/ui --skill ui-sdk zum Agenten hinzu. Von dort wählt der Agent die benötigten Verhaltensweisen und baut die Komponente im Framework des Projekts zusammen, mit Tastaturnavigation und Screenreader-Unterstützung bereits inklusive.

Bild: offizielle Identität des UI SDK. Quelle: Vercel (ui-sdk.dev).

Quellen

Dieser Text wurde mit Hilfe künstlicher Intelligenz erstellt und mit öffentlichen Beiträgen auf X sowie Quellen aus dem Internet abgeglichen. Bitte bestätigen Sie die Angaben in den Originalquellen.

Von Muse