Update: Started off just moving around frames in Figma to see if I could understand its auto-layout system, intending only to play designer for a little. I made a very simple but janky sign up page.

I then fed that figma frame along with color variables to Figma Make (an AI assistant) and it churned out the second multi-step sign in. I was able to copy and paste its code into an existing Next.js project and the multi-step flow just works. Admittedly, I recently got used to Tailwind / Shadcn-ui

So I'm still a janky designer, but knowing how Next.js projects work I was able to copy and paste a couple files and got the latter images. Wild stuff. I still want to work on design principles, and wouldn't deploy as prod right away. But I am pretty impressed with what the AI shat out in a few minutes, using only one janky frame as an example.

Colors are from Rainglow's "Newton Contrast" theme