In the workplace, you can make it easier for your partner to not only collaborate more effectively, but also build a better upstream/downstream relationship, especially if you’re developing a technology that takes a lot of brain and hair

So today and we talk about Lao, designers can from what direction to reduce the development of the work (hair).

1. Cut image compression

A developer friend of mine complained to me about how annoying it was to stop from the code and compress a few hundred knicks

Just at this time, designers have to need a cutting map artifact – copy

Copy support Sketch, Photoshop, Adobe XD, Figma automatic cutting and annotation, can help designers greatly improve the efficiency of design draft delivery. Moreover, by expanding the folding menu in the right panel, users can automatically convert the size of all pictures on different platforms (iOS/Android/Web), reducing the tedious process of manual platform switching, and even the code can be copied with one key.

Not only that, but the platform also supports the analysis and compression of image metadata in the slice image, so that the data needs fewer bytes to store, so that you download the slice image instantly more than 50% smaller! Make the site load faster, better user experience!

         

2. Format conversion

The productivity of development depends not only on the efficiency of writing code, but also on how the team works together.

For example, in the development of Android client, Webp format is required in the vast majority of cases. Webp compression supported online is either charged, or exported pictures cannot be displayed normally on the development side.

Take Figma, the popular design tool around the world, as an example, it can not export the cutting image in Webp format like Sketch. At this time, both designers and developers urgently need a tool that can support the mainstream cutting image format.

If you ask the developer to manually convert the image format, the result is predictable: an increasing hairline

And copy guest, perfect solution to this problem. Of course, it also supports conversion to other formats, such as JPG, PNG and SVG, and can be modified directly in the copywriter if the name of the slice image is not standard.

Although it is a trivial feature, it is a real pain point in the development process.

3. Automatic and manual annotation

Previously, designers are honestly manual annotation, resulting in the entire page are dense……

Thus, I often accompany the developer to work late into the night, and occasionally affect the relationship because of “annotation”.

The annotation mode of “automatic + manual” can help the designer to deliver the design draft easily.

In addition to the basic multi-selection annotations, percentage annotations and other annotations, the follower can also set a layer as a percentage reference. When the mouse clicks on other layers on the hover design drawing, the area will automatically be used as a reference to calculate the percentage, so that the percentage annotation can be more accurate and convenient.

In addition, designers can use manual annotations to form a lightweight document that more accurately communicates design specifications to developers.

Development engineers can view annotation information as required. You can enable or disable manual annotation. Download cut diagrams of various device sizes and export CSS codes, which not only greatly saves the workload of designers in later annotation, but also improves the development efficiency.

The appearance of copy guest can be said to be to liberate the designer from the state of unbearable burden.

4. Design specifications

For product development teams, the importance of design specifications is self-evident.

For example, for the same basic element, if there is no design specification, the interaction designer needs to design the interaction mode once, the developer needs to develop it again, and each different designer may redesign the element when they encounter it.

The whole process, everyone is miserable ~

The appearance of the Copyer design specification cloud can help teams build design specifications and standard design elements, manage design specifications at the same time, improve design efficiency, support real-time synchronization of design specifications, and members can reuse with one click.

Having a standard design specification can not only improve design efficiency and maintain design consistency, but also greatly reduce the cost of communication between designers, product managers and engineers.

Write in the last

Designers are from Mars, programmers are from Venus, friction is inevitable.

We can’t change the way designers and programmers approach their jobs. But a good tool can help everyone improve their productivity and collaborative experience. Being able to work together to reduce each other’s workload is one of the secrets of a happy, efficient collaboration between designers and developers.

Portal: www.mockplus.cn/idoc-ui