113 - Config 2024: Highlights and Hot Takes with Jina Anne and Adekunle Oduye

Recording during Config 2024, this bonus episode of The Design Systems Podcast features long-time friends of the Pod, Jina Anne and Adekunle Oduye. They share their fresh takes on the latest Figma keynote, including the buzz around AI-generated designs and the revamped Figma UI. The conversation explores the future of design systems, deeper code integrations, and personalized user experiences enabled by AI. Plus, Jina and Adekunle give a sneak peek into their upcoming book! 

View the transcript of this episode.

Check out our upcoming events.

Guest

Jina Anne is a designer, developer, and community advocate. She founded Clarity (ClarityConf.com), the premier design systems community conference, and organizes meet-ups in the San Francisco area.).Jina is also a published author and public speaker. 

Adekunle Oduye is UX engineer specializing in design systems, front-end development and prototyping. He is also an avide travel fan, host of the Code & Pixels Podcast, and working with Jina Anne to write a book. 

Host
Chris Strahl is co-founder and CEO of Knapsack, host of @TheDSPod, DnD DM, and occasional river guide. You can find Chris on Twitter as @chrisstrahl and on LinkedIn.

Sponsor
Sponsored by Knapsack, the design system platform that brings teams together. Learn more at knapsack.cloud.

Transcript

Chris Strahl [00:00:00]:

Hi, and welcome to the Design Systems podcast. This podcast is about the place where design and development overlap. We talk with experts to get their point of view about trends in design, code, and how it relates to the world around us. As always, this podcast is brought to you by Knapsack. Check us out at Knapsack.cloud. If you want to get in touch with the show, ask some questions, or generally, tell us what you think, go ahead and tweet us at thedspod. We'd love to hear from you.

Hey, everybody. Welcome to the Design Systems Podcast. I'm your host, Chris Strahl. We're doing our special episode at config configured. What do you guys think it is?

Jina Anne [00:00:30]:

I say Config.

Adekunle [00:00:31]:

I think it's Config.

Chris Strahl [00:00:32]:

Gosh. Well, I'm in the minority, but that's okay. So I'm here with Jina Ann and Adakunle Oduye. Welcome, y'all. It's good to see you, friends for years now. So great to have you back on. You're just coming fresh from the Figma keynote. Talk to me about it. How'd it go?

Jina Anne [00:00:49]:

I have thoughts.

Chris Strahl [00:00:50]:

Yeah. So, first of all, I heard it was crazy. I heard the lines were insane. I heard that there was, like, a mob of people. It was, like, 14,000 people, all trying to fit in this place. I've been in the studio all morning, so I haven't actually gotten to the conference venue yet. Give me a sense of the vibe there.

Jina Anne [00:01:05]:

So I was walking across the street, and I see this line going all the way down the street and, like, around the block, and I realized that's just the line for people that didn't get their badges yet. And pro tip, if you find yourself at Config, go to early registration. Do not skip early registration, because there were people that flew in for this and were in line for the entire keynote, and they're still out there in line right now. Now, that's crazy.

Chris Strahl [00:01:31]:

Crazy.

Adekunle [00:01:32]:

Yeah. I ain't gonna lie. I thought I was in the wrong place. Cause I was like, wait, is this like an usher concert system? Like, I thought it was something different. And then I got to the back of the line, they're like, oh, no, you don't need to be here. And I was like, okay. Cause I was about to go back to my hotel.

Chris Strahl [00:01:44]:

I was like, yeah, no, it's. We had somebody on our team that was waiting in line, like, an hour and a half for their badge, so.

Jina Anne [00:01:50]:

I was so glad I had mine. Cause if you have your badge, you were able to just walk right in.

Chris Strahl [00:01:54]:

So how was it? What did Dylan talk about? What did you guys see here? Tell me the high points.

Jina Anne [00:01:59]:

The thing I did think was cool, how they started it to hype everyone up is they had this little real playing of the evolution of Ui since the very first computers. And so that was kind of a fun way to open it. Yeah. So Dylan starts talking about the community, and then he goes into and like, oh, yeah. And we're redesigning the UI, which is really scary. Cause we're designing for designers. And so he was showing the new UI, and my first reaction was like, okay, cool, rounded corners, great. But then when he started showing that you can actually hide and move things around and resize things, I was like, okay, cool that's definitely needed.

Chris Strahl [00:02:38]:

