De nieuwe AI-workflow: Ontwerpen en bouwen in één interface met Cursor

Hoe een AI-startup de kloof tussen design en developer wil dichten

Tech-startup Cursor breidt uit met een nieuwe tool voor ontwerpers die lijkt op wat bekende producten zoals Figma doen, maar dan anders: direct gekoppeld aan echte code. De functie, genaamd Visual Editor, geeft ontwerpers professionele visuele controles én laat ze AI-gestuurde aanpassingen doen met gewone taal, zonder abstractielagen tussen design en de code die écht wordt gebruikt op het web.

Meer dan alleen een mooi plaatje

Waar traditionele ontwerpsoftware werkt met vectoren, frames en mock-ups, wil Cursor de wereld van pixels én productie-code samenbrengen. Visual Editor combineert een klassieke ontwerpinterface met een AI-agent die rechtstreeks de onderliggende CSS-code genereert of aanpast. Je kunt bijvoorbeeld een knop een andere kleur geven door het simpelweg te vragen in tekst — en de AI past dit meteen toe op echte, werkende code.

Volgens het bedrijf is dit geen gimmick: elke visuele instelling correspondeert met echte CSS-regels, waardoor wat je ontwerpt daadwerkelijk de pagina vormt die gebruikers straks zien.

Cursor Launches an AI Coding Tool For Designers – The Gaming Boardroom ONTDEK MEER

Cursor: Van coderingshulp tot designersuite

Cursor startte als een AI-hulpmiddel voor ontwikkelaars maar wil nu een bredere rol spelen in het maken van software. Het bedrijf heeft sinds de lancering in 2023 meer dan $1 miljard jaarlijkse terugkerende omzet gehaald en werd recent gewaardeerd op bijna $30 miljard, met klanten zoals Nvidia, Salesforce en PwC.

Door ontwerpers en developers binnen één interface te laten samenwerken, wil Cursor de traditionele hand-off tussen teams elimineren. Ontwerpers hoeven hun werk niet langer eerst in tools zoals Figma te maken en dan over te dragen aan coders — de AI-agent kan deze stappen samen uitvoeren.

Real-world aanpassingen: Directe feedback op live sites

In een demo kon Cursor de styling van een bestaande website inspecteren en aanpassen alsof het in de codebase zat. Lettertypen, kleurwaarden en layout variabelen werden realtime zichtbaar en wijzigbaar — dezelfde controles die je zou verwachten van traditioneel design-software, maar nu live gekoppeld aan daadwerkelijke webpagina’s.

Die combinatie van visuele interface én directe code-wijzigingen moet vooral aantrekkelijk zijn voor professionele teams die complexe apps bouwen in plaats van simpele demo’s.

Wat betekent dit voor Figma en andere design-tools?

Tools zoals Figma bestaan al lang als de standaard voor UI-/UX-design, met realtime samenwerking, prototyping en design systemen waarin teams samen werken. Figma’s kracht ligt in creatieve workflows en conceptontwikkeling, terwijl Cursor nu inzet op een rechtstreekse brug van ontwerp naar code.

Cursor richt zich op ontwerpers die al werken met code of daar snel naartoe willen evolueren. In een markt die steeds meer AI-integratie verlangt, is dit een interessante nieuwe richting, al blijven traditionele tools zoals Figma een belangrijke plek behouden voor visueel en UX-gericht werk.

Gratis collaboratieve ontwerp-tool voor teams | Figma Met onze gratis software voor websiteontwerp kun je creëren, samenwerken en je werkprocessen te optimaliseren. Combineer efficiënte ontwerpfuncties die zijn ontwikkeld voor de toekomst van het web. https://www.figma.com

Wat ontwerpers kunnen verwachten

• Visual Editor combineert visuele ontwerp controles met AI-gestuurde, natuurlijke taalcommando’s.
• Elk visueel element komt overeen met echte CSS-code, waardoor designs meteen productieklaar zijn.
• Cursor’s AI-browser laat gebruikers live sites inspecteren en bewerken binnen dezelfde workflow.
• De integratie richt zich op professionele workflows, niet alleen snelle demo’s.

Of deze aanpak de plaats van traditionele designplatforms daadwerkelijk zal innemen — of ze juist zal complementeren — moet de tijd leren. Maar één ding is duidelijk: de manier waarop interface-ontwerpen worden gemaakt en omgezet in code verandert snel.