Содержание
- Разные стили
- Расчищая путь
- Пять примеров для проверки
- 01. Базовый лагерь
- 02. Эксперименты
- 03. MailChimp
- 04. Несомненный
- 05. Ян Джеймс Кокс
Иллюстрация может добавить вашему веб-дизайну характера, тепла и индивидуальности. Однако существует опасность замутить воду взаимодействия и общения, если это не будет сделано хорошо.
Важно убедиться, что существует четкое различие между интерактивными элементами и иллюстративным контентом.
Это гарантирует, что сайт не только будет красивым, но и позволит пользователям легко перемещаться по нему и предпринимать любые действия, такие как подписка на информационный бюллетень.
Разные стили
К различию взаимодействия и иллюстрации можно подойти по-разному. Однако обычно лучше, если кнопки, элементы навигации и призывы к действию не будут выдержаны в том же стиле, что и иллюстрация на остальной части страницы, чтобы они выделялись.
Например, если иллюстрация сильно текстурирована и грубая, возможно, все, с чем взаимодействует пользователь, должно иметь резкие края и тени. Если иллюстрация линейная или одноцветная, то хороший способ отличить ее от навигации - сделать все остальные элементы яркими.
Расчищая путь
Дело в том, что создание этих элементов, визуально отличных от иллюстрации, помогает уменьшить путаницу, поскольку пользователи могут легко определить, что они хотят делать или куда они хотят пойти. Это, в свою очередь, позволит пользователю восхищаться прекрасными произведениями искусства на вашем сайте, но при этом получать их на своем пути.
Пять примеров для проверки
01. Базовый лагерь
Веб-сайт приложения для управления проектами Basecamp идеально использует символические иллюстрации, чтобы рассказать историю о том, что это за приложение и что вы с ним делаете.
02. Эксперименты
На веб-сайте Xperiments иллюстративные и интерактивные элементы слишком тесно смешаны. Хотя это красиво иллюстрировано, это может привести к возникновению некоторых запутанных моментов взаимодействия.
03. MailChimp
Приложение для электронного маркетинга MailChimp - отличный пример использования богатых иллюстративных и графических изображений и очень четкого различия между ними и интерактивными элементами.
04. Несомненный
Сайт-портфолио веб-дизайнера для Indubitablee - отличное сочетание иллюстраций и сбалансированных интерактивных элементов. Они даже используют цвет, чтобы визуально подчеркнуть разницу.
05. Ян Джеймс Кокс
Веб-сайт портфолио Иэна Джеймса Кокса использует как иллюстративные элементы, так и традиционную навигацию, чтобы создать интересный способ навигации по содержанию сайта.
Эта статья впервые появилась в сетевом журнале - самом популярном в мире журнале для веб-дизайнеров и разработчиков.
