As I keep using Figma on a daily basis more subtle workflow improvements are exposed thanks to its collaborative design.
Two things to note before you read this:
- Figma uses Slack as its communication channel. You set up a Figma channel in Slack, and any comments made in Figma using their built in commenting mechanism is Slacked to the team.
- Figma is browser based, cross-platform, and you can collaborate the same way you do in Google Docs. It shows the people viewing/editing the file in the top of the app.
TIP: If you click on someone else’s avatar circle you will zoom to what they are viewing at that time.
The latest discovery only came to light when we created small design groups at the ADP Payroll Innovation Group. We typically work on several features as once for our online apps, so we have:
- One project file for the theme
- One file for each epic
- Several pages for each story
(Ours is an agile shop, so most of you understand what that hierarchy means.)
Typically we work on the same design at the same time because we have deliverables that are done in a certain order. As the team lead, my co-designer does most of the up-front work of user flows, test scenarios, and presentations, but we share whatever work load we can or need to.
The epiphany came when I realized this: live file collaboration is the answer to “designer drift” — that being either misinterpreting or straying from the agreed upon design. We all have ideas that come up as we are building our designs, and I for one have a tendency to quickly try and create them as I think of them. Our MVP features take priority, so the lead can check in live to see what I’m up to in real time.
Besides that drift, miscommunication happens — I heard this in a meeting but she heard that, and I start creating the wrong mockup layout. With Figma there is no waiting to see what I’ve done, she always has the live work in front of her. As she works in defining workflow and story criteria, she can see if I misheard part of the design at any time (just by clicking on my avatar). For example, if the lead sees me working on part of an MVP feature but I’m taking the wrong approach, she can just comment in Figma if she’s busy (and I’ll see it in Slack), or turn around and let me know. She doesn’t even have to move from her desk, as anything she does I can see and vice-versa.
Some may think that’s kind of creepy, but the benefit FAR outweighs the social paranoia of someone virtually watching over your shoulder. You get used to it fast as you start to fast track work over the folks still using file based platform specific tools.
The next moment of enlightenment came during a design review. As she talked about the design on a large screen using Figma as the display medium (either in file or prototype mode), I was recording comments and fixing issues during the meeting. There are probably a lot of “we already do that” thoughts reading this, but when you consider that we are working on the same material we are reviewing with no syncing, you start to notice the efficiency benefit.
More importantly, any changes I make to the design in that meeting are updated live in our Confluence mockup pages. You can read more about Figma and Confluence in a post I did here.