Navrhovanie pomocou AI funguje najlepšie ako slučka: opisujete, umelá inteligencia navrhuje, posudzujete a dolaďujete a opakujete. AI je rýchla pri vytváraní možností. Ste zodpovedný za výber toho správneho.
Krok 1: Napíšte stručný prehľad. Opíšte používateľa, úlohu, obsah a akékoľvek obmedzenia. „Obrazovka s nastaveniami rozpočtovej aplikácie pre ľudí na telefónoch so sekciami pre účet, upozornenia a súkromie s využitím našich existujúcich komponentov“ poskytne oveľa lepší výsledok ako „vytvoriť stránku nastavení“.
Krok 2: vytvorte koncepty. Nástroje s výzvou na používateľské rozhranie, ako napríklad Google Stitch alebo asistent AI UXPin, premenia popis alebo náčrt na obrazovky. Požiadajte o niekoľko variantov a porovnajte ich, než akceptujte prvý.
Krok 3: dolaďte v dizajnovom nástroji. Prineste najlepší návrh do Figma, Penpot alebo iného editora. Opravte hierarchiu, medzery a kopírovanie a navrhnite stavy, ktoré AI zvyčajne preskakuje: načítavanie, prázdne, chyba a vypnuté.
Krok 4: pripojte sa ku kódu. Rozhranie môžu vytvoriť nástroje na kódovanie AI, ako sú Claude Code a Cursor. Výsledky sú oveľa lepšie, keď môžu čítať váš návrh prostredníctvom servera MCP. Figma a Penpot majú jeden. Pre interaktívne a animované časti má ExodeUI, ktorý vyrábame, server MCP, ktorý umožňuje AI vytvárať a upravovať animácie so stavmi a fyzikou pružiny z výziev v jednoduchom jazyku, ktoré sú uložené v otvorenom súbore .exode, ktorý vaša aplikácia prehráva.
Krok 5: Pred odoslaním skontrolujte. Skontrolujte používanie klávesnice a čítačky obrazovky, kontrast, znížený pohyb, malé a veľké obrazovky a dlhý alebo preložený text. Zaobchádzajte s výstupom AI ako s prácou rýchleho, ale nového spoluhráča: užitočné, ale vždy kontrolované.