Четыре универсальных принципа дизайна для создания хорошего интерфейса

Сделайте информацию доступной для восприятия

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

Таблицы ниже содержат одни и те же данные. Однако информацию во втором варианте гораздо легче читать и воспринимать.

«Каждый лишний элемент, график, линия или символ отвлекает внимание от важных деталей», — Лидвелл и др.

Если вам кажется, что форма привлекает больше внимания, чем важные данные, которые нужно представить пользователям — пересмотрите концепцию и убедитесь, что придерживаетесь хорошего отношения сигнал/шум.

Контролируйте функциональную нагрузку

Хороший дизайн должен упрощать выполнение задач и освобождать пользователя от лишних действий.

Функциональная нагрузка делится на два типа: когнитивная и кинематическая.

• Когнитивная нагрузка — это объем умственной работы, необходимой для достижения цели. Когда человек видит какой-либо предмет впервые, он начинает размышлять о том, как его использовать. То же самое касается и продукта. Меньше всего пользователям хочется думать о том, как применять дизайн. Им нужно лишь выполнить с его помощью задачу. Поэтому когнитивная нагрузка должна быть как можно ниже.
• Кинематическая нагрузка — это уровень физической активности, необходимой для достижения цели. Дизайн не должен требовать от пользователя выполнения лишних и неинтуитивных действий. При создании какой-либо функции подумайте о том, как пользователь будет ее использовать. Результат должен требовать как можно меньше усилий, но приносить больше преимуществ.

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

Располагайте связанные элементы близко друг к другу

Это один из самых недооцененных принципов юзабилити.

Самые удобные для использования продукты придерживаются этой концепции. Для примера рассмотрим скриншот страницы YouTube.

1. Панель приложения находится в отдельном контейнере. Таким образом сразу понятно, что меню, поиск и другие элементы относятся к странице в целом, а не к конкретному видео.
2. Элементы управления накладываются на само видео, что еще больше усиливает их близость и связь с ним.
3. Элементы, такие как «Нравится» и «Поделиться», расположены в контейнере заголовка. Это указывает на то, что они относятся непосредственно к самому видео.
4. Кнопка «Подписаться» находится напротив названия канала, что дает понять, что вы подписываетесь на этот конкретный канал.
5. Похожие видео расположены близко друг к другу, что визуально подчеркивает их связность.

«Близкое расположение элементов упрощает дизайн и усиливает их взаимосвязь. И наоборот, расположенные далеко друг от друга элементы воспринимаются разрозненно», — Лидвелл и др.

Используйте метод итерации при создании продукта

Итерация — процесс повторения набора различных практик до достижения определенного результата.

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

В то же время создание нескольких отдельных версий позволяет проанализировать каждое внесенное изменение и выяснить, какое из них будет более эффективным.

Прибегать к крайностям в итерациях также бывает очень полезно.

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

«Каждый цикл при создании дизайна сужает диапазон возможностей до тех пор, пока дизайн не будет соответствовать требованиям», — Лидвелл и др.

Источник.