Three elements of fine prototyping design

the main body of a light color

First of all, the interaction designer output is the flow chart, to the development and Product manager communication, so sometimes in order to highlight the level and area of the interface, it is necessary to distinguish through the shades of gray, in my drawing process, basically 70% of the interface is mainly white, one is to look more clean, Another is if it is necessary to print communication, of course, white is better.

　　Second, the sexy line

There are many lines in the design diagram, the thickness of the line, the degree of the actual and the composition have different meanings, flexible use of these lines can help their documents to improve a file chi.

Here is a little bit of my experience for you to learn from.

First of all, how to draw lines, many designers often use rectangular tools to provide lines for their own interface, which is most convenient to use, but if the area within the interface, listing, and so on, many rectangles appear to be very focused, and at the same time two rectangles overlap is very difficult to handle, So it is very good to use the appropriate wiring tool in the area of the interface, which avoids overlapping problems, and better adjusts which is the focus and which is not the focus.

Then is the line of the actual situation, the line is the actual situation with the previous one to use, in the page when the dotted line with the connector will make the interface more level. At the same time I like to use the thickness of the line to do background content and interface content differences.

The above is just a few dimensions of the line, the use of good can make very sexy lines, but also does not increase the workload.

　Third, the sensitive color

The right color can help to make the interaction more effective.

First of all, the appropriate color can be better to achieve black and white ash cannot achieve the effect, but this color is not too bright, so in the use of color should try to use the color of low purity, but also appropriate to adjust the transparency, the purpose is not to rob the vision, but also to express our meaning.

Let's take a look at the following example, for the deletion of this operation, I chose to use the 20% transparency of red to color, first of all, it did not rob the vision, second, in addition to the designer itself, development and PM can be very good understanding of this is a "red" operation. But if you think about it, how do you behave in black and white?

At the same time, for the company's product managers and developers have a long-term cooperation with the designer, it is also very important to give color character is a matter, the Red representative to delete, yellow for the selected, Green Line represents the forward, red lines represent back, and so on the color definition, In the long-term use and communication can train other people to your color sensitivity, at the same time, in addition to line style, color block and so on, you have a way to express the meaning of the color.

In fact, interactive documents can be more exquisite, can be more "style", right?

Also, if you don't even have the logic to think about how to put the interactive picture of the good, then you are wrong, for the students thinking clearly, this is a weapon to install force, for the students do not want to understand, at best, Huaquanxiutui.

Baidu recruit slightly, want to work with the author to become colleagues of children's shoes can go to try: