Onlook im Praxistest: Eine neue Perspektive auf Vibe-Coding für Designer

Vibe-Coding für Designer: Onlook im Praxistest

Der Begriff "Vibe-Coding" ist in aller Munde. KI übernimmt dabei das Schreiben, Anpassen und Optimieren von Code innerhalb einer Entwicklungsumgebung, während Entwickler:innen lediglich Prompts eingeben. Verschiedene Tools wie Cursor oder Windsurf setzen dieses Prinzip bereits um, basieren auf VS Code und ähneln sich optisch und funktional. Der Fokus liegt hier klar auf dem Code selbst, selbst wenn dieser idealerweise nicht mehr manuell angepasst werden muss.

Onlook, ein weiteres quelloffenes Tool, wählt einen anderen Ansatz. Zwar übernimmt auch hier die KI das Coden, doch das Interface orientiert sich an Designwerkzeugen. Das Onlook-Team bezeichnet das Programm als "Cursor für Designer". Doch hält das Tool, was es verspricht?

Onlook: Funktionsweise und Anwendung

Die Erstellung einer Website oder Web-App mit Onlook beginnt mit einem Prompt, der die gewünschten Features beschreibt. Zusätzlich können Skizzen oder Screenshots als Vorlage dienen. Die KI generiert daraufhin den Code und präsentiert das Ergebnis in Desktop- und Mobilansicht. Änderungswünsche können über ein Chatfenster eingegeben werden. Einzelne Seitenelemente lassen sich anklicken und direkt bearbeiten oder im Chat markieren, um sie per Prompt anzupassen.

Ein Menü am Bildschirmrand bietet eine Baumansicht aller Seitenelemente. Weitere Menüs ermöglichen das Hinzufügen von Bildern und die globale Festlegung von Farben. Der zugrunde liegende Code bleibt dabei weitestgehend im Hintergrund.

Onlook im Vergleich: Stärken und Schwächen

In ersten Tests konnten einfache Web-Oberflächen und sogar kleinere Spiele wie ein Tetris-Klon problemlos erstellt werden. Das Konzept, den Code in den Hintergrund zu rücken, funktioniert. Wer sich nicht mit dem Code befassen möchte, findet in Onlook eine elegante Alternative zu Tools wie Cursor oder Windsurf.

Die Bezeichnung als "Cursor für Designer" erscheint jedoch etwas verfrüht. Cursor bietet derzeit einen größeren Funktionsumfang. Onlook fehlen noch einige Features, die für ein Design-Tool dieser Art wünschenswert wären, wie beispielsweise ein direkter Import aus Figma, obwohl dies in Planung ist.

Zukunftsperspektiven

Onlook hat das Potenzial, sich zu einer ernstzunehmenden Alternative für Designer und all jene zu entwickeln, die beim Vibe-Coding den Code lieber ausblenden möchten. Die Entwicklung bleibt spannend, und es wird sich zeigen, ob Onlook seinen Platz im wachsenden Markt der KI-gestützten Design- und Entwicklungstools behaupten kann.

Quellen:

1. t3n.de: Onlook - Cursor für Designer (https://t3n.de/news/onlook-cursor-designer-ki-1694365/)
2. Finanznachrichten.de: Vibe-Coding mit Onlook (https://www.finanznachrichten.de/nachrichten-2025-06/65780552-vibe-coding-ohne-laestigen-code-onlook-will-das-cursor-fuer-designer-sein-wir-haben-es-ausprobiert-397.htm)
3. Facebook/t3n Magazin: Onlook vs. Vibe-Coding-Tools (https://www.facebook.com/t3nMagazin/posts/onlook-will-sich-von-vibe-coding-tools-wie-cursor-oder-windsurf-abgrenzen-indem-/1160444146120736/)
4. Threads/@t3n_magazin: Onlook und Vibe-Coding (https://www.threads.com/@t3n_magazin/post/DLe8S26sbmD/onlook-will-sich-von-vibe-coding-tools-wie-cursor-oder-windsurf-abgrenzen-indem-)
5. X/t3n: Onlook (https://x.com/t3n/status/1939287564671709537)
6. Newstral: Vibe-Coding mit Onlook (https://newstral.com/de/article/de/1268324951/vibe-coding-ohne-l%C3%A4stigen-code-onlook-will-das-cursor-f%C3%BCr-designer-sein-wir-haben-es-ausprobiert)
7. Reddit/r/ChatGPTCoding: Vibe-Coding Erfahrungen (https://www.reddit.com/r/ChatGPTCoding/comments/1jw0ex9/share_your_vibe_coding_experiences_with_github/?tl=de)
8. t3n.de: Tests & Tools (https://t3n.de/tests-tools/)
9. Reddit/r/InformatikKarriere: Vibe-Coding Erfahrungen (https://www.reddit.com/r/InformatikKarriere/comments/1k881nq/ich_hab_vibe_coding_ausprobiert_und_bin_nun/)