← Leitfäden Vorschau: Open Design mit Sealos Skills in die Cloud bringen
Vorschau

Open Design mit Sealos Skills in die Cloud bringen

Basierend auf der Demo von Sealos: Open Design von einem lokalen Workspace in eine live laufende Cloud-App bringen. Ein Coding-Agent startet es aus dem GitHub-Repo, dann analysiert Sealos Skills das Docker-Setup, die Ports und die Umgebungsvariablen und deployt es auf eine öffentliche URL, die jeder öffnen kann.

Sealos 15. Juni 2026 3:59 YouTube ↗

Open Design ist auf dem eigenen Rechner großartig – aber eine lokale URL funktioniert nur für dich, nicht für dein Team, Kunden oder Partner. Diese Anleitung folgt der Demo von Sealos, in der ein Coding-Agent Open Design aus dessen GitHub-Repo startet und anschließend Sealos Skills es auf eine öffentliche Cloud-URL deployt. Sieh dir das Video oben für den Live-Durchlauf an, oder lies weiter für die Textversion.

Der Open-Design-Workspace läuft, bevor er in die Cloud geht. Open Design läuft lokal: ein quelloffener, agent-nativer Design-Workspace – der Ausgangspunkt, bevor man ihn online bringt.

Was ist Open Design?

Open Design ist ein quelloffener, agent-nativer Design-Workspace – eine Alternative zu Claude Design und Figma, die auf dem Coding-Agenten läuft, den du bereits nutzt. Ein paar Dinge, die vor diesem Walkthrough gut zu wissen sind:

  • Open Source, Apache-2.0 – lies jede Zeile und hoste es selbst, wo immer du willst.
  • Local-first oder selbst hostbar – auf dem eigenen Rechner betreiben oder in die Cloud bringen (genau das macht diese Anleitung).
  • Eigenen Agenten und eigenen Key mitbringen – die Generierung läuft über Claude Code, Codex, Gemini und mehr, mit deinem eigenen Modellzugang.
  • Mehr als Prototypen – Webseiten, Prototypen, Dashboards, Slide-Decks und andere Deliverables, alles aus einem Workspace.

Warum Open Design in die Cloud verschieben

Wenn du Open Design aus dem Quellcode betreibst, öffnet sich der Workspace auf einer lokalen URL. Für die Arbeit allein ist das perfekt: starten, gestalten, das Ergebnis live in der Vorschau sehen. Aber wie die Sealos-Demo zeigt, gibt es einen Haken – diese Adresse ist im Grunde localhost. Sie funktioniert für dich, aber niemand sonst kommt heran.

Um ein Design mit Teammitgliedern zu teilen, einem Kunden einen funktionierenden Prototyp zu übergeben oder externen Nutzern das Ergebnis erlebbar zu machen, braucht die App eine öffentliche URL. Genau darum geht es in diesem Walkthrough: Open Design von einem lokalen Workspace in einen Online-Dienst zu überführen, sodass „lokal laufen“ nur der Anfang ist.

Open Design aus dem GitHub-Repo starten

Statt Installationsdokumente von Hand durchzulesen, übergibt die Demo die ganze Aufgabe einem Coding-Agenten (hier Codex). Die Idee ist simpel: den Agenten auf das GitHub-Repository von Open Design zeigen lassen und ihn die Einrichtungsarbeit erledigen lassen.

  • Gib dem Agenten das Repo. Schick ihm den GitHub-Link und bitte ihn, Open Design zum Laufen zu bringen. Er liest die README und die Kurzanleitung, ermittelt die Installationsschritte und führt sie für dich aus.
  • Öffne die lokale URL. Wenn der Start abgeschlossen ist, liefert der Agent eine URL. Öffne sie, und der Workspace lädt – keine manuelle, Befehl für Befehl ausgeführte Installation deinerseits.

Weil Open Design quelloffen ist, kann der Agent das Repo direkt untersuchen: die Projektstruktur, wie es laufen soll und was es benötigt. Genau das macht den nächsten Schritt – das Cloud-Deployment – zu einer Aufgabe für den Agenten statt zu manueller Arbeit.

Im Workspace gestalten

Sobald der Workspace geöffnet ist, wirst du merken, dass es sich nicht um ein gewöhnliches Chat-Tool handelt. Du kannst aus einer Reihe von Skills wählen – Webseiten, Prototypen, Dashboards, Decks – und ein Designsystem auswählen, damit die Ausgabe einen einheitlichen visuellen Stil trägt.

Die Demo wählt einen Prototype-Skill, fügt ein Briefing ein, und der Agent beginnt sofort zu arbeiten. Dabei fragt er nach deiner kreativen Absicht, und du antwortest je nachdem, was du möchtest. Der Agent läuft links, während die Ausgabe rechts in Echtzeit in der Vorschau erscheint – es funktioniert genau wie ein lokaler KI-Design-Workspace.

