Collaborative and real-time design systems in Figma (Unacademy)
Submitted by Abhinav Chhikara (@a8h1nav) on Wednesday, 17 October 2018
Unacademy is a fast growing ed-tech startup with four apps across Android and iOS. We needed to improve consistency, increase collaboration and make communication as efficient as possible.
The talk is about why we switched from Sketch to Figma, how we did it, and a walk through of what the system looks like.
1) Old design stack: Sketch, Zeplin, Dropbox, Invision, Marvel
2) New design stack: Figma
3) Goals with the design system: Real-time, Collaborative, Communication
4) Real-time: Figma is multiplayer, real-time. Designers and developers can keep track of real time changes to files and literally watch pixels as they move
5) Collaborative: Multiple designers working on a file at the same time, developers seeing in-progress work rather than just final
6) Communication: Removing bottlenecks. No more conversations like “is it ready? / is it on zeplin? / which is the final design? / give me the dropbox link to this / the zeplin version seems different from the sketch version etc”
7) Comparison: Sketch vs Figma. How there’s a massive migration from Sketch to Figma about to happen in the same way as Photoshop to Sketch happened
8) Talking about our component structure and how it’s used
I currently lead the design team at Unacademy. I also run UI Sources, a site to find real design inspiration. Previously, I’ve published a book with Bloomsbury called Pyjama Profit, run a music startup called Lisn and worked with a bunch of startups including Housing.com