Personlige projekter

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

Forken tilføjer brugerdefinerede komponentprompter og kontekst 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-design og designsystemer gennem naturligt sprog med en praktisk viden om den platform, den faktisk bygger til, snarere end generiske webkonventioner.

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

Opbygningen af denne portefølje skyldtes en frustration over løsninger, der kun lige akkurat får jobbet gjort. Jeg ønskede noget virkelig interaktivt i stedet for endnu en standardløsning, så alle komponenter blev bygget til at reagere, enten på brugerens bevægelser eller simpel nysgerrighed.

Stack'en, 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 rigtig samarbejdspartner gennem hele processen og brugte 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.

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 klodsede manuelle overdragelser. Så jeg udviklede et plugin for at løse problemet. Designtokens flyder nu direkte fra Figma til OutSystems Developer Cloud via en sikker server-til-server REST API, hvilket gør Figma til den eneste kilde til sandheden i stedet for et udgangspunkt, der stille og roligt genfortolkes nedstrøms.

AI-værktøjer gjorde de mere komplicerede tekniske problemer mere tilgængelige. At navigere i ODC's strenge cloudarkitektur, ting som CORS-begrænsninger og JSON-serialisering, ville traditionelt have krævet et full-stack-team. Ved at samarbejde med AI-agenter gennem hele processen kunne jeg hurtigt overvinde disse forhindringer og levere noget, der var klar til produktion. 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. Rodede lagstrukturer, forkert justerede vektorer og det manuelle arbejde med at binde størrelser til variabler distraherede mig fra de egentlige designbeslutninger. Simplify Icons opstod ud af denne frustration og blev udviklet til at håndtere det gentagne oprydningsarbejde, så jeg ikke behøver at gøre det.

Det, jeg nød ved dette projekt, var, hvordan det hele kom sammen. 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 ingeniørtilstand. Det, der kunne have taget uger, blev gjort på en brøkdel af tiden. Det er nu blevet en pålidelig del af min arbejdsgang og en påmindelse om, at designere, der er villige til at bygge deres egne værktøjer, ikke behøver at vente på, at andre løser deres problemer.