Personlige projekter

Designere, der arbejder i OutSystems, har sjældent værktøjer til rådighed, der fra starten forstår platformens konventioner. Dette projekt er en fork af Sil Bormüllers open source-figma-cli, som er udvidet og omprogrammeret specifikt til designarbejde i OutSystems hos PhoenixDX.

Forken tilføjer brugerdefinerede komponentprompter og kontekst, der er tilpasset OutSystems, sammen med designtokenregler, der dækker både ODC og O11. Ved at forbinde det til Claude Code får du en CLI, der kan oprette og administrere Figma-designs og designsystemer via naturligt sprog, med en praktisk viden om den platform, den faktisk bygger til, i stedet for generiske webkonventioner.

Det er et projekt i udvikling, formet af det virkelige daglige designarbejde hos en OutSystems-partnervirksomhed. Målet er et workflow, hvor værktøjerne allerede taler sproget, så designere bruger mindre tid på at oversætte mellem Figma og OutSystems på hvert projekt.

Idéen til denne portefølje opstod ud af en frustration over løsninger, der kun lige akkurat klarer opgaven. Jeg ønskede noget, der var virkelig interaktivt, i stedet for endnu en standardløsning, så hver eneste komponent blev udviklet til at reagere – hvad enten det var på brugerens bevægelser eller simpel nysgerrighed.

Teknologierne Next.js 15 og Framer Motion gav mig den ydeevne, jeg havde brug for, herunder problemfri flersproget support drevet af DeepL API. Jeg behandlede AI som en fuldgyldig samarbejdspartner under hele processen ved at bruge Google Antigravity IDE og strukturerede "Agent Directives" til at automatisere de kedelige dele af filgenerering og koordinatkortlægning. Det gav mig frihed til at fokusere på de UX-beslutninger, der faktisk betyder noget.

Da jeg arbejdede som designer hos en OutSystems-partnervirksomhed, stødte jeg hele tiden på det samme problem: Figma-variabler og OutSystems CSS kom ud af synkronisering på grund af besværlige manuelle overdragelser. Så jeg udviklede et plugin for at løse problemet. Designtokens overføres nu direkte fra Figma til OutSystems Developer Cloud via en sikker server-til-server REST API, hvilket gør Figma til den eneste pålidelige kilde i stedet for et udgangspunkt, der diskret fortolkes på ny længere nede i processen.

AI-værktøjer gjorde de mere indviklede tekniske problemer overkommelige. At navigere i ODC's strenge cloud-arkitektur – med ting som CORS-begrænsninger og JSON-serialisering – ville traditionelt have krævet et full-stack-team. Ved at samarbejde med AI-agenter under hele forløbet kunne jeg hurtigt komme igennem disse forhindringer og levere et produkt, der var klar til brug. For mig er det et godt bevis på, at designere ikke behøver at stoppe ved overdragelsesgrænsen.

Det bliver hurtigt kedeligt at arbejde med store ikonbiblioteker. Uoverskuelige lagstrukturer, forkert justerede vektorer og det manuelle arbejde med at knytte størrelser til variabler trak mig hele tiden væk fra de egentlige designbeslutninger. Simplify Icons opstod ud af den frustration og er udviklet til at håndtere det gentagne oprydningsarbejde, så jeg slipper for det.

Det, jeg nød mest ved dette projekt, var måden, det tog form på. Ved at kombinere min viden om designsystemer med AI-værktøjer i Antigravity IDE kunne jeg tackle virkelig komplekse krav – såsom rekursiv lagudfladning, streng variabelafgrænsning og WCAG-kompatibel brugergrænseflade – uden at skulle sænke tempoet og skifte til fuld udvikler-tilstand. Det, der ellers kunne have taget uger, blev klaret på en brøkdel af tiden. Det er nu blevet en fast del af min arbejdsgang og en påmindelse om, at designere, der er villige til at udvikle deres egne værktøjer, ikke behøver at vente på, at andre løser deres problemer.