I often see discussions in the reader groups. When asked about design specifications in an interview, I don’t know how to answer them. Is it necessary to answer the specific size of the design specification, and then memorize all the rules of adaptation? Today, caiyun will discuss with you how to understand and use design specifications.

What are design specifications?

Yiliusheji.com has pointed out that design specifications are a commonplace topic, and there are many articles on the Internet. However, I believe that many designers still have a vague understanding of design specifications. They think that design specifications refer to font, color, and control specifications, which is actually a narrow understanding.

In my opinion, design specifications can be summed up in one sentence: design specifications are a set of product standards formulated for specific products, including process standards, technical standards, design rules and so on. Through this standard, errors can be reduced and design quality and output stability can be improved.

For example, when I was working on QQ’s 3D cm show project, at the beginning, the design resources submitted by the partner had a low accuracy rate and different styles. Then to solve this problem, I defined process standards, resource standards, CP cooperation standards and so on in the project. These specifications allow different design teams to work together, improve the efficiency and quality of the overall collaboration, and these standards become part of the design specification.

It can be said that the norms formed by each project are different due to different ways of cooperation, personnel habits and landing forms. So, design specifications are more project-specific, unless you’re talking about Android or iOS platform-level specifications that are already widely available. Otherwise, it’s hard to have a standard answer, but rather a description of how you would define a specification, what problems it solves, and how you would verify that the specification actually improves the product experience.

The role of design specifications

1. Follow user habits and reduce cognitive costs

Don’t make me think. As we all know, easy to use products are as far as possible to reduce user thinking, constantly close to the user’s use habits. For example, on iOS, when you want to go back to the previous page, you’re used to looking for the back action in the upper left corner, but you’re not used to putting the back action in the upper right corner. For example, for domestic users, they are used to using green for the right button and red for the wrong button. If you insist on the so-called differentiation, users will be confused and the probability of misoperation may also increase greatly.

2. Unify the brand personality

Brand personality, whether it is large to the company level, or small to a specific product, all need a set of brand recognition system to restrain, only unified visual impression can better let users remember. That these brand identity system is actually a part of the design specification, in the specific implementation, according to some brand core concept specification can quickly make some style decisions.

For example, Tencent QQ brand image style keywords are youth, interaction, narrative and clean, so in the selection of screen color can be based on keywords to guide the selection of screen, so that the overall painting style is unified.

3. Reduce learning costs for newcomers

The new person here is not just a new designer who has just entered the workplace, but also an experienced designer who has just participated in a new project. The design norm is to be able to get started quickly with the lowest communication cost. With mature control resources and benchmarking design reference, even designers who have never done it before can build a good page.

4. Improve development efficiency

With good design specifications, development can encapsulate commonly used styles and invoke them directly in scenarios that need to be reused. In this way, on the one hand, style code duplication can be reduced through invocation, which improves efficiency and reduces the volume of software packages. On the other hand, unnecessary work can be reduced and later maintenance is convenient.

5. Ensure consistency of design

With the constraints of design specifications, the team can do design within an established framework, unify the output quality of everyone, so as to ensure the consistency of design.

How to learn design specifications

The learning of design specifications is definitely not by rote memorization, but by paying attention to methods. Based on my own experience, I think there are roughly two steps as follows:

In the novice stage, read more design specifications of some big factories, first establish cognition, do not require to remember all. Think of these specifications as dictionaries, go through them, and then look them up when you’re unsure.

In fact, many online design specifications, principles and other articles, the source is from these large factory specifications, want to get first-hand information, it is best to go to these websites to see more.

That’s why I don’t write specific numbers, because there’s so much information on the web that it’s not worth repeating. On the way to learn knowledge, we should not wait for others to feed us everything. We need more initiative, so as to improve our learning ability and problem-solving ability.

For their own modules to do, targeted to find the application of large factories on the market as a reference, direct screenshot annotation, their own summary of the rule will be more profound impression.

I began to do UI on this learning, do not know how to use font size, spacing, how to use color, directly to find similar interface screenshot reference, measure their size, absorb their color, and then step by step to the standard experience accumulated.

For example, from the dynamic TAB page of QQ, we can learn a lot of information, such as the height of the list, the size and rounded corner of the icon on the left of the list, the height and color matching of the spacing line, the size and color matching of the arrow on the right, the size and color matching of the text on the list, the size and style of the user’s head picture, the distance between the icon and the text and so on. These references are not plagiarism, you do with this interface exactly the same, just reference here a few attributes and then combined with their own products integrated use, reduce errors.

Do you see that? A good interface design, any of the above information can be used for reference, depending on whether you can use it.

It should be emphasized that the standards for these references are not standard answers, or adjustments should be made according to their actual project needs, but at least a range is known, and it is not likely to make mistakes within this range.

This is just like the beginning of the design, to refer to these norms is equivalent to the practice of copying, such copying is needed, in the process of copying constantly add their own thinking, and then through summary, become their own knowledge system.

How to define a design specification

With the deepening of the understanding of the design specification, the continuous improvement of their own design ability, will begin to change from the user of the design specification to the specification maker. How to develop design specifications for the project? My experience is that in the process of the project, I summarize the good and correct solution after stepping on the pit, and form the text, and the accumulation will form the specification. Treat every problem you encounter as an opportunity to improve processes and specifications.

I am in the habit of writing down any problems I find in a project. Sometimes I even look forward to problems, because problems can be found to optimize opportunities, and I can find a sense of accomplishment in solving problems.

I once encountered a lot of pits in the 3D CM Show project of QQ, and gradually summarized various design specifications from the pit filling process to help reduce the error rate of the project and improve the design quality. In terms of the final output and results, the progress is considerable, and the help to the product is also relatively great, so it is worth doing.

Do specifications affect the creativity of a design?

Yiliusheji.com notes that when you first master design specifications, working is especially comfortable because requirements can be done quickly, as if piecing together components can be done. But do a little longer time, can feel as if there is no progress, every day to spell components, worry about the creative nature of the design, it is quite contradictory.

In fact, the specification is also to adhere to and lead users to the habit of continuous iteration. It is important to keep the big design framework unchanged while still surprising the user during the design process. For example, the color and font of the whole UI need to be consistent, but some graphics and dynamic effects can be made bright, so that users can be both immersed in the whole experience and some small surprise. The breaking and rebuilding of norms must be a process of dynamic balance.

conclusion

Design specifications do not need to be memorized by rote, but must be understood and used flexibly in order to be of value. As the UI industry continues to mature, design tools are simplified, and various componentized resources and thinking become more and more popular, it is foreseeable that the general UI interface will be highly componentized in the future, and designers may spend less and less time on the interface.

In terms of the development of the industry, it takes a lot of manual labor out of it and gives design and development more time to polish the details of the product, which is definitely a good thing. But for designers themselves, what else can they do without the time required for conventional design? What is the value of designers? Worth every designer to think about.