View profile

Design Threads — 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!
Ridd 🏛
Interactive components are my favorite @figmadesign feature.

So why wait to use them until the end?

They're even more powerful as the very first step in the process!

Here's how I use them to explore new ideas 👇
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.
Ridd 🏛
I got tired of creating new frames to prototype toasts/alerts...

So I made an animated + fully functional "Toast" component using interactive components.

Here's how it works 👇
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.
Ridd 🏛
14 practical ways to become your engineering team's favorite designer 👇
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
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 :)
Ridd 🏛
I'm constantly asked...

"How do I organize my files?"

So here are my 7 goals for file organization in @figmadesign 👇
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 👇
Ridd 🏛
Thought you might enjoy a little behind the scenes action 👀

Here's how I built an LMS (learning management system) for @figmaacademy entirely in Figma 👀

It draws from a fun component library system similar to building an actual product 👇
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 :)
Did you enjoy this issue? Yes No

A monthly series highlighting practical tactics for product designers

In order to unsubscribe, click here.
If you were forwarded this newsletter and you like it, you can subscribe here.
Created with Revue by Twitter.