Today, giving you a sneak peek into our design workflow at SugarBox Networks.
Our design stack at SugarBox is comprised of Sketch, Zeplin, Miro, Adobe Creative Suite and Marvel. With these tools we design, collaborate, prototype and prepare developer handoff, whilst keeping Sketch as our core design tool. Recently we have been trying to improve our design processes and workflow, including a re-evaluation of our present design stack.
Figma – A design tool every UX designer has heard of. Infact, Figma has many fans in the design community. Despite it being a relatively new program, compared to Sketch, Figma has become the preferred tool of the trade, for many in the industry. Figma had been on our team’s radar and we were curious to try it out and (voila!) we fell in love with it.
On the surface, Sketch and Figma are pretty similar. Both have been getting a lot of updates, quite frequently, resulting in closing many gaps or differences between programs. Besides the learning curve, our migration would amount to added work on all our designs and design systems.
Still wondering what makes it worth the effort for our team to change-over, despite these reasons?
- An all-in-one tool
For us, Figma is not just about replacing our core design tool – Sketch. We can replace our entire design software stack with Figma. It will be brilliant to have one single tool for – diagramming, designing, developer handoff and prototyping, streamlining our design workflow to save a lot of our time (which is spent in manually syncing our work across various tools and keeping them upto-date with each other). Not to forget, speed is everything in a fast-growing startup.
- Highly interactive prototypes
Figma comes with a highly interactive, built-in prototyping feature. Compared to this, what Sketch offers is very basic, which includes linking the prototypes and fixed layers while scrolling. To do more, we have to rely on Marvel. Although, Marvel is a powerful prototyping tool, syncing every little change with Marvel can be a hassle, because small changes can create duplicates and mess up the entire file, which eventually we have to pay for. With Figma, we can quickly develop interactive prototypes. Its smart animate feature is great and any changes are automatically updated in the other prototypes.
- Collaborative Features
To be able to get visual feedback from product teams and engineers with something as simple as sharing a link is amazing. What’s more interesting is, we can share the link for an exact frame, for developers to comment on or give feedback. This means we can gather precise and quick feedback for our designs, at every stage of the designing process. Figma’s new tool, FigJam, is similar to Miro and has a beautiful interface. This lets our team conduct brainstorming sessions and collaborate on user journeys, check task flow diagrams, etc – all within Figma!
- Cross-Platform Availability
While Sketch is available only for Mac; Figma is available across Mac, PC as well as the web app. Presently, there is no official Sketch Mirror app for android users, instead, we had to use Crystal. On the other hand, Figma not only has its official mirror app but they have released the Figma app, which is currently in the beta phase. This gives us so much flexibility in how can work.
- It’s in the details
Figma’s power lies in its not-so-obvious functions. The way Figma handles components, states and variants, it helps us build a more flexible design system. Figma’s unique vector pen tool is an unmatched value addition with any other vector editing tool. Figma also has slick developer handoff feature and community resource, all built-in the app amongst other benefits.
There’s no denying that we have enjoyed working in Sketch so far. While we can work around it in many ways with plugins and other tools, Figma would allow us to design faster, seamlessly, and more collaboratively.
Which design tool do you like to use? We’d love to hear your thoughts in the comment section.
Images Designed by Freepik