The Power of Community
For episode two, we dock in Utah to talk to Figma Designer Advocate extraordinaire, plugin maestro and all-round-far-too-talented Rogie King. We talk about the future of Figma, community-driven design-process improvements via the world of plugins, and I get introduced to Black Tiger Sex Machine (yes, that's a thing).
- Rogie's Figma Profile
- Rogie on twitter
- Figma Plugins: Table Creator, Breakpoints, SkewDat, Image Tracer.
- Black Tiger Sex Machine, Futuristic Thriller
- Salem's Lot, Stephen King
Luke: So You're obviously a design advocate at Figma. How did you get into that? Because it's not a job that a lot of people have, right?
Rogie: Yeah, I hear a lot of people also asking about the role and not a lot of companies have them. It's a little bit of a newer idea. I know with Figma they've been around for at least two years, maybe three years now. So I got into design advocacy because I've been a product designer in the industry for a long time. Designer, web designer, freelance designer worked with small startups and all this. And I wanted to get into Figma. I wanted to work for Figma and I think the problem was at the time, it's really ironic now, but Figma wasn't hiring remote employees. And I wasn't going to move to San Francisco. I live in Salt Lake City, Utah. And so, I really wanted to nonetheless. And a friend of mine, Noah Stokes, a designer in the industry as well, had said, dude, there's this role, it's a designer advocate role at Figma and it's opening up and I thought you should hear about it. And I was like, well, what is this? What is a designer advocate? And Noah said, he's like, dude, it's everything that you already do. When I interviewed with our director now, Claire Butler, she had said you basically are going to do exactly what you're doing now, like sharing tips, sharing tricks, helping people, advocating for this. And I do say we advocate for Figma, but I know that you had mentioned earlier evangelist, in my mind an evangelist is like very much just like “This is awesome” and “Figma's awesome.” And I think an advocate is more like if Figma is not awesome in this way for you, how can we make it better? So that's going to be how I'll think about this role.
Luke: I think that makes sense as well. And also it's about advocating for good practices within the industry which Figma sits in as well. Like it's not just around, how do you use this specific tool in Figma? It is around how can we set shit up for you so it works better and how can we make it so life is easier for you whilst you hopefully are using Figma.
Rogie: Totally. You hit the nail on the head. I think it's more about thinking holistically about what is your toolset? What are you working with? And if there's some sort of integration that you need to make this better, I think at times the answer could be also, maybe in the scenario, Figma is not the right answer for you. And I think that's at least being fair. I had heard the title also as design advocate. And so I dislike that term and I always correct people because I'm not advocating for design as a movement or as a thought I'm advocating for designers, people that are using things with unique problems and so I think this title works.
Luke: Ah, it's interesting. So obviously Figma has this amazing community ecosystem. Your community is ridiculous in a good way. I'm part of the friends of Figma's slack group. What's it up to, I think it's up to 10, 15 thousand. It just seems to be growing ridiculously. And part of that is obviously the plugin ecosystem, which is just anything you want to do that is outside of the core functionality of Figma, you probably can find a plugin for. And I know you've gotten into it recently as well. So like, what was that journey like into the world of plugins?
Rogie: I think it started with Figma community, like Figma slash community. And it started out with files and design files and sharing some of those and techniques. And I like to experience the boundaries of the edges of the product. I like creatively solving problems. So I think that was a natural lead into plugins, but also I think there's always such limitations to just setting up a file. And I always know in the back of my mind that I have all of this front end development experience.
And so it was a matter of time before, I was like, okay, it's time, we're getting in. So my first plugin was called gif or gif export. And it was just based on a simple problem. Like how do I get a gif out of Figma? I put it in, but I don't know how to get it out. And I think there was that, but it was also like, well, what if I could use this for me? And it's like, I could put some text on it and I could export my cool gif, my Jack Black gif or whatever, but put some of my own text that way. I don't have to go over to those gif creators I could just do it right here. So that was the first foray and I just love the power that it unlocks. And I'm obviously learning something new every day. There's new creative solutions that people are doing in the community that every time I think I know, then they show me something that I'm like, oh, okay, shit. All right. We can do better.
Luke: Cause that is the thing, right? I feel like the days of product knows best, which is a very old school way of building software where it's like, we're going to tell you how to do this and this is the one way that you do it. And it's like everybody's process is different. Everybody's toolchain is different. Everybody's set-up is different, right? And, you need to actually build a little bit of flexibility into your platform. I think it's a really lovely thing that I've been seeing with Figma. It's interesting cause Figma launched community in plugins. It was only a couple years ago, wasn't it?
Rogie: Yeah, that's right.
Luke: And it is a little bit of handing over, not the rains, but handing over a little bit of control to the users to, as I said, catered to their own process and their own toolchain. Do you think that there are pros and cons of that kind of community model?
Rogie: Overall, I love the community model. I think there's some nuances to how working with the community model, to do it right, versus a free for all. And then are we not auditing these plugins? Are we not making sure are we not vetting them or making sure that they're not busting things, we'll start with the cons first. I think the cons, when you allow an integration into your product, be it like a plugin or a native integration of some kind. Now the perception of your product can be tainted by their experience with that plugin. So if they're like, oh, I use this plugin and it's lagging and the perception could be that, oh, well it's because Figma is laggy. So I think there's a con there that people using popular plugins that maybe are broken or not working or not updated, you often fall into this perception where those lines are blended, where people don't go, oh, it's just the plugin that's the problem there. Maybe they think it's Figma. As far as impact, I think that's probably a small con, I think the pros far outweigh all of the cons. First of all, it allows the community a way to express themselves and things that they need, faster than we can so much faster. I, internally say, I knew we always used the phrase ‘faster than the speed of light’ and I like the phrase of saying, it's very hard for Figma to keep up with the speed of developers or the speed of their community because they’re so much more powerful and creative than we are as a team. And so there's just so many ideas that are beyond locked there
Luke: And that's the thing you just need to look at the size of the community out there, compare it to the size of the internal teams that you have, even just that to begin with, you're never going to keep up with that. I'm curious, have you guys used what's popular in community yet? Have any impact on product? Has there been that case of, oh shit, there are 10,000 plugins that do this thing that Figma doesn't do, actually, maybe we should look at that and use it almost as a testing ground.
Rogie: Yeah. I think I would describe a lot of plug-ins as in some of them are very creative one-off use cases. So for instance, I wrote one called procreate import that allows you to import all your layers, I don't think Figma is ever going to go, oh my God look at that, the use cases is stunning, let's import procreate files. So I don't think that's going to happen, but I think there's some plugins that I would call like shims in a way, like this term of it's kind of bridging the gap between what the community really wants in the editor natively so they actually, they want this so they create this and I would call that like a shim plugin. And I think there's probably a lot of ways that we listen to the community. One is you could look at plugins and then be like, Hey, I want this natively, but I just created a plugin because I need it now. So I think there's that. And then I think you compare all of the other bits of like forum feedback, forum issues, as well as social feedback, there's lots of different places to take feedback from. There could be an enormous amount of people in the design community on Twitter going, we need min width for auto layout, we need max with for auto layout. And I think if you distill all of those messages, I think you'll find the ones that are the top. And a lot of times plugins, those shim type plugins, exist within those bits of feedback, you know?
Luke: Yeah. It just makes so much sense. I can imagine that it would get a little bit unwieldy with just the sheer amount of data as well, but hey, that's why you have good product people.
Rogie: And I think, periodically some of the people in our team, I think of Marcin in who's on the design team, they'll often reach out to designer advocates and be like, all right, you got top-five features for editor improvements but you can only have five. And of course, Tom or myself or other DA's will go, oh, here's 300, but he says, you need to pick a top five. Of course, they're not going to just take our word for that. They're going to take other words, but because designer advocates are in calls with sales customers a lot. We hear this a lot from big companies that are like, we're struggling with this, we need this. So we also hear another angle. And so I think that Figma team does a really good job of taking in all those voices, exterior, interior, sales partners of people that are big businesses that are using Figma, all of that, you know?
Luke: Yeah. That makes sense. So, You've spent a lot of time going through, what folks have built, you're in the community, what have been the coolest integrations or workflow improvements that you've seen that you're just like, whoa, of course, and what do you want to see as well?
Rogie: Oh, yeah. What I want to see is probably all native stuff. The one big one is, you have a vector object, you're drawing a shape and then you're drawing another one, but your inside that, you're going to in this editing mode, but like, you just want to change another node on another one that you're not in the edit. I kind of want this ability to just be able to edit any node. And I want guides, better snapping, a lot of the stuff that you see in illustrator, I'd really like to bring some of that in, but re-done in a way that's truly rethinking the way we work with vectors, but that's all just personal desires. The problem with plugins is, you really have to dig in and read through the docs and figure out exactly how they work. And so a lot of times, for instance, this one I've run across, there's this one by Gavin McFarland and it's called table creator. And I know we get a lot of feedback from folks that say we need native table. Like, yes, we get that auto layout. You can create a table, but it just becomes cumbersome when you're dealing with all these big tables. And so Gavin McFarland created this one called table creator, but to be honest, there's a lot of table generation plugins out there, until I actually had a call with a friend and he actually shared with me ‘Have you seen Gavin's table creator’ and I'm like, yeah, I mean, I've seen the plugin, but he's like, no, have you used it and he demonstrated how it works? And it's pretty mind-blowing how it works, it essentially creates main components and instances of all of them for the columns, which means if you actually change the width, he has some magic in there, he's got some trickery, but if you change the width of the main component, the whole table will flex and change, but it actually sets everything up with components. And so it's really smart and really cool. Alright. I'm just going to rattle off a bunch. I won't talk about them too much, but if you're listening, do check these out. So, Breakpoints plugin, definitely a big one. Some really cool ones for creating isometric views. Two plugins for this, one SkewDat that's one of them. And when called ISO, those are really great for creating skewed interfaces and you can do this with a component. Image Tracer is another great one. It’ll do that thing that illustrator does when it traces the vector from a raster graphic. Tokens is definitely one we're looking at, it's a really unique take on design tokens. Super, super cool.
Luke: Your background is not in development is it?
Rogie: It's kind of a meandering path. I actually got a degree in math and computer science. And then I actually fell in love with visual design. Then I became sort of a web programmer, web designer, then I became like front end developer, app developer, stuff like that, but mostly design, mostly design work.
Luke: And where do you start when you want to get into actually building your own plugin? If you've got a great idea for getting in there and messing about with? I'm guessing it's the Figma docs is the best place?
Rogie: You can actually go in your desktop app, you can start off, by going home and then you can actually go down and go to your profile, and go down to plugins. Now under plugins, you can actually go, there's an area called in development, you can hit that magical sweet plus button and hit new plugin. So that's going to help you just get started with your first plug-in and it’ll actually plant a file, like a folder that's got your starter plugin in it, you absolutely will need to go to the plugin docs. You might want to just check out the regular Figma, API and development docs as well, that has file API stuff, plugin docs. Definitely. And then there’s definitely one last place that you should go, Figma's git hub repository of other plugin samples. Like I learned by seeing and by experimenting, so what you would do is download those samples, run them and then each one of them just check them out. So lots of different places there.
Luke: Brilliant. So I'm curious, cause obviously, you've now had a career spanning lots of different parts of products, touching design in various places, working for one of the biggest design tools, it's kind of like pushing forward on what is design and what is product design. What's exciting you about the future of product design? Where is it that we're going? That you're like, yes, we need to get there faster.
Rogie: I love that Figma’s built on web technologies. I think by default then everything is so much more open. The ability to create plugins and stuff that runs web code is just all hosted up there. I would say in the cloud, but I'm trying not to say in the cloud anymore, but it's out there, it's out there somewhere. I think we've seen browser tech changing all the time. Browser tech is constantly adding on and layering on new abilities, whether that's like web GL, the ability to program a video game right inside of your browser. Or just new technologies with user media being able to pre-code that actually asks for recording, or be able to share your screen, or to be able to take a photo of yourself in a photo booth. So I love that it's opened all that up. And I love the fact that Figma is built on that browser tech. As far as the future of, I don't know too far out, but as far as the future of Figma that I'm excited about it is, one that it's always changing two, that this team is always trying to listen to our community and be like, what can we do next? What do you need? And it feels like the speed of innovation is so much faster than some of the archaic tools we used to use and then reach out to a company and be like, can you change this? And the deploys aren’t that fast, it takes a long time to get a release. Okay. So going back to the original question, I am really excited about widgets. I think specifically FigJam widgets is what I'm really excited about. The interesting thing about widgets, so with a plugin, what you would do is you would open up this window, this little web window, like an I-frame. And then you're basically having that plugin tell Figma to do things, but that's a single-player thing. That's like me, I opened my plugin, I run it and then I'm just done. So I would call that a single-player experience, so widgets are real objects. Think about your Figma objects, frames, auto layout, gradients, drawings and things like that, lines and spacers. Now all of this is actually natively rendered on a canvas. So it's going to be on FigJam, it's going to be right on the canvas and it's multiplayer. So the state of the widget is exactly the same for everyone. So if people interact with that widget and change it somehow, it's a lot like working with a rectangle tool and you come in, Luke and I'm over here and I changed the border-radius, but you change the colour. And now it's sort of like a shared object that we're working on. Right? I'm working on a multiplayer Tic-Tac-Toe game. So it's just like you come in and Luke joins and Rogie joins and we can just play and it's just Tic-Tac-Toe, and people can watch what we're doing there right in the Tic-Tac-Toe game. But I want to do a dynamic Tic-Tac-Toe board that 10 users join that somehow that game is still fun to play for 10 people on a larger grid.
Luke: Oh, wow. Okay. Yeah. the possibilities for this, for distributed teams and especially massive distributed teams, obviously playing Tic-Tac-Toe is fun, but the underlying concepts behind this could just change the way that design teams work.
Rogie: Yeah. I think maybe some people may go, oh, games. Huh? Okay, cool. Here's the interesting part to a widget. Let's say I have a Tic-Tac-Toe game board and there's 20 people in the file, and everybody wants to be able to play their own version of Tic-Tac-Toe. Now with a plugin, you have to install the code, but with the widget you don’t, I think that's the mind-blowing thing. So basically Luke comes in, you see, in my file a cool Tic-Tac-Toe game. So it's this little built in, self-containing app and you just command C on it. Now you go over to your friend's file and you're hanging out having drinks, whatever, you want play some Tic-Tac-Toe in FigJam and you just paste that component in. So now, you have all the power and all the logic of that component simply by copy pasting. So there's these little self transferable apps that can kind of move around and go to different documents and you don't need to install them and I love that. I think that's for me, that's the whole mindset is mind-blowing. Like what else can people make?
Luke: So wait, does this exist now in FigJam?
Rogie:Widgets are in private beta, we announced them and we have a bunch of private beta developers working on them, which is why I'm super, super stoked about it because I get to see everything that people are making.
Luke: So before we send you off to your desert island, you get to pick one piece of music, one book and one luxury item to take with you. So let's start with the music. What piece of music you're going to take with you?
Rogie: My musical tastes do not align well with designers. I will say that much, anytime I share my favorite music, it's crickets. So we'll just disclaimer with that. It would be in the world of electronica and dubstep. I'm just going to throw this out here. I've been really enjoying this band lately, and they're called Black Tiger Sex Machine. So that's probably what I'd bring, yeah.
Luke: Amazing. Okay. Black Tiger Sex Machine.
Rogie: It's just loud and it's chaotic and I love it.
Luke: To be honest, that's the kind of stuff that's just perfect to get shit done too as well.
Rogie: I don't know what I would be getting done on an island, but let's just say it work somehow it works
Luke: Now I'm really curious what you pair that with as reading material.
Rogie: I will also be the first to say that I'm not your person that reads a lot. There's just one book that I had been meaning to read for ages. I'm really into horror. Now, I've not read a lot of horror books, because once again, Rogie is not a reader, but I started it and I really wanted to finish it. It's called Salem's Lot. And I really I've heard it's good. And I've always wanted to just get into horror reading because I watch movies. I would actually watch a movie 10 times over before I read a book.
Luke: Okay, so your luxury item as well, you've got one luxury item to take with you. What would it be?
Rogie: Now I'm curious about this question, are there rules with this question?
Luke: No rules. Open rules you can take whatever you want to.
Rogie: Interesting. Okay. Now I'm assuming that we have power on this island. We've got music.
Luke: Yeah, unlimited weird power that comes out of the sand.
Rogie: It's like those iPhone charging things, you don't know how it gets in there, but the power gets in there. To be honest, I would probably just bring my laptop because I would be like all of this free time with no responsibility what could I program? What worlds could I create? Well, I would probably lose my mind and the kinds of things I would create would get worse and worse but it would be cool to see, you know,
Luke: brilliant. Thank you so much, Rogie, it's been an absolute pleasure.