5 креативных видов иллюстраций для веб-дизайна

Любой декоративный элемент на странице сайта должен выполнять какую-то функцию. Как покреативить, но не перегрузить дизайн? В нашей статье мы на примерах покажем, какие иллюстрации бывают на сайтах и какие задачи при этом решают.

 1. Тематические иллюстрации

Они призваны создавать и усиливать определенную атмосферу. Как правило, сюжетная линия картинки тесно переплетается с основной тематикой сайта. 

Например:

Get my boss to North Cape

Эта иллюстрация кроме украшения несет и функционально-смысловую нагрузку. Босс заключил пари с подчиненным на то, что если они наберут пять тысяч лайков, боссу придется отправиться в суровое путешествие.

Atelier Anonyme Design

Команда дизайнеров сайта Atelier Anonyme Design на главной странице сделала ставку исключительно на иллюстрацию. Картинка является и фоном сайта, и ярким запоминающимся элементом.

2. Иллюстрация с персонажем

В последнее время большую популярность получили иллюстрации с персонажами. Обычно это некий вымышленный герой, с которым впоследствии ассоциируется сайт. 

Например:

inkFinder

Благодаря персонажу-осьминогу дизайн сайта лучше запоминается и становится более узнаваемым.

The Evnt 

Справа мы видим странного персонажа: мозг в скафандре на трех ножках. Согласитесь, что если убрать его со страницы, то она сразу потеряет половину своей уникальности.

Big Eye Creative

Посмотрите на верхнюю часть страницы. Этот персонаж не настолько сильно притягивает внимание, как в предыдущем примере. Являясь частью логотипа и иллюстрируя название, это одноглазое существо добавляет настроения и делает визуальный образ компании запоминающимся.

3. Иллюстрированные украшения

Эти иллюстрации призваны нести исключительно декоративную функцию. Такой подход также имеет право на жизнь, ведь красивые сайты запоминаются не хуже, чем проекты со “смысловыми” иллюстрациями. Главное здесь не переборщить. 

Вот несколько примеров:

Coca-Cola History

В одном из своих проектов Coca-Cola использовала иллюстрации для украшения дизайна. Он стал более современным и модным. Изображенные реальные вещи тоже стилизованы, чтобы вписаться в общую концепцию сайта.

Metaphiziks

Здесь иллюстрация выполняет роль фона, а все элементы гармонично подобраны и хорошо дополняют друг друга.

4. Иллюстрированный текст

Шрифт, нарисованный от руки, никогда не сравнится с машинным набором. Леттеринг всегда уникален, потому и захватил мир в конце 2010-х. 

Rangus 

Данный пример демонстрирует оригинальный иллюстрированный текст и персонажа.

Joey Lomanto

Скорее всего вы не сразу обратите внимание на то, что данный текст выполнен в рукописном стиле. Главное, что он хорошо сочетается с другими элементами дизайна. 

5. Иллюстрации со смыслом

Основная задача подобных иллюстраций — давать определения и пояснения к основному контенту. 

Давайте посмотрим примеры:

Bookish 

Главная страница сайта содержит блоки с информацией о назначении сервиса, дополненные понятными иллюстрациями. Можно понять смысл содержания, особо не вчитываясь в текст.

Uklizenodoma

Хороший пример сайта, на котором основа страницы — это информационная иллюстрация. Элементы помещения подписаны и ссылаются на соответствующие страницы.