Wie man mit Turbine Widgets und KI eine benutzerdefinierte Sicherheitsoberfläche erstellt
Sicherheitsteams mangelt es selten an Daten. Was ihnen fehlt, ist die richtige Darstellung. Das Dashboard zeigt nur annähernd alles, was ein Schichtleiter benötigt. Die Falldarstellung zwingt einen Analysten, vier Tabs zu öffnen, um eine einzige Warnmeldung nachzuvollziehen. Standard-Oberflächen kommen dem Ziel zwar nahe, aber dann ist Schluss.
Turbine Widgets schließen die letzte Lücke. Ein Widget ist eine kleine, individuell anpassbare Benutzeroberflächenkomponente, die Sie in Swimlane Turbine erstellen und in einen Anwendungsdatensatz oder ein Dashboard einfügen. So zeigt die Plattform genau das an, was Ihr Security Operations Center (SOC) benötigt – und zwar so, wie es benötigt wird. Dieser Leitfaden erklärt, was Widgets sind, wo sie ausgeführt werden, stellt einige Beispiele vor, die Sie übernehmen können, und zeigt die drei Möglichkeiten, ein Widget zu erstellen – von einer einzigen Codezeile bis hin zu einer verständlichen Benutzeroberfläche.
Keine Zeit? Das untenstehende Video behandelt denselben Sachverhalt in wenigen Minuten.
Wichtigste Erkenntnisse
- Widgets sind benutzerdefinierte Webkomponenten, die die Turbine-Benutzeroberfläche für Falldatensätze und Dashboards erweitern.
- Es gibt drei Möglichkeiten, ein Widget zu erstellen: Import aus dem CDN, Programmierung von Grund auf oder Beschreibung für Hero AI.
- Der Widget-Katalog enthält über hundert Beispiele mit vollständigem Quellcode, den Sie anpassen können.
Was ist ein Turbinen-Widget?
Ein Turbine-Widget ist eine benutzerdefinierte Webkomponente, die in Swimlane Turbine gerendert wird und Ihre Daten lesen, anzeigen und aktualisieren kann. Widgets werden mit Lit, einer schlanken Webkomponentenbibliothek, erstellt und erweitern die Basisklasse SwimlaneElement. Diese Basisklasse bildet die Brücke zur Plattform: Sie übergibt die aktuellen Datensatz- oder Berichtsdaten, stellt den Sitzungskontext bereit und ermöglicht dem Widget den Aufruf beliebiger Turbine-APIs, ohne dass Sie Tokens oder Authentifizierung verwalten müssen. Wenn Sie bereits mit HTML, CSS und JavaScript gearbeitet haben, wird Ihnen das Modell vertraut vorkommen.
Der Nutzen ist größer, als es zunächst klingt. Anstatt die von Turbine mitgelieferten Bildschirme zu verwenden, können Sie die Benutzeroberfläche erweitern und Ihren Analysten jede beliebige Ansicht präsentieren.
Widgets werden innerhalb von Turbine selbst gerendert. Hier befindet sich eines auf einem Datensatzlayout.
Datensatz-Widgets vs. Bericht-Widgets
Widgets werden an zwei Stellen gerendert, und die Position bestimmt, welche Daten sie sehen können.
- Datensatz-Widgets Sie können auf einem Datensatzlayout, einem Fall oder einer Warnung basieren und mit den Feldern dieses Datensatzes arbeiten. Sie eignen sich ideal für Risikobewertungsanzeigen, Ereigniszeitleisten, Statusanzeigen oder eine konsolidierte Gesamtansicht einer Warnung.
- Bericht-Widgets Sie sitzen auf einem Dashboard und lesen aggregierte Daten aus einer Berichtsabfrage, was sie ideal für Metriken, Diagramme, Gesundheitsmonitore und mandantenübergreifende Rollups macht.
Gleiches Framework, zwei Anwendungsbereiche: die Daten eines einzelnen Datensatzes oder die Daten über viele Datensätze hinweg.
Datensatz-Widgets lesen einen Datensatz. Bericht-Widgets lesen mehrere Datensätze.
Top 3 Beispiele für Turbinen-Widgets, die es wert sind, übernommen zu werden
Der Katalog enthält über hundert Widgets, jeweils mit vollständigem Quellcode. Daher lernt man die Muster am schnellsten, indem man mit einem einzigen beginnt. Drei davon verwenden wir besonders häufig:
#1 ROI-Rechner-Widget
Das ROI-Rechner-Widget ist ein Berichts-Widget, das Playbook-Ausführungen, Aktionsausführungen und den Einsatz von Hero AI in Zeit- und Kosteneinsparungen umrechnet. Es beantwortet die Frage, die jeder SOC-Leiter früher oder später vom Unternehmen gestellt bekommt: Was bringt das Ganze?
ROI-Rechner: Zeit- und Kostenersparnis durch Playbook, Aktion und Hero AI-Aufforderung.
Fallzusammenfassung #2
Das Fallzusammenfassungs-Widget arbeitet auf Datensatzebene. Es sammelt eine Benachrichtigung in einem einzigen Bereich anstatt in einem halben Dutzend Registerkarten.
Fallzusammenfassung: Eine Benachrichtigung und alles, was damit zusammenhängt, in einer Ansicht.
#3 MITRE ATT&CK Heatmap-Widget
Dieses Berichts-Widget visualisiert das Alarmaufkommen anhand der MITRE ATT&CK-Matrix. Wie in der Abbildung unten zu sehen ist, zeigt die Farbe, wo sich die Alarme häufen und – noch wichtiger – wo Lücken bestehen. Es findet daher oft einen festen Platz auf dem Display des SOC.
MITRE ATT&CK Heatmap: Wo sich die Erkennungen konzentrieren und wo die Lücken liegen
Drei Wege zum Bau eines Turbinen-Widgets
Wie Sie ein Widget erstellen, hängt davon ab, wie viel Code Sie bearbeiten möchten. Alle drei Wege nutzen denselben Editor und dieselbe Komponentenbibliothek swim-ui, wodurch Ihre Widgets stets wie nativ in Turbine integriert aussehen.
1. Import aus dem Content Delivery Network. Viele Widgets sind auf dem Swimlane CDN gehostet und sofort einsatzbereit. Fügen Sie einfach eine Importzeile in den Widget-Editor ein, speichern Sie die Änderungen, und das Widget wird angezeigt. Legen Sie eine Version fest, wenn Sie Wert auf Stabilität legen. Framework-Kenntnisse sind nicht erforderlich.
2. Von Grund auf neu entwickeln. Öffnen Sie den Widget-Editor und schreiben Sie den Lit-Code selbst: Erweitern Sie SwimlaneElement, binden Sie swim-ui ein und definieren Sie Ihre Render-Methode. Dieser Weg bietet Ihnen volle Kontrolle und ist der beste, um das Framework kennenzulernen. Die Dokumentationsseite unter swimlane.github.io/custom-Widgets enthält die API-Referenz, die Komponentenbibliothek und den Quellcode für den gesamten Katalog.
3. Mit Hero AI erstellen. Öffnen Sie den Widget-Editor und wählen Sie “”Mit Hero AI erstellen“. Beschreiben Sie in einfachen Worten, was Sie möchten, und Hero tritt auf den Plan. Widget-Erstellungsmodus, Der Widget-Code wird im Code-Tab generiert und in einer Live-Vorschau angezeigt. Überprüfen Sie ihn, klicken Sie auf „Anwenden“, und er wird im Layout angezeigt. Sie können die Einstellungen in derselben Sitzung weiter verfeinern. Hero stellt bei Bedarf Rückfragen. Hero AI muss in Ihrem Tenant aktiviert sein.
Mit Hero AI erstellen: Widget beschreiben, generierten Code in der Vorschau anzeigen und auf „Anwenden“ klicken.
Erleben Sie den Swimlane AI SOC
Swimlane Turbine revolutioniert Ihre Sicherheitsarchitektur durch agentenbasierte Ausführung und Low-Code-Playbooks. Standardisieren Sie Ihre Arbeitsabläufe, um manuelle Routinearbeiten zu eliminieren und in Höchstgeschwindigkeit zu agieren.
Häufig gestellte Fragen
Was ist ein Turbinen-Widget?
Eine benutzerdefinierte Webkomponente, die innerhalb von Swimlane Turbine ausgeführt wird und Ihre Daten lesen, anzeigen und aktualisieren kann. Widgets erweitern die Benutzeroberfläche der Plattform in Datensatzlayouts und Dashboards mithilfe des Lit-Frameworks und der Swimlane-Element-Basisklasse.
Wo laufen Turbine Widgets?
An zwei Stellen. Datensatz-Widgets werden in einem Datensatz-Layout ausgeführt und arbeiten mit den Feldern eines einzelnen Datensatzes. Bericht-Widgets werden in einem Dashboard ausgeführt und lesen aggregierte Daten aus einer Berichtsabfrage.
Muss ich programmieren können, um so etwas zu bauen?
Nicht unbedingt. Sie können ein fertiges Widget mit einer einzigen Zeile aus dem CDN importieren oder Hero AI beschreiben, was Sie benötigen, und den Code generieren lassen. Das Programmieren von Grund auf ist optional und bietet Ihnen die größte Kontrolle.
Kann Hero AI ein Widget für mich erstellen?
Ja. Wählen Sie im Widget-Editor „Mit Hero AI erstellen“, beschreiben Sie das Widget in einfacher Sprache, und Hero generiert den Code, den Sie in der Vorschau ansehen und anwenden können. Hero AI muss in Ihrem Tenant aktiviert sein.
Wie viele Widgets sind verfügbar?
Der Katalog umfasst mehr als hundert Widgets, die jeweils mit vollständigem Quellcode veröffentlicht sind, den Sie studieren und an Ihre Umgebung anpassen können.
Sind Sie bereit, Ihre eigenen Widgets zu entwickeln?
Wählen Sie eine Ansicht, die sich Ihr Team schon lange wünscht, und erstellen Sie sie – egal ob Sie eine aus dem CDN importieren, sie von Grund auf selbst programmieren oder sie Hero AI beschreiben. Teilen Sie sie anschließend: Posten Sie Ihr Widget auf LinkedIn und verlinken Sie Swimlane. Wenn es unseren Erwartungen entspricht, senden wir Ihnen etwas zu.

