Опасные дизайн тренды 2017,
некоторые из которых могут плохо повлиять на пользовательский опыт.

Вы читаете перевод статьи @eleana_gkogka «Dangerous Design trends 2017 Three plus three good design trends that can turn bad, harming the user experience.» Статью перевёл Михаил Хаснудинов, уровень перевода — любительский.
Вы не судите о книге по обложке, но о сайте вы судите по его дизайну. Люди склонны оценивать и судить о продуктах и веб–сайтах по тому как они выглядят раньше, чем познакомятся с их функциональностью и полезным действием. Все перечисленные в этой статье дизайнерские тенденции (далее — тренды) (прим. ред.) необходимы для сохранения новизны и привлекательности проектов. Но являются ли тренды панацеей?
Мы, дизайнеры, знаем, что следование трендам — важная часть нашей работы, но мы не должны использовать их вслепую.
Не каждый тренд применим, полезен или подходит для конкретного проекта. Даже следование хорошим трендам может отрицательно влиять на пользовательский опыт. Вот почему мы должны использовать тренды с осторожностью, выбирать
и корректировать их при необходимости.
Давайте взглянем на несколько опасных трендов, рассмотрим как использовать их с умом.
Яркие цвета

Как мы знаем, цвета передают эмоции и их можно использовать
в бренд–стратегии и при проектировании интерфейсов. Яркие цвета, как правило, привлекают внимание и создают больше положительных эмоций, чем темные или нейтральные.
Они всегда выглядят веселее, энергичнее и смелее, а пастельные
— более расслабляюще и прерывистее.
2017–й удивительный год: стартапы и новые продукты появляются словно грибы после дождя, и все борются, за место на рынке.
Цвет — хороший способ привлечь внимание и вовлечь нас, и именно поэтому яркие цвета становятся все более популярны.
Но следование этому тренду настолько привлекательно насколько может привести к неприятным последствиям и ухудшить пользовательский опыт.
Опасности
- Большие цветовые пространства или много ярких цветов, расположенных рядом друг с другом, могут заставить ваши глаза кровоточить, не буквально, конечно, но глазам будет больно.
- Текст, расположенный на ярком фоне, или рядом с ним.
Яркие цвета могут сделать чтение неприятным раздражающим
или невозможным. Яркие цвета отражают больше света.
Это примерно, как если бы вы светили фонариком в лица людей пока они пытаются читать. Даже если удастся прочесть,
люди получат негативный опыт.

Хорошо
- Соблюдайте баланс ярких цветов и больших темных объектов
или используйте более нейтральные цвета. - Используйте яркие цвета точечно, чтобы привлечь внимание
и направлять пользователя. - Используйте яркую типографику в качестве декоративного элемента.
- Используйте яркие цвета, чтобы подчеркнуть контент
или привлечь к нему внимание, способствовать взаимодействию
с ним.
Плохо
- Не используйте яркий цвета на больших пространствах или в качестве фона.
- Не применяйте слишком много ярких цветов на одной странице или рядом друг с другом.
- Не используйте яркие цвета на фоне или рядом с основным текстом.
- Не используйте яркие цвета на небольших, но значимых пространствах, таких как маленькие пиктограммы и навигация.
Экспериментальная верстка

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

Хорошо
- Используйте экспериментальную верстку когда чтение содержимого страницы не является главной целью.
- Используйте несбалансированную верстку как элемент между хорошо структурированными и выровненными блоками.
- Держите сгруппированные элементы в непосредственной близости и четко отделяйте разные блоки с контентом.
- Применяйте перекрывающиеся элементы только тогда, когда у вас есть хороший контраст и большой шрифт.
Плохо
- Не применяйте экспериментальную верстку на страницах
с большим количеством контента. - Не используйте несбалансированную верстку, когда у ваших пользователей не достаточно времени для просмотра контента.
- Не разбрасывайте элементы произвольно по странице.
Основные элементы должны быть на своем месте. - Не перекрывайте бездумно элементы. Учитывайте контраст
и связанные по смыслу элементы.
Маленькие элементы