Ein in Open Design generierter Prototyp. Eine im Workspace generierte Landingpage – der Agent arbeitet links, die Live-Vorschau rendert rechts.

Im Plugin-Hub kannst du den kompletten Katalog an Skills und Designsystemen durchstöbern, sodass du nie bei einer leeren Leinwand anfängst.

Der Open-Design-Plugin-Hub. Der Plugin-Hub: Skills und Designsysteme, die du anwenden kannst, um zu bestimmen, was der Workspace erzeugt.

Mit Sealos Skills auf Sealos Cloud deployen

Hier wird das Problem der lokalen URL gelöst. In der Demo lautet die nächste Anweisung an Codex schlicht: Nutze Sealos Skills – ein Skill-Paket für KI-Agenten – um das Open-Design-Projekt zu analysieren und es auf Sealos Cloud zu deployen.

Sealos Skills verschafft dem Agenten das Deployment-Know-how, das er sonst nicht hätte. So läuft der Ablauf in der Demo:

  1. Das Projekt analysieren. Der Skill untersucht die Projektstruktur, das Docker-Setup, die Ports und die Umgebungsvariablen – die Details, die bestimmen, wie die App in der Cloud laufen soll.
  2. Einen Deployment-Plan erzeugen. Aus dieser Analyse erstellt er die Deployment-Konfiguration für Sealos Cloud.
  3. Bestätigen und deployen. Sieht der Plan gut aus, antwortest du bei der Rückfrage mit yes, und er deployt das Projekt automatisch auf Sealos Cloud.
  4. Eine öffentliche URL erhalten. Nach dem Deployment liefert Sealos einen öffentlichen Zugangslink – keine lokale Adresse mehr. Teammitglieder, Partner und externe Nutzer können ihn öffnen und die App direkt erleben.

Die entscheidende Verschiebung dabei ist, wer die Arbeit macht. Ein Open-Source-Projekt zu deployen bedeutet normalerweise viel manuelles Abwägen: Konfigurationen lesen, Ports abgleichen, Umgebungsvariablen verdrahten und Fehler beheben, wenn etwas nicht klappt. Sealos Skills macht daraus einen Workflow, den ein KI-Agent Ende-zu-Ende ausführen kann – analysieren, deployen, verifizieren und ausliefern.

Vom lokalen Workspace zur live laufenden Cloud-App

An diesem Punkt ist Open Design von einem lokalen Werkzeug zu einem Online-Dienst geworden. Der eigentliche Wert liegt nicht nur darin, das Design aus dem Workspace herauszuholen – sondern darin, dass ein manuelles, urteilsintensives Deployment zu etwas geworden ist, das ein Agent wiederholt und zuverlässig ausführen kann. Lokal zu laufen ist nur ein Anfang; für andere erreichbar zu sein ist das, was aus deiner Arbeit etwas macht, das du tatsächlich teilen kannst.

FAQ

Muss ich Sealos nutzen, um Open Design zu betreiben? Nein. Open Design ist local-first – es auf dem eigenen Rechner zu betreiben funktioniert einwandfrei. Sealos ist der Drittanbieter-Cloud-Host, der in dieser Demo verwendet wird, um die App über eine öffentliche URL erreichbar zu machen; du kannst sie auch selbst hosten, wie du möchtest, da sie unter Apache-2.0 quelloffen ist.

Was ist Sealos Skills? Es ist ein Skill-Paket für KI-Agenten, das in der Demo Codex antreibt. Es verschafft dem Agenten Deployment-Know-how – die Analyse des Docker-Setups, der Ports und der Umgebungsvariablen eines Projekts, das Erstellen eines Deployment-Plans und das Veröffentlichen der App auf Sealos Cloud.

Was macht der Agent während des Deployments tatsächlich? Er liest die Projektstruktur, prüft die Docker-Konfiguration, die Ports und die Umgebungsvariablen, erstellt eine Deployment-Konfiguration und deployt – sobald du bestätigst – in die Cloud und liefert eine öffentliche URL zurück.

Ist Open Design kostenlos? Ja – es ist quelloffen unter der Apache-2.0-Lizenz. Du zahlst nur für die Modell-/API-Nutzung des jeweils verbundenen Coding-Agenten, plus etwaiges Cloud-Hosting (wie Sealos), das du nutzen möchtest.

Welchen Coding-Agenten verwendet das hier? Die Demo nutzt Codex, aber Open Design läuft auf jedem Coding-Agenten, den du verbindest – Claude Code, Codex, Gemini und andere – mit deinem eigenen Key.


Diese schriftliche Anleitung basiert auf der Demo von Sealos. Sieh dir das vollständige Video oben an und abonniere Sealos für mehr zum Thema Cloud-Deployment mit KI-Agenten.