Yeah. There was the old designer for designer moment right there. Like Jina's skepticism around the corners. What is it, flat design, too? No, just kidding.

Adekunle [00:02:46]:

It's probably gonna make a comeback. You never know.

Chris Strahl [00:02:48]:

Yeah, well, it all goes in cycles, right?

Jina Anne [00:02:50]:

Yeah.

Chris Strahl [00:02:50]:

So eventually we'll get you back to green on black, right? Yeah, yeah, but that's cool. So, like 30 years of interfaces kind of roll out, and then you get to see sort of how the evolution of the Figma interface is looking.

Jina Anne [00:03:02]:

Yeah, he said that he knows change is hard, so they're going to be rolling it out like little by little, and you'll be able to switch back and forth for a while until they finally let go of the old UI.

Chris Strahl [00:03:13]:

Can you imagine being that product designer that is just sitting there being like, there's like a million people that use this every day, and they're all going to critique whatever it is that comes out of here.

Adekunle [00:03:24]:

And it happens all the time, especially anytime Facebook gets a redesign or anything happens, they're like, oh, this is ugly. And now they get used to it. And I like that approach where they kind of just like, little by little because people might just like, freak out and not use it.

Jina Anne [00:03:39]:

I did think it was funny when Dylan was like, can you imagine designing a new Figma in the old Figma?

Chris Strahl [00:03:47]:

It's very meta. It's like when knapsack makes its own design system, we're always like, well, it's a design system that powers of tool to make design systems. This is like a lot of meta that you live in.

Jina Anne [00:03:57]:

Yeah.

Chris Strahl [00:03:58]:

Awesome. What else? What was the thing that was probably the most surprising or most like, wow moment?

Jina Anne [00:04:04]:

Well, I don't know if wow is how I would describe how I felt, but I kind of had a weird dystopian feeling when he went into demoing, generating designs based off of a prompt. And it's basically doing all the work that we normally would be doing in Figma. And so I kind of had this image of a boro snake eating its tail kind of situation where I'm like, okay, if there's no more designers. Cause Figma does it all, who's paying for Figma?

Adekunle [00:04:32]:

Yeah, exactly. And I was kind of also shocked because people were excited and clapping and.

Jina Anne [00:04:38]:

I was like, yeah, it was weird.

Adekunle [00:04:40]:

This is gonna replace like half of y'all. So that's one of the things, you know, we're all constantly thinking about, like, AI is coming, so how are we going to adapt and how to survive? A lot of it was revolving around design systems too.

Jina Anne [00:04:52]:

So I think that's the thing. Well, there goes all my work. I guess I'll go be a bartender now.

Chris Strahl [00:04:59]:

I mean, it's kind of what we always wanted to do anyway, right?

Jina Anne [00:05:01]:

Yeah.

Chris Strahl [00:05:02]:

But in all seriousness, with the advent of the AI capabilities, what were the types of things they were generating? Like what were they making?

Jina Anne [00:05:08]:

First, he was showing, generating a website and he was using prompts. Like it was like a lord of the Rings reference. And so it not only generated the website, but it even generated images for the placeholder images. And of course they were all lord of the Rings themed because that's the prompt he used. But then he does show some Uikit stuff. And, oh, I just remembered, they partnered with both Apple and Google to get those uikits directly into Figma.

Chris Strahl [00:05:34]:

Nice.

Jina Anne [00:05:34]:

So you can just drag that into your stuff. And then they made their own design system. I think it was called Figma simple or something like that. So you have those components you can drag in. So pretty much all the components are in Figma now.

Chris Strahl [00:05:46]:

Gotcha. And it's all like a structured system that has a lot of general applicability. It doesn't necessarily feel like, hey, here's material inside of Figma. It's a lot more like, hey, this is actually a root set of content.

Jina Anne [00:05:59]:

Yeah. Historically people have been like cloning the Figma Ui kit for material or for iOS. And then when Apple or Google makes an update, you kind of have to do that all over again. But now it's like it just lives already in the tool. So you'll get the updates as they update.

Chris Strahl [00:06:15]:

Interesting. I wonder how they were going to solve like the upstream problem with that. With like, all right, so something in your design system updates, how does that then update all the interfaces you've built with that design system. Do they go into that at all?

Adekunle [00:06:26]:

