Here are some detailed icons with various styles, some of which can be used as illustrations. Let's take a look at them to see how to improve the user experience.

Usually, a dark stroke of 1-3px or a monochrome collage can make the icon more eye-catching. This kind of icon makes the website look elegant and suitable for almost any style. For example, some large and detailed icons.

or some small and beautiful icons.

if you want users to click on this seemingly simple icon, the best way is to make the icon move to attract users' attention.

You can also add some interesting interactive effects to make the icons more interesting.

Look at the problems of the following set of icons, and we can make it better:

Use the same perspective. Some icons cannot be viewed from a single point, while others are viewed from two points, resulting in different angles.

check the detail of the icon. Don't make some icons simple, while others are complicated.

pay attention to the size and typography of icons. Some icons may need to occupy more space visually, and control the proportion of icons.

Uniform lines and bright colors make this kind of icons look like simple and friendly illustrations.

Adding bright colors can enrich minimalist icons, and uniform colors bring standardization to icons.

It may take a long time to design isometric illustrations, but the result is often worthwhile. This style is very expressive. Whether imitating the real scene or creating a virtual three-dimensional world, it can be displayed in the form of equidistant illustrations.

In addition, many companies are following the same style to create isometric illustrations, bringing users an overall unified experience.

If there are only simple lines and curves and no redundant text, it may be difficult to understand the meaning of such icons. But at the same time, it is hard to ignore this icon-it is so irregular, too bold and eye-catching.

as an unusual style to express a certain design idea, 3D icons are not very complicated to create. 3D icons with bright solid colors can show amazing effects.

The rich details of 3D icons can better reflect some design ideas and product expressiveness.

when using 3D icons, it is important to note that you should not mix isometric icons with 3D icons.

rich icons should be large enough to be easily recognized.

this form is easy to create and suitable for any website or product.

avoid using too general graphic templates, which may easily lead to problems in the relevance of information.

this is probably the most widely used style. The biggest challenge in designing such icons is not only to support the idea, but also to add value to the product with a pleasant and unique appearance.

of course, you can also use dynamic effects to increase the click-through rate of users.

If most users find it easy to connect icons with descriptions, and icons are valuable to them, the design is on the right direction. Making icons interesting or emotional will improve the overall experience.

don't let others guess what you want to illustrate with this icon. Icons should be absolutely clear, and there is no room for double understanding.

such icons may not be suitable for all businesses, but certain brands will recognize their functions.

it takes some skill to draw such an icon. You can try to use Photoshop or Illustrator plug-in to convert pictures into drafts to save some design time.

For example, the following icons show their own characteristics and differences, while maintaining a unified curved style.

after reading so many icon styles, do you have a deeper understanding of icon design? Icon is not an unnecessary part of the experience, it is a unique experience in itself.

Wonderful recommendation:

1. Talk about the application of card design

2. Case study: layout design of grid system

3. How to design dark pattern? These three factors need to be considered

4. Deep analysis: the application logic of service blueprint.