Chulakov Design #2: дизайнеры Студии Олега Чулакова продолжают делиться опытом

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

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

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

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

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

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

Долгое время по умолчанию считалось, что добавление звуков в интерфейс — это плохой тон. Это случилось из-за того, что интернет переболел плохими flash-сайтами, где звук использовался повсеместно.

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

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

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

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

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

Многие дизайнеры, насмотревшись концептов на таких площадках, как Dribbble, вдохновляются и создают то, что в действительности не понравится обычному пользователю. Причина — нарушение баланса между удобством и красотой, то есть UX и UI. Возникает вопрос: когда стоит обращать внимание на практичность, а когда на внешний вид?

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

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

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

Мы советуем соблюдать баланс между привычным и нестандартным и использовать механики в зависимости от контекста. Не будьте чересчур «сухими» и функциональными, но и не устраивайте бессмысленный карнавал на своих сервисах.

Рассмотрим возможные ошибки дизайнеров при взаимодействии с арт-директором.

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

Представьте, что показываете проект клиенту — аргументируйте, почему выбранное решение наилучшее.

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

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

Если совсем не знаете, с чего начать, обратитесь к арт-директору. Он задаст вектор, который поможет придумать идею и запустить процесс.

Когда арт-директор объясняет 15 минут, что вам необходимо сделать, и какие проблемы решить, записывайте, чтобы ничего не забыть.

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

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

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

Дизайнер должен стремиться делать так, чтобы арт-директор посмотрел на результат и утвердительно кивнул головой. В жизни так получается не всегда, но тем не менее вы должны понимать, что арт-директор — это тот, кто должен тянуть вас выше ваших возможностей. Показывайте свою работу, когда вы уже перепробовали всё, но понимаете, что ваш вариант недостаточно сильный. Спрашивайте, как нужно поступить, но будьте к этому времени готовы к объяснениям.