Loading summary
Transcript21 lines
- [00:00]
Host
A year ago, it felt like AI generated UI was about to have its moment. I mean, tools like Galileo were gaining a lot of steam. Figma released their first draft feature where you could use AI to spin up a mock up quickly. I mean, it was clear it was the first inning, but it felt like the direction was inevitable. But now, a year later, and the landscape looks a lot different than what people thought. And a lot of it ties back to a single design pattern breakthrough. Here's Kyle Turman from Anthropic describing the origin of Claude artifacts.
- [00:30]
Kyle Turman
We were like, okay, well what if we made the artifacts pane something that could actually render rich HTML? And so the team sprinted on that and we weren't even planning to launch that. We were just going to have it be code, right? But because it was so good, we saw that capability and we amplified it, right? And because of that, you could actually see it be rendered and it felt way more impressive and it felt more tangible and it felt more useful because you didn't have to copy it in your code editor. And the other benefit is, like, people who didn't know how to code could all of a sudden make all these weird little things and have a ton of value from that.
- [01:04]
Host
Simple layout where you chat with AI on the left and it outputs code on the right has changed the entire tooling landscape and has led to some of the fastest growing startups of all time.
- [01:14]
Nad Shishti
We had this moment where we realized that actually these things haven't really moved since the 90s. The very first version of Photoshop had a layers panel in like, I think 1992. And so we started to sort of ask ourselves from first principles, like, why, why haven't things evolved? What we realized was that actually now with AI, we think we can move forward, like genuinely forward, rather iteratively.
- [01:37]
Host
That's Nad Shishti, the original designer at Lovable, which is one of those vibe coding tools that has absolutely exploded over the last year. And this pattern of being able to build my ideas with natural language without having to worry about a full code base and deployment has totally changed the way that I think about prototyping. I've spent a lot less time in Figma over the last six months, that's just a fact. Instead, my workflow looks a lot more like what Zach Leach from Gamma describes here.
- [02:03]
Zach Leach
I think if there's traditional designers out there and people who are making figmas and stuff, just see what happens. Take your figma, put it in Bolt and say, make a prototype. I bet you get pretty far, like, you Know what I mean? It's pretty good. Now, it's not gonna be perfect, right? But then you ask yourself, what do you wanna learn, right? What are you trying to learn here? Is this something I could put in Bolt, spend 20 minutes kind of refining, and then go send it to a customer really quick? Like, probably, right? Like, are they gonna care? Are they gonna care? It doesn't look perfect or work perfect. But if the question you're trying to answer is, does this work? Can this work? Like, where does this fall down? You can do an, right? But then you could also, you know, take something like Boulder or lovable or whatever, make something that feels a little bit more real and try it out and see it for yourself. If you know it really works, just share it around, Post it on Slack. Like, say, hey, I was just experimenting with this. Here's like a working prototype of this thing kind of working. What do you guys think?
- [02:55]
Host
The market has spoken. I mean, Figma tried to use AI to help designers design in 2024, and the whole community raised their pitchforks. So it's no wonder that they didn't even touch their first draft feature for this year's config. Instead, they changed, created their own version of Bolt or Lovable. It turns out the future of AI tooling looks a lot more like an IDE than a traditional design tool. And we might go even further into that direction as more and more designers get comfortable using code editors like Cursor or Windsurf. This is a big way that AI native teams like Gamma are already working right now.
- [03:30]
Zach Leach
We're a little bit of an unorthodox design team, although maybe this is changing a little bit in sort of the industry. But War design team, who is quite capable with regards to like, coding, prototyping, building actual stuff. Like, we close bugs and we like ship stuff, right? Like not huge stuff, but we can fix things in the product. And more importantly, we can prototype custom builds of the product and share with customers and get feedback on those things. And so as a design team, we're like, pretty capable with sort of that kind of stuff. And now that AI has come along, it's really kind of amazing where I can go in and I can have a way better understanding the code base if I'm trying to prototype something out for a customer. Like, recently somebody wanted me to add like an option for analytics in the dashboard. I'm like, let me just see if Cursor can just go do this. Do you know what I mean? Like, like, I seriously think to myself, how Many bugs. Can I as a designer just go fix by just asking Cursor to do it? Like, it's kind of mind blowing.
- [04:25]
Host
Being able to prototype my ideas in code is addicting. I mean, it's an absolute superpower. And if you haven't tried tools like Cursor yet, I highly recommend you do, because it's actually a lot more straightfor forward than you might think. But there's still something missing. So I want to highlight something Jordan Singer said to me way back at config 2024.
- [04:45]
Jordan Singer
One of the great things about generative design inside of Figma is the output is on an infinite canvas. And what that means is that you can take all of the inner pieces, tweak them directly with direct manipulation, mess with the properties, pull out components, maybe use things from what it gives you and put them in your own designs and just use it as a starting point or give you thoughts about, oh, I hadn't thought of, you know, using a card in this way, or I forgot about including, you know, this in a tab bar. And it can, it can really, you know, inspire you with new ideas.
- [05:20]
Host
Real quick message and then we can jump back into it. So you've heard me rave about Jitter's new infinite canvas for animation, but don't forget they have a totally revamped Figma plugin to support it. You can import Figma slides in the Jitter Multi select layers and frames, and also import your entire Figma file all at once. It's seriously never been easier to animate your designs, and Jitter has become my first choice anytime I need to add motion. So head to Dive Club Jitter to create something amazing today. That's J I T T E R. Remember what Jonam Trivedi from Airbnb said about shaders?
- [05:57]
Jonam Trivedi
They're like the final frontier and UI development, right? It's like the ultimate escape hatch that you are no longer limited by anything that your framework or design system or software library gives you. You're just given this canvas and it is fully up to you to figure out what to do with it.
- [06:13]
Host
They used to be this alien format that I couldn't really do anything about, but now paper is making it possible for designers anywhere to create their own shaders. You can preview them directly on the canvas and it's just another reason why I'm all in on paper as the next great design tool. They are truly raising the ceiling for Creativ and you can be one of the first to try it out. Just head to Dive Club Paper.
- [06:39]
Jonam Trivedi
Okay?
- [06:39]
Host
Now onto the episode. I still believe the next frontier of opportunity with AI exists on an infinite canvas. And it's all about iteration. Rather than helping me go from zero to one, I want AI to help me go from one to a hundred. Because one of the biggest things that separates good from great designers is their obsession with iterating past something that is just good enough. I mean, what does it look like for AI to magnify that initial creative spark? This is also something Pran from Vercel was talking about when she was imagining potential futures for V0.
- [07:14]
Pran
This is a constant discussion that I have with the team and like other people in AI, like really, like often is. The concept of the infinite canvas, I think is still so golden. Like having an infinite canvas of being able to cast your ideas very wide is something that I still somehow want to bring to be zero, you know, or like the same feeling of starting from a frame. Like, what is the equivalent of that in the AI generated code world?
- [07:37]
Host
This is something I've been thinking a lot about lately. And how realistic is it to marry the speed of Figma's canvas with the functionality and power of code? It's why I'm so interested in new tools like Paper, what Pietro is working on, because there's a trend happening that I think they're going to be able to capitalize on, which is that AI is accelerating the standardization of the modern web tech stack. I mean, React and Tailwind are almost universal at this point. And as AI continues to progress, there's a real advantage to using the frameworks that LLMs are best at. So the question is, if the canvas itself is rooted in code, is it possible to have the best of both worlds? The ease of messiness and uncapped exploration in figma, and the power and functionality of code based prototypes. And if a startup can successfully crack that code, can they build enough of a moat where they can fend off whatever Figma would? Release the following config and we'll see. But all I know is that it is a very exciting time to explore, explore what design tools have to offer. So before I let you go, I'll leave you with this clip from longtime Chief Design Officer at Airbnb, Alex Schleifer.
- [08:48]
Alex Schleifer
I always look for like a curiosity and interest in tools and in the tooling, because that's teaching you that this person has not only curiosity, but a learner's mindset and is interested in technology. And at the end of the day, you need people who like, are passionate about technology and technology is going to change so much that you need to have people who are curious and excited to work with new things. And so I was always like, the more junior, the more like, how do you use your tools? Like, that's a very, I think important conversations for me to have because it gives you signal there's no excuse not to be proficient at the tools.
- [09:23]
Host
So I pushed Alex on his answer a little bit because it's very common to say things like, well, the tools don't matter. And his rebuttal has never been more relevant than it is today.
- [09:33]
Alex Schleifer
They're speaking about themselves, right? Like, hey, I still like using Photoshop, so tools don't matter. What bullshit. Once again, to use the chef analogy, like, you know, have a good knife, know how to use it. Baseline, just baseline, just do that, right? And it's like nearly gatekeeping. And it's also like way of sometimes masking your own inability to learn new things. We were one of the first companies to integrate Figma because we were curious about tools and that was a massive change for us. It's just tools matter, process matters, craft matters, and it's nearly the majority of what matters because everything else is just fluff and it's not useful.
- [10:12]
Host
That's all for today, but we're only just getting started when it comes to design tools because in the next episode we get to hear from Stephen Haney, who is the founder of Paper, which is the brand new design tool that everybody seems to be talking about. So I will see you on Friday, Sam.