From Sketch to Figma: much more than a design decision

We've been in a long-term relationship with Sketch for almost a lifetime. And as time passes and the team grows, the breakup seemed necessary. Still, we kept very good friends.

Sketch was our go-to tool for interface design for over 5 years now, and it was such a huge improvement back then when we left Photoshop (how far and old does it seem?). It was great to see what we built together. We loved the seamless way it allowed us to work and how easy it was to keep consistency and organization throughout, ended up creating beautiful designs.

As in any design team, the tools we use reflect not only our work but, above all, our process and the way we collaborate. Before moving to Figma, Pixelmatters had the following tools shaping our process:

But times were changing — new tools arising, the market mindset changing — as our will to become more proficient and collaborative.

The increasing need for a change

Lately, we've been witnessing an increasing need in the market for a more unified and centered design process where the easiness of collaboration is key, especially at these remote times. Our clients were asking the same, and we, at Pixelmatters, couldn't agree more.

We felt that we had too many steps, tools, and mechanisms that were cluttering the process instead of simplifying it.

We started feeling somehow limited by our tools. Having such a variety of them, ended up breaking the experience too much, instead of giving us the pretended flexibility. For example, we needed to export our designs to InVision every time we made a change, especially on big projects. At the same time, having feedback sessions on a different tool from the one we design on didn't seem efficient to us. Design in Sketch, Prototyping in InVision, Animations in Principle... always jumping from one app to another.

That's when we saw the light at the end of the tunnel. And it was Figma.

How Figma won our heart

Could you imagine a place where you design, prototype, animate, work together and have feedback sessions at once? Figma solved all these problems at a glance with a set of features they provided from the get-go.

It won our hearts in so many ways.

  1. First, it's available in any platform, being browser-based — which is great because even though we all work with MacBooks on the design team, we couldn't ensure that on the clients' side. And oh, we must admit that we were not used to working on a browser-based system, it seemed "out of the ordinary" or "not as reliable" in the first instance, but so far so good;
  2. All projects organized and available in one single place, ready to start working — new teammates won't struggle anymore to see all our projects and start working on any;
  3. Multiple people can work on the same file at the same time, comment, and even chat with the design in context. How awesome is that? Teamwork and collaboration gained a new meaning. (Nonetheless, Sketch has released real-time collaboration very recently as well.)
  4. Prototyping and animations (won't even speak about the smart animations 🤯) ready to be started right after you close a shape or change background color — I mean, everything happens on your canvas and in parallel if needed.
  5. And a lot of other incredible features, even though the above were enough to justify the shift.

Of course that it wasn't an easy decision. Pixelmatters' Design team was used to Sketch in the same way you are used to your pillow. We had a lot of legacy projects, and an entire team was used to the process.

That's why we were conscious and made a full assessment before any decision.

The Decision

One of the most important things to consider was the team's opinion. So the Design Management spoke about this openly with them. We heard everyone's thoughts, and made a first analysis of the benefits and cons. The option seemed promising, and everyone was pretty exciting.

Next, we decided to create a solid Figma evaluation document to set in stone those same pros and cons, plus make it easier for everyone to make a conscious decision. We analyzed Figma features and how they would impact the current design workflows at Pixelmatters, tested performance in different scenarios, and evaluated the pricing tiers and what they would include. (Note: This technical analysis was done from September 28 to October 1, 2020. Any updates from Figma or Sketch after this period were not considered).

But we couldn't take this decision without the most important part: test the tool by ourselves. An element of the team made a Trial with one of our projects and then presented us the results and feedback. Then, the entire Design team was invited to test the tool, together, on a dedicated workshop, having already someone leading with expertise in the matter. And the decision was born naturally — make a smooth and progressive transition to Figma.

The Shift

After weighing everything — yes, every single detail — these are the main changes that we felt since we have transitioned to Figma:

  1. Process: we reduced the effort of uploading screens to different places every time a presentation has to be made.
  2. Performance: even with dozens of artboards of heavy visuals, on a single file, Figma is blazing fast, having a strong impact on all projects, especially bigger ones.
  3. Collaboration: the ability to have active real-time collaboration is a game-changer. It's now clear for everyone that this is becoming a crucial part of our process, especially after Pixelmatters becoming a remote-first company. This is also significantly positive in two other aspects:
  4. Design Review sessions: we now have a highly interactive approach, discussing everything in context with the team.
  5. Day-to-day operations: the entire design team has real-time visibility to all projects at all times, making it possible to provide early comments and identify roadblocks and struggles earlier rather than later.
  6. Animation and Prototyping: we can do it directly in the App, which opened doors for more polished presentations, that help us better explain our vision to clients.
  7. Cross-platform: everyone can be part of the design process, with and without a Mac. Although everyone at Pixelmatters uses a Mac, that is not the case with all of our clients, and it has been providing more collaboration with their different teams. (E.g. Have a Marketing or Design Lead on the client's side participate in our design process).
  8. Market: Last, but definitely not least. The current market is changing, much as it happened with Photoshop to Sketch. We're having more and more clients working and sharing their Figma files, and even using Figma to collaborate with us. On top of that, Figma's community is growing as well.

What comes next

Despite having changed to Figma, Sketch played a crucial role in Pixelmatters' evolution and growth. It was always one of our core technical choices, but day by day, Figma keeps being more aligned with what we want to accomplish now and in the upcoming times.

As Pixelmatters's Design team keeps following and concluding a smooth migration to Figma, here's what's expected to happen going forward:

  1. Continue the migration of the different existing projects to Figma, strategically;
  2. Kick-off all new projects on top of Figma;
  3. Keep using Sketch until we fully switch, but also depending on current and short/mid-term needs;
  4. Even closer collaboration and dialogue with different teams and roles — Engineering, Marketing, and Product.

But, there is no right or wrong answer when deciding your main design tool. We keep seeing many tools arise, and the market is becoming more and more diversified, so it all comes down to your company's needs, goals, and processes.

Follow Pixelmatters on Twitter, Facebook, LinkedIn, and Instagram.

Luís Monteiro
Design Director