The difference between UI and UX: a practical example
Today there will be a guest post on the topic of UX and UI interfaces using the Icons8 service as an example. The author is a usability specialist Andrei Burmistrov,…

Continue reading →

How to make favicon with your own hands?
Favicon A site without a favicon, like a ship without a flag. Favicon is an integral part of a site’s brand, its image and identification. By the way, look at…

Continue reading →

The main types of user interface buttons on sites and applications
Buttons are one of the most famous interactive user interface elements. They play a very important role in creating user interaction and creating a positive experience. Continuing a series of…

Continue reading →

Web Design Illustrations – Best Uses

If you carefully study any selection of website designs on a particular topic, one trend will be obvious to you – illustrations are now in fashion. They are so widespread that we simply must talk about this phenomenon in detail! To write an article, inspiration was drawn from the note The use of illustration in web design I hope you will find it interesting to read.

The interface should not have useless and meaningless elements. Even a decorative element, if it is in its place, must perform a certain function. Speaking in general terms, an illustration can play the role of both a decorative element (whose task is to decorate and diversify the design), and informative (it presents some information in a convenient and easy to read form). In the ideal case, it performs both functions at once.

You can find many interesting high-quality graphics on the websites of the portfolio of illustrators, but what is the best way to use it in web design? – Today we’ll just talk about this, having examined typical examples.

THEMATIC IMAGES
Themed illustrations create or enhance a specific atmosphere. The plot of such a picture is usually closely related to the theme of the site. Let’s look at a few examples:

Get my boss to North Cape

Web Design Illustrations

The illustration follows the basic idea of ​​Get my boss to North Cape. It not only decorates, but also carries a functional and semantic load, emphasizing what this project is actually dedicated to – the boss argued with his subordinate that if they get 5,000 likes, he will have to go a long way.

Launch kit

Web Design Illustrations

In the case of the Launch Kit website, the background illustration is just a decoration, but the decoration is appropriate and organically fits into the overall concept of the site. It is not necessary to draw a large, specific illustration that fully reflects the concept of the site, you can only slightly strengthen its general message as done here.

Atelier anonyme design

Web Design Illustrations

When developing the homepage, Atelier Anonyme Design website designers decided to completely rely on the illustration, which in fact is the background at the same time a powerful expressive tool. This site was created for a web studio, so we can say that the illustration not only plays the role of decoration, but also in a sense reflects the mood and spirit of this agency, filtering out “inappropriate” customers.

CHARACTER ILLUSTRATION
Another widely used phenomenon today is an illustration with a character. To implement this idea, the designer needs to come up with a special illustrated character (or characters). Often this is a fictional character with whom the visitor subsequently must associate the site. Let’s look at some examples.

inkFinder

Web Design Illustrations

Obviously, the “octopus” character is used on inkFinder and plays a significant role, which makes the site design more memorable and generally more recognizable. The whole charm of the approach with the character is that you can come up with anyone and implement the same image in your own way, making it unique.

The evnt

Web Design Illustrations

The Evnt meets us with another “octopus-like character.” In this case, its implementation is very far from reality – it is a kind of brain enclosed in a “spacesuit” on three legs. Undoubtedly, this is also a memorable element of the project, which creates a wonderful association with the specific event to which the web page is dedicated. Look, this example is generally a good enough design for the site, but how much it will change if you remove the character!

Big Eye Creative

Web Design Illustrations

In this case, the character is not as aggressive as in the previous design. Its role is a secondary, essentially one-eyed creature – part of the logo, however, it creates a mood and allows you to make the visual overview of the project memorable.

ILLUSTRATED JEWELERY
This type of illustration in web design is decorative. It’s just decoration, decoration, nothing more. Basically. and this option has the right to exist – beautiful sites are also remembered as are projects with “ideological” illustrations. A few examples:

1000 WP Themes

Web Design Illustrations

The illustrated elements of the 1000 WP Themes interface (in the header and navigation) do not carry a semantic or functional load, but help create a stylish design. Partially, the beauty and style of design gives some idea of ​​the possibilities and features of WordPress templates and designs developed by this company.

Coca-Cola History

web design illustration

Illustrations at one of Coca-Cola’s projects were created solely to decorate, diversify and make the design more modern and fashionable. The picture shows real things, but is beaten in this way in order to fit into the overall appearance of the site.

6 Tips for Creating One-Page Websites
One-page websites are becoming popular and fashionable now - there is no doubt about it, although they are not suitable for every topic or organization. However, if everything is done…

...

The difference between UI and UX: a practical example
Today there will be a guest post on the topic of UX and UI interfaces using the Icons8 service as an example. The author is a usability specialist Andrei Burmistrov,…

...

Social networks for a designer career
Today's topic, as you already understood, will be related to the use of social media by design workers and not only. Moreover, unlike the article about useful social networks, the…

...

Google+ style buttons, download 200 Google+ icons
The Google+ social network, even in beta testing, burst into the lives of advanced users, so do not be surprised at the interest that this social network causes, including web…

...