0
Rating

Размышления об интерфейсах

Eyetronic corporate blog
image
Хочу поделиться некоторыми размышлениями по поводу интерфейсов, местами переходящие в советы и замечания. Отмечу, что сплошь и рядом мы встречаемся с различными онлайн сервисами, поэтому, когда я говорю интерфейс – я имею в виду не только классические окошки десктоп-приложений, но и интерфейсы встречающиеся в вебе). Надеюсь, эти сведения окажутся для кого-то полезными, а для более опытных, просто удобной формулировкой того, что они и так знают (что, кстати, как показывает практика, бывает тоже очень полезно).

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


Начинать работать над интерфейсом нужно на стадии проектирования, а если быть точным, то на стадии «проектирования взаимодействия», иначе это превратится в прикручивание кнопок и плашек (раньше многие дизайнеры в портфели вешали свои кастомные скины ко всяким винампам и называли это дизайном интерфейсов). Вообще в этом вопросе лучше всего идти именно от пользователя и его потребностей, от его поведения. Абстрагируясь от всего того вороха функционала, который мы хотим ему дать. Необходимо представить, (а лучше задокументировать, хотя бы для внутреннего пользования) какие будут основные сценарии его поведения, а также где и что он захочет нажать (в принципе, вопросы проектирования достойны отдельного упоминания).

Основой визуального интерфейса являются визуальные шаблоны
Глядя на любой интерфейс, пользователь задается вопросами — «Что тут интересного?», и почти сразу – «Какая связь между этими объектами?». И да – он должен почти сразу получить ответы на эти вопросы. Связи между элементами должны быть всегда одинаковыми на протяжении всего пользования интерфейсом (если у нас все всплывающие подсказки закрываются крестиком, то не надо вдруг где-то вводить кнопку «Закрыть»). Пользователь очень быстро привыкает к определенной группировке элементов, к тому, как и где они действуют, и начинает этот опыт применять ко всем страницам и экранам данного интерфейса.

Создайте визуальную иерархию
Качественную визуальную иерархию пользователи практически не замечают. ЗАТО, её отсутствие сразу бросается в глаза и вызывает путаницу. У элементов может быть множество свойств, изменение которых позволяет выделить их, установить связь (цвет, насыщенность, контрастность, размер и положение). Однако лучше всего использовать только одно из них. Причем стоит выбрать определенную «базу» и двигаться от неё в меньшую сторону. Т.е. если у нас обнаружится, что два элемента различной важности состязаются за внимание пользователя, «прикрутить фитиль» менее важного будет лучшим решением, чем пытаться «разжечь» более важный (если все слова набраны жирным красным шрифтом, выделяется ли хоть одно из них?).

Не забывайте про логический маршрут
Композиция всех элементов должна не только следовать сетке (выравнивание и сетка – это вообще одни из самых главных приемов в дизайне), но и формировать для пользователя эффективный и логический маршрут через интерфейс. При этом надо помнить о том факте, что взгляд движется сверху вниз и слева направо (для западных языков). В данном случае очень помогают (для тех, кому они доступны, разумеется) технологии отслеживания движения глаз, хотя совсем явные ляпы можно отловить и простым тестированием на группе людей.
image


Избегайте визуального «шума»
Визуальный шум в интерфейсе возникает из-за излишних графических элементов, отвлекающих внимание от элементов, непосредственно связанных с функциональностью. Необязательные декоративные и излишне «объемные» элементы, злоупотребление линиями и иными разделителями между элементами управления, неуместное или излишне интенсивное использование цвета, текстур и контраста – все это не лучшим образом сказывается на интерфейсе.

В конце еще раз выскажусь на тему красоты и функционала. Дизайнеры – не художники. Художники создают объекты, которые вызывают «эстетический отклик», это самовыражение на определенную тему (хотя многие современные «дизайнеры» стремятся создать что-то максимально непонятное и абстрактное). Дизайнеры, напротив, создают объекты для других людей. И если говорить о дизайнерах интерфейсов, то они должны наилучшем образом донести информацию о том, как работает программа или сервис, который они проектируют (а не рисуют, украшают, приводят в порядок и т.д.).
У себя в Айтронике клиентам мы тоже активно пытаемся донести все эти мысли, но пока с переменным успехом. К сожалению, многие продолжают судить о работе дизайнеров по «количеству вываленной на экран краски», а не по смыслу и решенным задачам.
Tags:интерфейсывеб-дизайнвеб-интерфейсы
Hubs: Eyetronic corporate blog
+13
11.6k 47
Comments 30

Top of the last 24 hours

Information

Founded
Location
Россия
Website
www.art.su
Employees
11–30 employees
Registered