Transitioning a Team to Figma

Over the last year our team at Paylocity transitioned from Sketch and Invision to Figma. Since at the beginning of the transition we had no design ops, and because I had extensive Figma experience, I was the designer responsible for leading the team through the transition. It was fun for me to bring other designers along on the same exciting journey I embarked on when I got let into the Figma beta in 2016. Here's how the process went and what I learned along the way.

Switching is more difficult than you might expect

Our team came to Figma relatively late in the game. By the time we started considering a switch, Figma had already become the industry standard for UI design and prototyping. I figured that for this reason people would be generally excited to switch tools. But many people were not.

I came to realize even though some designers were curious about Figma and what it had to offer them, any disruption to their workflows and ability to deliver created enough resistance on the path to learning Figma that they weren't willing to take the plunge. In order to convince some designers that it would be worth it, we had to figure out a way to generate some excitement.

Generate excitement with a pilot group

We established a small pilot group of designers to try Figma and assess whether it was a viable solution for our design team and product organization moving forward. The designers who were in the pilot group were frustrated by the increasing bugginess of sketch and excited about learning Figma. Within the pilot group we made it a priority to share what we were discovering along the way with the designers who weren't in the pilot group. The goal of sharing in this manner was to get more designers intrigued by Figma's potential and eventually become willing to try it out.

The pilot group of designers also started sharing our prototypes with other internal stakeholders for collaboration. At first this didn't seem like a pivotal decision, but in the end it was adoption by those internal stakeholders that eventually cemented Figma's place in our tech stack. They saw the potential for quicker feedback loops and easier ways to share work. "Can you send me the Figma?" became a common ask. Figma became a crucial part of the way our were collaborating, and word spread to other product teams who were still using Invision that there was a better way.

People learn at their own paces and in different ways

Once Figma started gaining internal traction, our design leadership was convinced that switching was the way forward. Then the challenge became actually transitioning from Sketch without affecting our ability to deliver design work in a timely fashion.

One thing we didn't want to do was put immediate pressure on any designer. People were in various stages of project work and a switch to Figma would take time. It had the potential to be very disruptive and stressful if we tried to force the switch too quickly. For this reason we decided to set a "shut off date" for Sketch that was pretty far in the future—about 4 months. All we said to the design team was, "You are responsible for being comfortable enough to work in Figma by this date." That reduced the pressure and allowed people to experiment with Figma as their work capacity allowed.

We didn't leave anyone on their own as far as the learning process went. I made myself available for individual teaching sessions, but also put together more formal group sessions that were recorded and shared on our learning management system. In the end, most of the coaching work happened one-on-one as questions arose.

Figma has a different mental model than Sketch

Although there are similarities between the two tools, there is a certain way of thinking and working that Figma is built upon. If you try to work exactly the same way you worked in Sketch, you won't be as successful. I noticed that many designers weren't grasping Figma's concept of frames and were carrying over unnecessary habits from Sketch, such as drawing background rectangles. Most of my early coaching sessions revolved around explaining frames to people and how they are more powerful and flexible than Sketch's artboards.

Auto layout is super confusing and slows learning

I'm a big auto layout designer, but I quickly realized that for designers who were new to Figma, trying to learn auto layout from the start slowed their progress. My advice to those who were just learning Figma was to work simply with nested frames until they felt comfortable with that, and then learn auto layout piece by piece, and only when doing so would help them save time. A few months into the switch, when people were getting more comfortable with the basics of Figma, I gave a group session on auto layout to explain the principles.

Having a starter component library was helpful

I had been working in Figma for years before we switched to it officially. I had already recreated most of Citrus, our internal design system, in Figma. That meant that when we transitioned to Figma, our designers could use Citrus components right away and not have to figure out how to build anything custom to get started. This allowed them to design screens and get to finished results quicker, because they didn't have to waste time figuring out how to build different versions of buttons or any other component.