Generate Mcp App Ui (Grade A)Sicherheitsgetestetes Entwicklungstalent für Claude AI. Grade A. Generate an MCP App Widget (selbstständige HTML) für ein MCP-Tool.
Übersicht
Hauptfunktionen
- Erzeugt selbstständige HTML-Widgets
- Unterstützt interaktive Widgets mit der Funktion callServerTool
- Behandelt verschiedene Datentypen mit type-sicheren Prüfungen
- Fördert den Einsatz von Fluent UI und Designleitlinien für visuelle Konsistenz
Preise
- Modell
- Free
- Kategorie
- Fähigkeiten
- Bewertung
- Noch keine Bewertungen
Anwendungsfälle
Visualisierung der Tool-Ausgabe
Ein Benutzer möchte die Ausgabe eines Tools als Diagramm oder Tabelle in einem Chat-Gespräch visualisieren. Er liefert eine Beschreibung des gewünschten visuellen Ansatzes und das Testergebnis des Tools als JSON.
Interaktiver Dashboard
Ein Benutzer wünscht ein interaktives Widget, das Daten von einem Tool anzeigt und die Daten aktualisiert. Der Benutzer liefert einen Toolnamen und das Testergebnis als JSON.
Pro & Contra
Pro
- Generiert visuell ansprechende Widgets für Chat-Gespräche
- Ermöglicht interaktive Widgets mit Aktualisierungs-fähigkeit
- Fördert kompakte und konzentrierte visuelle Darstellungen von Daten
Contra
- Benötigt spezifische Eingaben des Benutzers (Beschreibung des visuellen Ansatzes und Testergebnis des Tools)
- Grenzen sich auf die Erzeugung von Widgets auf der Grundlage bereitgestellter Daten, ohne Annahmen über die Form der Daten zu treffen
Bewertungen
Melde dich an, um eine Bewertung abzugeben.
Noch keine Bewertungen. Sei die/der Erste!
Fragen & Antworten
Can the widget refresh data automatically?
If you provide a tool name, the generated HTML can include a `callServerTool` function that lets the widget call the tool and refresh its data. Without a tool name, the widget displays the data read‑only.
Asked by Bilal Choudhury · Jan 11, 2026
Is there a learning curve to using this skill?
The main steps are describing the desired visual (e.g., chart, table) and supplying the tool’s JSON output. Once those are provided, the skill outputs the HTML; no additional coding is needed, though familiarity with Fluent UI guidelines can help customize the look.
Asked by Sarai Cohen · Jan 11, 2026
Do I need to provide my tool’s data before creating a widget?
Yes. The tool requires a test output in JSON format from the tool you want to visualize. Without this JSON, it will prompt you to paste it; it will not guess the data shape.
Asked by Yara Mansour · Nov 20, 2025
What kind of visual outputs can this tool generate?
It creates self‑contained HTML widgets such as charts, comparison tables or maps that display a tool’s JSON output. The widget is styled with Fluent UI for consistency and can be interactive if a tool name is supplied.
Asked by Tobias Hartmann · Oct 18, 2025
Frage stellen
Alternativen zu Fähigkeiten
Using Git Worktrees (Grade A)FähigkeitenSicherheitsgetesteter Daten- und KI-Workflows für Claude AI. Klasse A. Verwenden, wenn Sie Feature-Arbeiten starten, die von der aktuellen Arbeitsumgebung isoliert werden müssen, oder bevor Sie Implementierungspläne ausführen - erstellt isolated Git Worktrees
Ga4 Bigquery Schema (Grade A)FähigkeitenSicherheitsgetestete Daten-AI-Fähigkeit für Claude AI. (Grade A). GA4 BigQuery Export-Schema-Referenz — vollständiger Feldbezug, verknüpfte Strukturen, Abfragemuster und Leistungs-Tipps
Meta Capi (Grade A)FähigkeitenSicherheitsgeprüfte data-ai-Fähigkeit für Claude AI. Grade A.
Callees (Grade A)FähigkeitenSicherheitstests für die Entwicklung von Claude AI. Note: A. Aufrufgraph der direkten Aufrufe auflisten
Test Module Name (Grade A)FähigkeitenSicherheitsgetestete daten-AI-Fähigkeit für Claude AI. Grade A. Benenne Haskell-Testmodule nach dem zu testenden Modul mit einem Spec-Suffix im gleichen Namespace.
Board Of Directors (Grade A)FähigkeitenErforscht-geprüftes Datenspiel für AI. Bester Ruf. Simuliere eine Diskussion einer 5-köpfigen Expertenjury für wichtige Entscheidungen. Verwendung für die Bewertung von Plänen, Architekturauswahl, Funktionsdesigns oder jeder Entscheidung.
Advpl Mvc Avancado (Grade A)FähigkeitenSicherheitsgeprüfte Entwicklungsfertigkeit für Claude AI. Grade A. Fortgeschrittenes MVC über PE (Punkte des Eingangs) – benutzerdefinierte Grids zu Standard-MVC-Bildschirmen hinzufügen (CNTA300/MATA070/MATA440/MATA460/FINA040 via *STRU)
Sicherheitsgetestete Workflow-Fähigkeit für Claude AI. Klasse A. **WORKFLOW-SKILL** — Gewährleistung der Genauigkeit und Aktualität der Repository-Dokumentation auf allen Seiten: Dokumentationsseite, Agenten-Dateien und Changelog. WANN: 'update docs'
Trending now
Biology AIBildung AIGenaue Hilfe bei Hausaufgaben mit ausführlichen Erklärungen
Reducto AIPlattformen für die Entwicklung von Agenten mit künstlicher IntelligenzIntelligenter Dokument API zur Analyse, Trennung, OCR-Analyse und Strukturierung von komplexen PDFs, Präsentationen und Tabellenkalkulationen.
Pixtral 12B 24.09Large Language ModelOffenes multimodales 12B-Modell, das ineinander verschachtelte Bilder und Text mit einem Kontextfenster von 128 K verarbeitet.
AdCrierMarketing & WerbungGepflichtete Antworten mit Provision pro Klick.