{"id":14275,"url":"\/distributions\/14275\/click?bit=1&hash=bccbaeb320d3784aa2d1badbee38ca8d11406e8938daaca7e74be177682eb28b","title":"\u041d\u0430 \u0447\u0451\u043c \u0437\u0430\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u044e\u0442 \u043f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0435 \u043f\u0440\u043e\u0434\u0430\u0432\u0446\u044b \u0430\u0432\u0442\u043e?","buttonText":"\u0423\u0437\u043d\u0430\u0442\u044c","imageUuid":"f72066c6-8459-501b-aea6-770cd3ac60a6"}

Chulakov Design #3: поговорим о дизайне

Дизайнеры Студии Олега Чулакова рассказывают о привычных пользовательских механиках, интерфейсах, с которыми приятно взаимодействовать и о том, как важен контраст.

А здесь вы найдете другие заметки дизайнеров Студии.

Право на ошибку

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

Первое, что приходит в голову — алерт-подтверждение. Однако всплывающие окна при повторяющихся действиях могут сильно раздражать.

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

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

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

Отзывчивый интерфейс

Вы пытались когда-нибудь общаться с человеком, который находится к вам спиной? Это довольно непростая задача, ведь без ответной реакции трудно понять, как он относится к тому, что вы говорите, и слушает ли вас вообще.

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

Если вы видите неотзывчивый интерфейс, знайте — дизайнер повернулся спиной к своему пользователю.

Привычная механика

В процессе развития интерфейсов люди учились управлять элементами, привыкали к новым паттернам поведения, изучали, как работают свитчеры, барабаны, тоглы, свайпы и т. д. В результате это стало для них шаблоном: иконка плей — это всегда запуск аудио или видео; крестик — это закрыть. Когда следует соблюдать эти шаблоны поведения, а когда их можно нарушить?

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

Однако вы можете изобретать новые решения с нуля, не основываясь на каком-то привычном элементе или паттерне поведения. Главное, чтобы оно было понятно пользователю и считывалось без объяснений. Вы можете создать новый опыт взаимодействия, применяя механику работы вещей из привычного мира, но не путайте с скевоморфизмом. В качестве хорошего примера: установление будильника в iOS выполнено в виде интерактивных часов с четким и наглядным периодом сна человека.

Контраст

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

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

Чем лучше вы чувствуете контраст, тем больше у вас шансов заинтересовать пользователя.

0
2 комментария
Pixel Lens

Работы у вас мощные, чувствуется сила. Но для статей может всё-таки копирайтера нанять? Скушно ведь...

Ответить
Развернуть ветку
Valentin Dombrovsky

Статья с рейтингом -2 на главной — это как?

Ответить
Развернуть ветку

Комментарий удален модератором

Развернуть ветку
-1 комментариев
Раскрывать всегда