I don't think so, but I'm assuming it's kind of the case where it's like it'll tell you about the update and then I guess you'd be able to like preview it. I'm kind of thinking about like GitHub or kind of how you do that kind of stuff where it's like you see like past and you see the current and whatnot. But it's going to be interesting because it's a UI tool, so I feel like it's going to be more complex. So it'd be interesting to kind of see that, how that pans out.

Chris Strahl [00:06:48]:

Talk to me about the connection to code that they were talking about, too.

Adekunle [00:06:51]:

They expand upon like the dev mode where ideas like you have a designer creating some designs and whatever like that, and then it's kind of, I don't know if there was like more into.

Jina Anne [00:07:00]:

Like the dev mode so you can like tap directly into like react components and like, also there was this mode of this component is now dev ready. So a dev would see that and then be able to see what changes were made. And basically the tweets I was seeing where people were like, rest in peace, storybook, which I don't think is actually going to happen. But yeah, I've always wanted Figma to be more in tune with code and so I am intrigued by being able to actually have it really, truly connected into your react code base or I don't know if they're going to try to do more than react, but they'll probably have to.

Chris Strahl [00:07:38]:

So then the idea of digital production, obviously, Figma still considers it the origination point. And I think that there's a lot of question marks in my mind about that structure of the ecosystem, and I'm actually really hopeful. I get to talk to some of the folks from Figma about it while I'm here, is if there was one question I could ask the Figma CPO, it would be like, okay, so there's lots of people at Figma and lots of people at this conference that look at what's happening and they look at the traditional production workflows and they say like, all right, yeah, sure, everything originates in design. And you go make a bunch of stuff in design, and then you go give that to a bunch of engineers that go build the thing that you just designed.

But there's also this new production workflow that's getting closer and closer and closer to the products we built, which is ultimately, about code. I think Figma is doing a great job of meeting corporations where they're at, where most organizations aren't willing to completely upend the way they build product right now, and basically said, no, we should start with code. But there is this inclination that that's where the universe is headed, is we're all going to start to use code building blocks via AI tools or whatever to be able to create these assemblies of components, these compositions directly in the medium that something's destined for, and that ostensibly doesn't include Figma in that production workflow. 

And so I'm really curious, as Figma is evolving and it's changing, how much is it reliant upon a canvas to be the origination point of creation versus just working directly with code? And what does that representation look like? I think there's a lot of questions there about the future of this market, and it's all being massively disrupted right now because of AI and all this giant upheaval.

And I'm not surprised that they demoed some AI tooling. Right. But I think, Jina, kind of, to your earlier point, not that many designers want to live in a world where the fun work is done for them. They want to live in a world where the boring work is done for them. And so I kind of wonder what form this ultimately takes. And I'd love it if you two could just, like, speculate or dream with me for a second here about config next year. So if we're sitting here next year and we see what's happened, like, what has taken off and what has continued to garner that investment and what has basically been something that has been either, like, discarded or let go of.

Adekunle [00:10:01]:

Yeah, I think a lot of, especially AI and even, like, the stuff we do is, like, we just want to basically make it easier and make it faster, and you don't want to do the boring stuff and whatnot. So I think a lot of, especially when you're working as a designer or developer, it's kind of like you having the same conversations over and over again. And I think for me, like, how I imagine is like, all right, I want to focus on, like, those right problems, like talking to users and all this other stuff around, like, ui. I don't want to say it goes away, but, you know, figma kind of takes care of it or the AI or whatever like that. Again, I don't like to use, like, the prompt designer, but there's going to be some sort of that happening and whatnot. So that's one thing I'm like interested in seeing, because obviously if you have designers be more empowered to make something that's based from code and they don't have to go back and forth, I feel like that opens their jobs to do other stuff, but I don't know how that's gonna look like. And I think that's the one thing I'm super excited about. But Jina, I wonder your thoughts.

Jina Anne [00:10:55]:

Yeah. When I think of the quote unquote boring stuff that I don't enjoy in Figma, it is things like auto layout. And they did show they have a new feature wherever it'll suggest the proper structure. So I don't need to concern myself with how do I nest this? How do I group things? It's going to suggest it based on the way you've designed it, but it also means you've designed it flatly back in Photoshop with layer on top of things. So it's going to probably need you to make sure that you've lined things up in a way that it can recognize. And he did say the more complex, the more it's likely not going to do the right thing. But the simpler your component is, the more likely it'll do the right thing. So I'm like, that does make sense for automation because I'm like, nobody really enjoys sitting there grouping and nesting and playing with auto layout.

