Design Tactics #2 — Interactive components or magic?
Welcome to Design Threads—a monthly newsletter where I highlight the top things I’m learning/creating. My vision is for this to be a practical resource that you look forward to seeing hit your inbox.
Since this is the very first issue I have one request:
Will you respond to this email and let me know what you’re hoping to get out of this newsletter?
👆I promise to respond to each and every message. I look forward to hearing from you :)
New workflow that I’m falling in love with 👇
I’ve recently been playing around with building nested interactive + .base components as the very first step in my UI exploration process. You might think I’m crazy… but the workflow is becoming second nature and I love it. Mainly because I can feel my designs come to life in prototype mode (on my laptop) while I’m testing different visuals (on my monitor).
I just finished doing this process a few hours ago and spent the weekend making a new video about it for Figma Academy. Much more to come on this one!
I’ll never use multiple frames to prototype a “toast” interaction ever again 🍞
My entire design career has been spent creating unnecessary frames just to show how a toast (ex: “changes saved”) animates on and off the screen in a prototype…
Not anymore! I’m not sure how it took this long to dawn on me, but you can totally use interactive components + “after delay” animations to have a fully functional toast component that automatically animates itself in + out of the frame. It even has an embedded Lottie file!
I had a lot of fun creating this one and will do the same thing on every new product that I design.
This month I released one of my favorite threads ever 👀
It’s all about collaborating more effectively with engineers (specific language to use, tactics to consider, ways to make their lives easier, etc…)
It will never stop blowing me away that I can spend a Saturday morning creating a thread like this and over 100,000 people see it. It seems like yesterday I broke 100 likes for the first time :)
If you’re interested in learning more about developer collaboration I also released a new Figma community file this month on the topic.
Automating all the things… 💨
I’ve been playing around with the new Automator plugin from Tricycle AI this month. It’s going to be as big a game-changer as any native Figma feature. I can’t wait for everyone to get their hands on it. In the meantime though, I made a 3 min video showing you how I use the plugin to turn the entire process of creating .base components + variants into a single keyboard shortcut 💪
Using the Automator plugin in Figma
By far the #1 question I receive is “How do I organize my files?”
Well… I finally decided to answer that question :)
Figma—the ultimate learning management system 📚
For the longest time, I thought I was going to use Notion, Teachable, or some other LMS to power Figma Academy. I was pretty far into the process before I realized that everything I needed to create a course curriculum could be built in Figma…
And it turned out to be a really fun project to bring to life because it uses .base components, variants, and all types of overrides just like a real product would!
Imagine being 20 lessons in and realizing you need to make a change to your sidebar or feedback slides (there are hundreds of these…). Anyway, here’s a behind the scenes if you haven’t seen it yet 👇
Thanks for subscribing and reading! Like any good product, my plan is to iterate to something beautiful. Since this is the very first issue I have one request:
Will you respond to this email and let me know what you’re hoping to get out of this newsletter?
👆I promise to respond to each and every message. I look forward to hearing from you :)