Иллюстрации в приложениях и на сайтах всегда актуальны. Почему стоит применять рисованные изображения, в каких случаях это уместно, в чем плюсы и минусы? Платить, рисовать самостоятельно или взять бесплатно? Об этом сегодня поговорим. + Бонус: ТОП-15 ресурсов с бесплатными иллюстрациями.
Иллюстрации нельзя назвать трендом – они, кажется, были всегда. Начиная с наскальных рисунков. Просто с появлением онлайн-ресурсов рисунки перекочевали в цифровое пространство, обрели новые значения, смыслы и цели.
И мы можем использовать в своих интересах возможность применять иллюстрации в свои проектах. Нужен оригинальный визуал – выбирай иллюстрации. Нужно показать то, чего не передаст фото – выбирай иллюстрации. Хочешь точно попасть в цветовую палитру и фото с этим не справятся – выбирай иллюстрации.
Это способ сделать красиво, эффектно и эффективно.
Это возможность создать схематичное объяснение процесса гипотетической или вовсе несуществующей в реальном мире ситуации.
Это великолепное решение, когда у заказчика нет фотоматериалов, а брать стоковые приевшиеся всем фото они не хотят.
Плюсы и минусы иллюстраций в веб-дизайне
Очевидное преимущество – это возможность изобразить буквально все. Любые фантастические картины и в любом стиле. Тем более сейчас даже самостоятельно не обязательно заморачиваться, ведь нейросети с каждым днем становятся все умнее и уже даже не рисуют лишние пальцы людям. Мы про них писали в отдельной статье.
Рисунок без проблем можно адаптировать под фирменный стиль компании, можно сделать его нужной формы, если у тебя предусмотрена оригинальная разметка.
Нет ограничений. Любую формальную нишу можно сделать увлекательной, украсив сайт интересными иллюстрациями. Вот представь автосервис. Традиционно это машины-шины-инструменты. Уже приелось. А если это милые зверюшки в костюмах суперменов спасают твое авто от поломки? Или автомобиль будет не просто фотографией, а шикарной стильной графикой, может быть, монохромной. Это ведь уже меняет дело.
Рисунок имеет суперсилу вдохнуть жизнь даже в самые скучные дела и предметы. Все зависит только от фантазии. Можно свежо и нетривиально подать продукт и выгодно выделиться среди конкурентов.
Максимальная толерантность – еще один большой плюс рисунков. Если посмотреть на гугловских людей, то вовсе нельзя определить их расу, возраст, вес и даже пол. И это твой шанс охватить огромную целевую аудиторию, никого не обидеть и дать каждому из представителей ЦА персонажа, с которым он может себя ассоциировать. Именно поэтому крупные корпорации этим пользуются повсеместно.
Стоит еще обозначить, что мы здесь рассуждаем в основном про рисунки, которые используются вместо привычных фотоматериалов. Но иллюстрация – это еще и от руки нарисованные элементы навигации, иконки, объединяющие блоки, штрихи и элементы, авторские шрифты. Такие мелочи превращают сухой дизайн в душевный, придают человечности и уюта.
Фото или иллюстрация?
Тут будет сравнение. Почему и когда иллюстрация выигрывает у фотографии, а когда вовсе нет.
Цена. Если картинку тебе рисует не Бэнкси, то зачастую она выходит дешевле, чем фото. Речь, конечно, о кастомных изображениях. Для рисунка не нужна аппаратура, локация, модели и реквизит. И правки внести удобнее, а это тоже время/деньги. А если фотосессия оказалась провальной, то исправить это очень сложно. Поэтому при прочих равных иллюстрации тут нередко побеждают.
Оригинальность. Сделать действительно необычные цепляющие фото трудно. Опять же, это вопрос цены тоже. Но и в целом сложно придумать велосипед во многих стандартных нишах. А еще твои картинки будут точно оригинальными и неповторимыми. Многие фирмы даже строят свой образ на рисованных маскотах, как Монобанк, например. И это их фишка, которую не отнять. Лицо Скарлетт Йоханссон может быть тоже сработало бы, но даже она не в силах переплюнуть милого котика.
Простота реализации. Часто случается так, что подходящее фото просто сложно найти. У заказчика есть очень много требований именно к тому, что там должно быть. Он указывает и расположение деталей, и прическу персонажей, а потом еще у них оказывается “недостаточно устремленный взгляд” или что-то такое. Плюс к такой задаче нужно найти фото, которое впишется в дизайн и палитру. Конечно, найти такие фото на стоке ты вряд ли сможешь. А съемка – это долго и дорого. Вот иллюстрация как раз спасет в этом вопросе. Любое ТЗ под силу опытному иллюстратору. Даже семь перпендикулярных красных линий, две из которых нарисованы зеленым цветом, одна прозрачным, а одна в форме котенка. Если ты понимаешь, о чем мы)
Целостность дизайна. Можно обрабатывать фото и доводить дизайн до совершенного соответствия стилю. Но с рисунком это сделать проще. Особенно это часто применяется для дизайна социальных сетей и блогов. Графика в большинстве случаев будет смотреться более органично и целостно. Можно объединять фото с иллюстрациями, так это тоже работает.
Когда иллюстрация не работает?
- Если тебе нужно показать физический товар. Покупатель должен его видеть, а не представлять. Хотя и тут можно добавить дополнительно схематичную инструкцию или что-то такое.
- Если нужно показать эксперта/селебрити/личность. Конечно, группа Gorillaz доказала, что мультяшки могут заменить людей. Но это в творческой сфере. Во многих ситуациях хочется посмотреть в глаза человеку, которому ты собираешься довериться.
- Если заказчик против. Тут ничего не сделаешь – даже если покажешь, что стили бывают разными.
Стоки с иллюстрациями
Самостоятельная рисовка имеет массу преимуществ. Это и оригинальный стиль, и поле для фантазии, и фирменные фишки, которые со стоков никто не берет. Но тратить время специалиста на стандартные решения – нецелесообразно. К тому же, чаще это работа отдельно взятого художника, а не дизайнера.
Да, это круто. Но дорого. И если проект требует иллюстраций вместо фото, то зачастую у заказчика просто нет бюджета на съемку. И на рисовку, соответственно, тоже не будет.
Хорошо, рассмотрим тогда стоки. Платить или не платить? Брать платные иллюстрации на стоках – это хорошо. И поддержка художников, и более редкие решения, и гораздо более широкий выбор. Но это не дает гарантии 100% оригинальности. Только авторские иллюстрации на заказ с выкупом права собственности могут дать уверенность в том, что такое будет только у тебя. Ну или даст право судиться с плагиаторами. Если в планах нет настолько серьезных намерений и бюджетов, то бери бесплатные элементы, они ничем не хуже.
На стоках есть буквально десятки тысяч крутых паков иллюстраций. И многие из них даже бесплатные. В этой статье картиночки взяты с раздела бесплатных иллюстраций iconscout.
Вот наша подборка ТОП-ресурсов:
- Mixkit – тут рисунки разделены по тематикам. Абсолютно бесплатно можно взять в свой проект настоящий шедевр – много нестандартных направлений и стилей.
- IconScout – отсюда берут свои элементы такие гиганты как Disney, Amazon, Netflix, Spotify и Uber. Хочешь делать продукты их уровня – пользуйся. Есть не только иллюстрации, но и прочие полезные штуки: плагины, иконки, анимация, 3D-графика.
- Pictor – лаконичные рисовки по теме офиса. Ничего лишнего.
- Absurd Design – оригинальный абсурдный стиль, который спасает, когда типичная рисовка приелась. Тут большинство картинок платные, но и бесплатных достаточно. В любом случае, это не тот стиль, который подойдет любому проекту и много таких иллюстраций и не нужно.
- Sapiens – тут ты не просто берешь иллюстрацию, а создаешь ее в конструкторе. Опасная платформа, которая затягивает. Играться с параметрами можно долго, это увлекает.
- Drawkit – база, на которую стоит подписаться, потому что там каждую неделю есть обновления и рассылка с новинками. Есть возможность оплатить пакет, но и бесплатных вариантов достаточно.
- Isometric – хороший ресурс для тех, кто оформляет объемные проекты. Тут очень много направлений, но все они в одном стиле. Для информационных порталов, интернет-магазинов и площадок-агрегаторов это отличное решение.
- Streamline – огромное количество трендовых решений, есть платные и бесплатные пакеты.
- Open Peeps – огромный плюс этого ресурса в том, что отсюда можно забирать иллюстрации в коммерческие проекты бесплатно и без указания авторства.
- Shapefest – тут найдутся картинки с разными текстурами, выбирай по теме своего продукта и ищи подходящие решения.
- Ouch! – обрати внимание, здесь нужно при использовании иллюстраций оставлять ссылку на сайт. Но зато ты получаешь доступ к элементам, созданным лучшими иллюстраторами с Dribbble.
- ls.graphics – тут крутые картинки бесплатны, но тоже нужно указывать авторство согласно лицензии.
- Freepik – ты уже знаешь этот сток. Ты берешь тут фото и шрифты. Но и иллюстраций тут много. А еще иконок, фонов, шаблонов, векторной графики и прочих крутых бесплатных штук.
- Avatarz.design – этот сервис помогает создать рисованных аватаров. Хорошо подойдет для генерации виртуальных ассистентов, героев истории, персонажей.
- Indian Doodle Illustration Pack – портал с иллюстрациями исключительно для цифровых проектов. Стиль выдержан в лучших традициях Индии. Очень уместно для колл-центра техподдержки международной компании.
Само собой, иллюстрации есть и на уже легендарных стоках Unsplash, Pixabay и Pexels. Но мы их не включаем в наш ТОП, потому что они настолько популярны, что некоторые рисунки уже использовали сотни раз все, кому не лень. Если хочешь сделать оригинальный проект – копай глубже. Не стоит подвергать риску свою репутацию и быть дизайнером, который делает попсу.
Как внедрять это в проект
При любых раскладах нужно иметь чувство стиля, понимать как работает изображение и палитра с точки зрения маркетинга, уметь подчеркнуть достоинства.
Иллюстрация должна быть органичной, подчеркивать посыл сайта, усиливать преимущества предложения и создавать нужный настрой. Важно не сделать серьезный ресурс комичным из-за нелепых рисунков. А еще важно вписать элементы понятно и удобно.
Тут нужно изучать теорию цвета, основы UX/UI и владеть дизайнерскими инструментами, чтобы довести проект до состояния целостности. Учись, тренируй насмотренность, ищи хорошие ресурсы с рисовкой и попробуй выделять, что именно в них смотрится удачно и почему. Без практики не обойтись – надо попробовать, тогда будет понятнее. Хочешь быстрее освоить тонкости мастерства? Ты в курсе, что надо делать. Записывайся на онлайн-курс «UX/UI легенда».