But at the same time, part of the reason I'm not a fan of auto layout is because it doesn't even really represent what's going to happen in code anyway. And I'd rather do it in Flexbox or do it with CSS grid. And so my hope is that maybe if they do decide to let go of features, as Dylan even implied, like they want to simplify and remove some things is like, yeah, get rid of drawing boxes and get rid of having a canvas and actually have real code. Like I want my figma to feel like webflow where when I'm designing, it's actually writing CSS and writing HTML.

Chris Strahl [00:12:15]:

Interesting. That's an interesting take.

Jina Anne [00:12:17]:

Yeah, yeah.

Chris Strahl [00:12:18]:

So I like that idea of how do you actually use the code to compose? And I also think that they're probably right to talk about like this is a spectrum of complexity where your AI tools are going to be really, really accurate as long as the things that you maintain are simple and low level. I think that it's also the design system use case that aligns really closely with what we all talk about of like have your foundational components be really, really simple things and then compose them together to create the complex things. And if Figma can aid in that composition process, that's awesome. And that also has a really nice tie into code because a lot of where those compositions happen is actually in code, where you're taking a button and putting it in a card or three buttons and putting it in a card. I think that if I were to dream a little about where we might be at next year, 

I think the two things that I see as being really important is this idea of, okay, yes, the gen AI side of things, but Gen AI to what end? And I think that that is going to go through a major evolution. And what we're going to start to see is you're going to start to see Gen AI to either more personalized experiences or lots of different variations of experiences that we've never been able to create before. Most organizations have a hard enough time with light mode, dark mode. So imagine the ability to leverage, well, Figma only gives you four modes, but imagine the ability to leverage 20 modes because you have Genai tools that are able to know the difference and fill those gaps.

And I think that there's an awesome era for accessibility there as well that Gen AI can really help with, because all that stuff that tends to be a byproduct or tends to be in the background, like that can suddenly be in the foreground. And then I think the second thing is the systems approach. And kind of like Jina, you were talking about the deeper connection to code. And I mean, again, like, not rip chromatic. I think that they're great and they have great product that works awesome for engineers. But I think that, like, how can you have a deeply intimate tie between the thing that you make in Figma and the association in code? And that's really hard right now, and I don't think it has to be. And I think that like code connect is a big step in the right direction. I think that a lot of the stuff that we're trying to do with knapsack, with the API into Figma has been much better recently.

But the ability to basically say, like, this thing in design is this thing in react or angular or whatever framework you're using, that is the future. And I'm excited to see where that goes.

Jina Anne [00:14:38]:

Yeah. And something you said sparked the thought in me of like, if they're already working with Apple and Google to build Uikit stuff directly in Figma, why not also directly tap into the Android platform and the iOS Swift? And so, like, I do feel like we're moving into this world where like, a lot of that stuff is done. We're supposed to then be able to innovate on these features. Like the stuff that you were just talking about that I'm really excited about when it comes to the future of our profession is these personalized experiences. Like, if I'm left handed, right handed, if I have an astigmatism, if I go from being in a busy, crowded bus to being. How does the UI just completely adapt and change based on context, based on my personal preferences, all that stuff?

Chris Strahl [00:15:25]:

Yeah, I mean, internationalization, the idea of different cultural considerations for space. I don't know. There's all sorts of really cool things that you could do with experiences that are all possible today. Just extremely expensive and time consuming.

Adekunle [00:15:39]:

Yeah, exactly. And that's why I feel like it's gonna make it easier for designers to really focus on building the best experience where I can build a product. All right, cool. I want it to be accessible. I wanted to have it where it's like, I wanna be using us, where maybe it's something about success and things like, oh, that's green. In Asia, they like to use red as more for, oh, that's good luck, whatnot. So it adapts to kind of like Ogina was saying, many different scenarios, and I feel like that's gonna make it easier to build products more for not people like just in the US, but like all across the world. So that's the thing I'm like super excited about.

Chris Strahl [00:16:15]:

Definitely. Well, you all are also writing a book right now, and I think that this is fun and cool to have you all on pre release. So can you give us a little preview about what you all are gonna be talking about?

Jina Anne [00:16:27]:

