Pixels and Process #2 - Geeking over the good stuff (with a cup of coffee 🍵)
Sharp reads, shiny tools, quick tactics, and a wildcard curated for designers who love systems, speed, and small sparks of inspiration.
Things I found useful or just plain cool this week. Grab a coffee🍵 and let’s geek over some good stuff.
🧠Sharp reads/Deep dives
Thinking in systems and designing with AI
This week, two pieces made me pause and rethink how much the design process has shifted and made me reflect on my own workflow at work.
Prompt to Code: Why I Stopped Prototyping in Figma and What This Means for Product Designers by Elie Thomas Majorel
It’s a clear, real-world walkthrough of how Elie moved from prototypes in Figma to building AI-generated apps using Claude/ChatGPT to write structured specs and Lovable to generate the actual frontend. He talks about shipping actual features, with engineers forking his AI-generated code and pushing it to production in days.
My playbook for vibe coding (Dive Club) - Michael Riddering
Ridd’s flow is a little different but aligned. He treats GPT like his CTO and Cursor like his dev. He starts by dumping full project context into GPT, then asks it to question him. Once GPT understands the problem, it breaks the project into phases and generates prompts → Cursor implements them → GPT reviews the output → the loop continues.
My own process is somewhere in between all of this.
Also, the truth is my prototypes (I prefer v0) are not perfect. Several forks and iterations later some parts of it remain broken. And honestly, they require polish. My idea is to almost get there as fast as possible, so I could speed up turn around time.
Reading Elie’s article has me thinking about my prompts especially how I could frame specs.
Watching Ridd made me realize the value of staying in the loop, and having ChatGPT actually ask questions and close gaps, so the output is a lot better. Not just writing prompts once and moving on.
Why You Should Read/Watch
Whether or not your organisation is shipping AI-generated code doesn’t matter.
For me, its about the workflow shift around the entire design process. AI augmented design is definitely fast and efficient.
🛠 Shiny tools
Kigen - Create Design System Variables and Styles Fast
This one's from Vijay Verma, and it’s a handy little tool if you’re working on design systems inside Figma.
What it does is simple, but extremely useful.
Lets you generate your full token setup: color, typography, numbers.
Comes with pre-built colour palettes.
Supports semantic/alias tokens.
Exports your tokens cleanly as CSS or JSON.
Kigen is for when you want to move fast, stay inside Figma, and get your variables created from scratch. You can tweak things later, but the jumpstart is solid.
⚡Quick tactics/Workflow hacks
Rename Layers!
All of us encounter unnamed frames in our Figma files (we are guilty of doing this at some point in our design life!). When inspecting, you’re left clicking, expanding, scrolling and just hoping you land on the right thing.
This annoying problem has a surprisingly easy fix, thanks to Figma’s AI feature called “Rename layers”. Your layers auto-populate with names with one click!
🎲 Wildcard
Behind The Scenes Of Notion's INSANE Design (w. Notion Team)
This video is such a good reminder of why certain products just feel good. You can feel the obsession. Every little interaction, every decision, it’s all considered.
What I loved:
How much they reveal about the product thinking behind Notion Mail.
How much care goes into making things feel invisible and intuitive.
Interaction Design at a micro level.
In the end, the video wins for me because of one thing - a genuine passion for craft and detail.
👀Archives
If you're new here or missed a few of my “design drops”, you could dig into the archives.
Or start here if you want to 👇