A practical guide to Figma for startups and scale-ups
We recently touched on how startups can get the best out of a remote design workshop. Alongside planning, toolkits, and ensuring everyone feels included, one of our top suggestions was to get the right tech stack in place. As the world turned on its head in 2020 we all scrambled to assume a remote working setup, leading to a huge surge in demand for collaboration software. As creatives in a remote-first agency one of our personal favourites is Figma.
Since its inception in 2016, Figma has been gaining traction as the market leader for co-designing, with lots of startups and scaleups making the switch over from Sketch. The startups we work with love it, as do the design teams at Twitter, Uber and GitHub. It’s progressive, responsive, user-friendly and effective at speeding up the creative process. Figma offers a really cost-effective way for startups to develop prototypes and validate these through user testing and A/B testing.
Whether you’re new to Figma, or a seasoned pro, navigating collaborative sessions with a remote or distributed team can be daunting. We offer some practical guidance on how to maximise templates, processes and tools in order to run your sessions smoothly.
For those new to Figma…what is it?!
In a nutshell, it’s a web-based prototyping tool that facilitates a collective design process. If you’re a startup working on wireframing your website, designing the UI of your app, mapping out your system architecture or generating a set of user stories, Figma can accommodate all of your needs.
It doesn’t matter if your project takes an agile or waterfall methodology, where in the creative process you are, or who your team members are (it’s just as apt for content creators as it is for your creative, UX and dev teams), you can hop into the same file as your team members, edit in realtime and track everyone’s cursors. Editing a dynamically updating file means that you can be confident that everyone’s viewing the same version.
See also How to get the best from a remote workshop with your creative content agency
Gusto used Figma to facilitate its rebrand, Bulb used it to develop a unified design system and growing startup Dribbble’s fully remote global team adopted Figma to enable them to access the same files in real-time.
A practical guide and some handy tips
Delving into how to use Figma is a pretty vast subject – in fact, there are so many guides and videos out there on Medium, YouTube and Figma itself that you won’t be short of content to get you started.
We cover how to get the best out of Figma when working with a remote or geographically distributed team. We touch on the best templates, handy features, resources and how to make the most of Figma to run remote usability testing, retros, ideation and research sessions.
Make the most of Figma templates
Templates are a great way to expedite your design process, saving you time and money. Some of our favourites are the Design Checklist, Team Retro and Distributed Ideation templates.
Design checklist – Managing your team’s assignments when you’re all working together can be tricky. If you’re co-collaborating on the same file, this handy checklist means that you can ensure there’s no duplication of tasks and keep tabs on who should be doing what. From adding interaction notations to aligning your interactive elements or making your padding and typefaces consistent.
Team Retro Template – Retros are great ways of improving your remote sessions by looking at what went well, what went wrong and what you can change in future. This team retro template enables you to collaboratively figure out any positives and identify any problem areas.
See also How to utilise earned and owned media for your startup in 2021
Distributed Ideation Template – This is a great template to help you facilitate a group ideation session with distributed teams. Designed by the team at Dropbox to help minimise any friction during collaborative sketching or idea-sharing.
Remote Design Sprint Framework – Created by the team at GitHub and inspired by the Design Sprint framework, this file is adjusted to the needs of remote design teams. It contains team exercises, sticky notes, flowchart nodes and assets to help you create your own tasks.
Facilitate remote research sessions using virtual boards
Even without a remote or distributed team, gathering user research may not always be viable face-to-face. Your target users may not all be city-dwellers so recruiting participants from the area around your office risks alienating some of your user groups. Running remote research sessions can be challenging, but are certainly doable with the right approach. Editor, Alia Fite recommends using virtual boards in Figma to collate and synthesise research findings. She suggests structuring your files as follows:
- Research questions: Main research goal research and key questions.
- Participants: Snapshot – pictures, titles, pertinent quotes
- Theme board: Main themes that emerge from the research.
- Open questions: New topics to cover.
- Next steps
Research debrief boards such as this one here, are a fantastic way of synthesising common themes and feedback from remote research sessions.
Avoid multiple distributed files
The beauty of Figma is that you don’t need multiple distributed files. If you’re running a group brainstorming session, create a single central file. Within that central file, you can easily add multiple pages during the session or split out commonly occurring themes into multiple frames. If you distribute the file to participants in advance of the session, they have the opportunity to engage with the topic and add any early thoughts they may have.
See also How Diversity and Inclusion Can Help You Attract More Tech Talent
Access online resources to plan your sessions
There’s a wealth of resources online (both developed by Figma, and through sources such as Medium) that can help you adapt your working processes to meet the needs of your distributed team. There’s a great guide to running remote usability testing by Irene Kim at NPR here. Irene provides some brilliant guidance on how to set up your workflow and prototype. While Editor, Alia Fite touches on how to keep a close-knit feel to your team while you’re all separated. Figma have been really responsive during the shift in working patterns, and great at updating their online resources to cover our most pressing needs.