Sure. So it's interesting cause we were just talking about AI and career, I guess, longevity. The book we're writing is really based on the things we've learned in our own career journey in design systems and things like we wish we had known before. And as people are entering this profession, like, you might go to design school or go to engineering school, but they don't really teach design systems. Or if they do, it might be like a class, but also just like, how to be successful in design systems. The things that we talk about are understanding what are the different kinds of roles within design systems, because it's not just designers and developers. Sometimes you also have other aspects, content people, accessibility, even product management. We kind of talk about the different types of roles.

We also are planning to interview some people in their community that we think what we observe to be a really great successful career so that they can share their stories. People like Diana Melter, that started as a designer at GitHub, and now she's head of design. And what an amazing career she's had.

Chris Strahl [00:17:33]:

She's one of the first people I ever met in design systems. It's funny, I don't know if she'd even remember me, but the first time I was at clarity in New York, I actually ended up at a meetup and got to meet her there. And it was just when I was getting started in this whole space.

Jina Anne [00:17:45]:

Yeah. And if Diana's hearing this before we do the interview. Yes, we're planning to talk to you.

Chris Strahl [00:17:52]:

Gotcha. Interview date tv.

Jina Anne [00:17:55]:

But then, yeah, we also want to talk about the job search and hiring process, what kind of questions you might be asked in the interview, what kind of things should be in your portfolio. And then we go into the third part, which is really on continuous learning and growth and, like, how you level up in your career and whether that's the ic path or the management path.

Chris Strahl [00:18:15]:

So there's, like, a career blueprint attached to it as well.

Adekunle [00:18:18]:

Yeah. And it's mostly, I feel like I always get this question a lot. I kind of, like, stumble into this kind of career, but I think from, like, my perspective is like, all right, someone that's coming out of school is like, I want to do design systems. All right, how do I make that happen? Because I know that even for me, one of the biggest hurdles is just kind of, like, promotions within design system. And that's like a whole, what's your career pathway?

Jina Anne [00:18:41]:

Right. When I was at Salesforce, I remember my manager was putting me up for promotion, and he got a lot of pushback because people were like, well, you know, Jina's not shipping new features to users. These other designers do that. And the way he advocated for me and the other designer on my team is like, they're the bass players. Like, you need the bass player to keep the rhythm going. And what you might see is the lead singer, the lead guitarist that are shipping the features. They can't do what they do without these people. And so it worked. We got the promotions. That's awesome.

Chris Strahl [00:19:13]:

That's awesome.

Jina Anne [00:19:14]:

Yeah. We're also hoping that it's not just people wanting a career journey reading this. We're actually hoping hiring managers will read it.

Chris Strahl [00:19:22]:

That's great. When can we expect to see it?

Adekunle [00:19:25]:

You know? That's a good question. Yeah. I'm hoping that, like, and Jina, keep me honest. Maybe we could do, like, have a rough draft available by end of this year, maybe start of next year.

Jina Anne [00:19:40]:

That's the hope. Yeah.

Chris Strahl [00:19:41]:

Gotcha. So coming Q 1 2025. I can't wait. I'm really excited to read it and chat more about it. But thanks to you both for being on today, especially in this fun little impromptu chat.

Jina Anne [00:19:54]:

I did want to share one more thing about the keynote today that I am excited about.

Chris Strahl [00:19:58]:

Oh yeah.

Jina Anne [00:19:59]:

And it was hilarious because this was the feature that got the whole room clapping and excited. Figma slides presenter notes in Figma that I'm excited about big time.

Chris Strahl [00:20:09]:

I love the idea of the move into the collaboration space because that collaboration communication, that's where Figma shines for me. But I also don't do a lot of design, so.

Adekunle [00:20:18]:

No, but I think that's the great point, is like, you got business people, designers, developers, like everyone loves Finko, which is like, I never seen a tool that basically brings all these people with different disciplines together. So that's why I enjoy it too.

Chris Strahl [00:20:30]:

Awesome. Well, hey, thanks again to you both. Really appreciate you being here. Appreciate you jumping on the show.

Jina Anne [00:20:34]:

Yeah, yeah.

Adekunle [00:20:35]:

Thanks for having us.

Chris Strahl [00:20:35]:

This has been the design system podcast coming at you from config. Have a great day, everyone. That's all for today.

Chris Strahl [00:20:43]:

This has been another episode of the Design Systems podcast. Thanks for listening. If you have any questions or a topic you'd like to know more about us on Twitter at thedspod. We'd love to hear from you. Show ideas, recommendations, questions or comments. As always, this pod is brought to you by knapsack. You can check us out at knapsack.cloud. Have a great day.