The design idea of the dynamic effect of the UI icon

Now more and more mobile phone applications and Web applications are beginning to focus on the design of dynamic effects, just the right dynamic effect can give users a pleasant interactive experience, is the application of Yan value to play a major part. (´･ω･ ')

icon, that is, icons. In the interactive process, the application of various icon will follow different events occur different transformations. For two examples, the playback mode of a music player changes and the power icon changes when charging.

In the past, the transformation of the icon is very rigid, and in recent years, the popular in the switch icon to join the transition animation, this dynamic effect to the user experience brought positive effects is very obvious, to apply a lot of Tim.

However, in the face of the dynamic effect of icon, how should we design? Today we share several design icon dynamic ideas. In this explanation, the dynamic effect of the map some are copied some are original, only for the unified style to facilitate reading.

　Method of attribute Conversion

This is the most common and simplest kind of icon switching ideas.

Attributes include position, size, rotation, transparency, color, etc., which are used to make the action, and if properly applied, can make an immediate and bright effect.

Now most of the icon dynamic effect can not be separated from the property changes, exercise appropriate, this simple and powerful method of promising.

　　Ii. Method of Path reorganization

This may be accustomed to the properties of the transformation of the dynamic effect, but also a person to brighten the idea of the dynamic effect.

The path (stroke) of the icon is restructured to form a new icon, which tests more things, such as observing the relationship between the two icon strokes, which has recently been quite popular and challenging.