Как проявляется эстетика в интерфейсе
Рассматриваем 9 гипотез. Часть 2
В предыдущей статье мы обсудили 4 группы критериев, связанных с восприятием интерфейса пользователем. Это сенсорика и тактильные ощущения, эмоциональный отклик, общественная эстетика и принципы восприятия, определяемые гештальт-теорией. Фактически — что и как воспринимает пользователь и как это влияет на его оценку.
Сегодня поговорим о тех факторах, влиять на которые могут разработчики интерфейсов.
Этика
К этичным решениям в области интерфейсов можно отнести доступность восприятия для каждого пользователя, учет мнений и забота о разумном потреблении энергии.
Доступность восприятия по-другому можно назвать инклюзивным дизайном. Сейчас тенденция – не создавать отдельные форматы интерфейсов для людей с ограниченными возможностями, а максимально адаптировать существующие ресурсы для любого восприятия. При этом учитываются размеры и четкость важной информации, наиболее нейтральные сочетания цветов, встроенные инструменты интерфейса, которые позволяют настроить цветовую гамму и масштаб. Полные правила для создания инклюзивного интерфейса описаны здесь.
Учет мнений пользователей может проявляться в виде краткого опроса, просьбы об оценке или формы обратной связи. Видя эти элементы, пользователи отмечают, что их мнение тоже учитывается – даже если они не участвуют в сборе мнений.
Забота о разумном потреблении энергии выражается в стремлении сделать интерфейсы более «легкими», а также в возможности использовать темную тему или упрощенное отображение экранов.
Этичные решения вызывают положительные эмоции и показывают пользователям, что разработчики интерфейса задумываются не только о получении прибыли, но и о людях и окружающей среде.
Техника
То, что отличает дизайнера-самоучку, действующего «по наитию», от профи – это техника и умение выбирать инструменты и средства для создания продукта.
В дизайне интерфейсов также присутствует понятие техники. Существуют правила выбора оттенков, создания градиентов, сочетания шрифтов. Несмотря на постоянно меняющиеся тренды, базовые принципы служат хорошим ориентиром.
Эстетика техники — это то, что отличает интерфейс, созданный профи, от работ начинающего дизайнера.
Отличия могут быть заметны не всем, они часто прячутся в незначительных деталях – но опытные специалисты в области UI смогут увидеть разницу. Например, по этому концепту можно увидеть, насколько кропотливо велась работа. Сложные, но при этом, узнаваемые формы, интересные визуальные решения и при этом удобство использования.
Система
Многие дизайнеры и веб-агентства начинают свою работу над интерфейсом с создания UI-кита – набора элементов, на основе которого будет строиться дизайн. UI-кит может включать в себя используемые цвета, кнопки, иконки, шрифты и другие визуальные элементы. И в этом тоже есть своя эстетика.
По отдельности все элементы могут быть красивы и эстетичны, но совершенно не сочетаться между собой и не отвечать требованиям интерфейса. Системность, следование правилам, принятым при создании дизайна – вот, что создает истинную эстетику.
Также к системности можно отнести использование давно известных гармоничных принципов – симметрии и золотого сечения. Высший пилотаж – идти «в нарушение» этих принципов, при этом сохраняя общую эстетику. Например, грамотно расположить один асимметричный элемент среди симметричных, чтобы привлечь к нему внимание.
Семантика
Если смотреть глубоко, то цвета и формы – это не просто визуальные элементы. Все они имеют определенное значение, основанное на ассоциациях и психологии. Например, оранжевый цвет воспринимается как теплый, радостный, побуждающий к действиям. Голубой – цвет моря, неба и свободы. В таких оттенках часто оформляются сайты официальных учреждений. Ресурс Alterspark даже опубликовал целую статью по влиянию цветов интерфейса на восприятие пользователей.
Существуют также и негласные правила употребления того или иного цвета. Например, красный означает ошибку, желтый или оранжевый – предупреждение, зеленый – то, что все хорошо, светло-серая кнопка указывает на ее временную недоступность. Если, например, мы сделаем предупреждающий значок синим, многие пользователи испытают неудобство, потому что это идет вразрез с общепринятыми правилами.
Формы и шрифты тоже имеют значение. Например, странно представить сайт детского сада с рублеными шрифтами, оформленный в стиле брутализм. И, напротив, онлайн-ресурс финансовой компании совсем не будет смотреться с мягкими очертаниями кнопок, креативной анимацией и «веселыми» шрифтами.
Конечно, такое определение семантики достаточно примитивно – опытные дизайнеры и маркетологи «копают» глубже. Но принимая во внимание даже такие простые правила, вы больше приблизитесь к созданию эстетически прекрасного интерфейса.
Взаимосвязь
Считается, что истинная красота и эстетика – это гармония. Эстетика взаимосвязи – это то, насколько гармонично интерфейс вписывается в контекст использования.
Например, почему ридеры Kindle так популярны? Если оценивать их интерфейс в отрыве от контекста, то он значительно проигрывает интерфейсу того же iPad: здесь используется только серый цвет в 16 различных оттенках, нет анимированной прокрутки и т.д. Но если принять во внимание условия использования, то все встает на свои места.
Ридер изначально предусмотрен для комфортного длительного чтения, а для этого интерфейсу не нужно обилие многоцветной графики и анимаций – с такими эффектами глаза, наоборот, устают быстрее. Поэтому в контексте выполняемой задачи интерфейс Kindle считается одним из лучших.
Эстетика взаимосвязи также может проявляться как соответствие интерфейса привычным нормам. Например, популярные производители фаст-фуда – Макдональд’с, Бургер Кинг – задали стандарт интерфейсам киосков для заказа продукции. Мы привыкли к определенному виду экрана киоска, где слева расположены категории меню, на основной части экрана – сама продукция, а внизу – корзина. Если в каком-то заведении фаст-фуда мы увидим другой интерфейс, то посчитаем его неудобным и неэстетичным, так как он не будет отвечать нашим представлениям.
Заключение
Конечно, понятие эстетики для каждого останется своим, все-таки это эмпирическое понятие. Но если суммировать рациональные гипотезы, получается что эстетика интерфейса заключается в:
Соответствии трендам и тенденциям общества (совет – тренируйте насмотренность);
Качественно подобранном визуале, звуковом и тактильном сопровождении (совет – работайте над контентом, плохой контент убьет самый лучший дизайн);
Соответствии контексту применения;
- Эмоциональной составляющей – уместном употреблении юмора и заботе о пользователях.
Уместить все эти гипотезы в одном дизайне сложно, да и не всегда нужно. Главное – соответствие целевой аудитории и функциям, которые выполняет интерфейс.
Кроме того, что делать дизайн, который подходит для всех пользователей, теперь этично и модно, это еще и дешевле, чем делать и поддерживать несколько версий.