= = =

  1. preface

Figma, the online vector design tool of the popular UX design community, has almost become synonymous with “real fragrance” in the last two years, which also confirms that “collaboration” has gradually become a consensus among design teams. But for domestic users, poor connection speeds and sorely lacking localization support make it difficult for Figma to take advantage of true collaboration.

This interface is probably a permanent pain in the heart of all Figma direct users

Despite the difficulties, some domestic design teams are determined to migrate their platforms. Of course, there are costs: pay-per-person subscriptions are expensive; Ladders and associated fees are also necessary to keep the experience connected; Finally, Figma’s own delivery capacity was weak, so they had to supplement their design delivery with products like Zeplin…..

In the second half of the epidemic, “throttling” was the first principle. In the face of such high switching costs, the resistance of the team was imaginable. Happily, in November, Figma official community officially launched the Figma plug-in “Mockplus”, which means that the mainstream collaborative design platform in China has finally been connected to Figma. The entire DevOps department can work with free, high-speed domestic servers, greatly reducing the cost and risk of team promotion.

Finally, domestic mainstream manufacturers began to access Figma

The following author introduces how to reduce the threshold of Figma by using the guest plug-in according to his own practical work experience. It also introduces some other useful plug-ins for teams that want to use Figma as their primary design platform.

  1. Use official plugin MockPlus to open Figma and copycat

First, why use a collaboration platform instead of some plug-in that can export offline HTML packages? The rapid decline of the Sketch Measure has demonstrated that the export compressed package delivery approach is very inefficient for modification, iteration and review. Platform delivery is more efficient in collecting ideas and design changes without the need to repeatedly send compressed packages to the team, thus effectively ensuring the accuracy and uniqueness of the design output.

Sketch Measure has witnessed the development of the domestic experience design industry from immature to mature

The current popular cloud delivery products in China include Mick and Blue Lake, but only the former supports the import of Figma. To use Copycat, you need to register an account (free), then visit the official plugin link and click Install in the upper right corner.

Right-click on a blank area of the Figma canvas and select Plugins > Mockplus. Wait for the main screen to pop up. To use the server in China, select Chinese as your first language.

After logging in to the plugin and copying the user account, you can start importing the design draft to the user. See the official tutorial for details of how the plugin is used. It is worth mentioning that in addition to Figma, Copycat is also compatible with all other mainstream software design draft (Sketch, Ps, Xd, Axure) import. In addition to the necessary functions of designers such as review and delivery, Copy also provides complete online design, PRD document writing, design specification management, task management and other practical functions to meet the various advanced needs of the design team.

Most of all, Copycat is free for teams of less than 100 people, and features are almost unlimited — there is probably no other such ambitious manufacturer now or in the future.

  1. Greatly improve Figma combat performance! Recommended third-party plug-ins

Since Figma itself is compatible with Sketch files, the migration of design assets is relatively easy. Here, the author gives some recommendations of third-party plug-ins to help the team complete the transition of operation habits and function cohesion more smoothly.

1. Scale

Figma can’t manually enter magnification to scale, which bothers many designers who are accustomed to ⌘ + K scaling logic. Scale solves this problem perfectly.

2. Time Machine

Time Machine can be understood as a quick-save feature in a game, which automatically copies the current design and stores it in a dedicated Page. If you’re used to using the “save as” feature to save intermediate versions of your design, you’ll love this plugin.

3. Clean document

During the design process, it is inevitable to produce some empty groups with chaotic order, meaningless hidden layers or poorly named layers. This plugin can help you do “smart cleaning”. The result is a better understanding of layer structure and logic by both myself and my co-designers.

4. Table Paste

A tool for transferring Excle content to Figma is ideal for those who often work with data visualization. Just create a row of tables, add text fields, generate components, and paste the form content from Excel. As for the table style can be adjusted freely, does not affect the content of the paste.

5. Autoflow

Utoflow is a simple Ux flows drawing tool that automatically creates flow lines for you after selecting the starting and ending elements, similar to the Overflow plugin in Sketch. With rectangular, diamond and other logical shapes, you can better output a flow chart with logical rules.

6. Vectary 3D

3D-Mockup is a great way to add value to your content, whether it’s for portfolio packaging or for general presentations. Vectary is also an online 3D design tool. If you have higher 3D modeling and rendering needs, you can also try their official design tool, which is very cool!

7, LottieFiles

The famous Lottie finally supports Figma, but in Figma it mainly provides free Lottie animation material, which is fundamentally different from AE’s Lottie plugin. Even without the ability to direct the effect code, Lottie’s large amount of high-quality animation material is of considerable practical value.

8, TinyImage Compressor

Image compression plug-in, support JPG/PNG format and packaged output, quality and volume optimization is quite good, avoid output material after using Tinypng.com processing trouble.

9, the Design of Lint

If you’ve used the Assistant feature in the new version of Sketch (69+), you’ll be familiar with this plugin. Lint can quickly look for inconsistencies in design, including colors, fonts, effects, fill styles, strokes, border radii, and more. Real-time design error checking assistant is a real boon for design leaders, who no longer need to spend a lot of time reviewing designer’s tiny design mistakes.

  1. conclusion

The Figma community has only been available for about half a year, and already there are a lot of design materials and plugins, which shows that users around the world love the product.

Figma is a great tool to try out for both individual designers and design teams. The Copycat platform and its array of third-party plugins are enough to make the product capable of intense real-world design work and free the Entire DevOps department from the dreaded Figma service to the joy of quick viewing and smooth collaboration.

Migrating tools or design platforms is not a complex task, and these seemingly “high-end operations” are actually quite simple. Give it a try, and believe that you and your team will gain efficiency and surprise on this new platform!

At the end of the article to send benefits to everyone, in order to celebrate the first copy guest! Domestic exclusive support for Figma design draft

Free copy professional edition members, click to receive benefits!

Activation code: Cyrene