Минимализм был популярен длительное время и до сих пор остается популярным. Тем не менее, мы наблюдаем переход к более насыщенной деталями верстке.
Причина в том, что минималистичный дизайн не может предложить столько же восхитительных и различных возможностей
как детализированные и сложные композиции.
В наши дни очень важно сосредоточиться на деталях.
Пространства содержащие мелкие элементы могут управлять взглядом. Могут вести взгляд от второстепенных элементов (от таких как пункты навигации), до плавающих элементов, которые
не выполняют никаких функций. Летающие декоративные иконки, подчеркивания, геометрические фигуры и фрагменты становятся все более популярными, так как они могут добавить интересную нотку
к любому проекту. Эти элементы могут выступать в роли балансиров, разделителей или указателей на содержимое страницы подобно маленьким подсказкам и комментариям.
Опасности
- Маленькие элементы могут конкурировать с навигацией
и контентом. Переизбыток деталей может подавлять внимание, не смотря на иерархию, или могут запутывать, вместо того,
чтобы помогать пользователю ориентироваться на странице
или просматривать контент.
Маленькие элементы, которые используются без конкретной цели — цифровой шум. - Маленькие элементы часто используют как декоративные. Элементы следуют за изображениями и типографикой и иногда перекрывают их. Иногда элементы следуют за прокруткой
или курсором. Тем самым они усиливают наше внимание.
Нужно осторожно использовать эту функцию и размещать элементы соответственно, не ставя под угрозу удобочитаемость.

Хорошо
- Используйте маленькие элементы осознанно с учетом контента, следя за тем, чтобы читаемость не пострадала.
- Используйте маленькие элементы в качестве указателей,
чтобы управлять вниманием пользователя или выделить основной контент. - Сочетайте маленькие элементы с минималистичной
и чистой версткой. - Пробуйте добавить контекст к деталям делая их подходящими
к контенту по смылслу.
Плохо
- Не используйте маленькие элементы на страницах с большим количеством содержимого.
- Если детали не помогают вам рассказать историю, то
не используйте их. - Попробуйте отделить функциональные элементы от главной пользовательской навигации.
- Отнеситесь к маленьким элементам как к небольшим изыскам,
а не как к главным компонентам вашего дизайна.
Мелкая типографика

Мелкая типографика выглядит и ощущается шикарно. Она оставляет пространство для других элементов для того, чтобы они дышали
и позволяли взгляду двигаться вокруг объектов. Использование уменьшенных шрифтов дает возможность создавать интересные контрасты без битвы за пространство.
С другой стороны, мелкая типографика может затеряться в больших текстовых блоках или может затруднить поиск и читаемость. Используйте мелкий шрифт с осторожностью — и только в коротких параграфах. Не используйте типографику размером меньше чем 13pt.
Экспериментальная навигация

Использование экспериментальных шаблонов в навигации становится все более популярным, так как все большее число дизайнеров пробуют внедрять инновации.
Различные стили навигации могут сделать веб–сайты с небольшим количеством контента более интересными или помогут пользователям ориентироваться особым способом.
Экспериментальные шаблоны могут быть восхитительными
и полезными, если они интуитивно понятны, чтобы пользователи могли взаимодействовать с ними. Важно понимать, что не любая навигация подойдет для вашего проекта или аудитории.
Важно сначала проверить удобство ее использования.
Анимация

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

Заключение
В море веб–сайтов и продуктов, дизайнеры пытаются сохранить свежесть и уместность своих работ следуя трендам. Но тренды могут быть опасными и не должны быть панацеей.
Важно, чтобы мы использовали их осознанно в зависимости
от содержания, аудитории и целей, которые мы пытаемся достичь.
Наконец, самое главное — мы не должны жертвовать пользовательским опытом ради того, чтобы проекты выглядели хорошо и современно.