Chulakov Design #3: поговорим о дизайне
Дизайнеры Студии Олега Чулакова рассказывают о привычных пользовательских механиках, интерфейсах, с которыми приятно взаимодействовать и о том, как важен контраст. Право на ошибку
При работе со сложным интерфейсом пользователи могут по ошибке удалить то, что не следовало бы. Некоторые сервисы используют архив или корзину с удаленными элементами, что помогает оградить человека от необратимой ошибки и незапланированного удаления своих данных.
Первое, что приходит в голову — алерт-подтверждение. Однако всплывающие окна при повторяющихся действиях могут сильно раздражать.
Если коротко, то ошибки можно разделить на критичные и некритичные. После удаления некритичного элемента из списка нет смысла выводить на экран громоздкий алерт с подтверждением — можно на несколько секунд вывести сообщение об удалении с возможностью отменить действие или на месте удаленного элемента разместить кнопку «восстановить», пока пользователь находится на этом экране.
Если же речь идет об удалении важных данных, здесь не обойтись без подтверждения. В сервисе Zeplin, который помогает взаимодействовать дизайнерам и разработчикам, например, нужно ввести полное название проекта для подтверждения удаления.
Ошибаться не страшно, страшно не продумывать возможные ошибки пользователей. Отзывчивый интерфейс
Вы пытались когда-нибудь общаться с человеком, который находится к вам спиной? Это довольно непростая задача, ведь без ответной реакции трудно понять, как он относится к тому, что вы говорите, и слушает ли вас вообще.
То же самое и с интерфейсом. Основное правило: на любое действие пользователя должна происходить реакция, например, каждая ссылка, кнопка или целый блок должны моментально сообщать, что ваше действие принято, и не нужно совершать что-то повторно. Следующий уровень, когда наведения не только могут сказать о кликабельности элемента, но и начинают подталкивать пользователя к действию, создавая правильную атмосферу, либо сообщают дополнительную информацию.
Если вы видите неотзывчивый интерфейс, знайте — дизайнер повернулся спиной к своему пользователю. Привычная механика
В процессе развития интерфейсов люди учились управлять элементами, привыкали к новым паттернам поведения, изучали, как работают свитчеры, барабаны, тоглы, свайпы и т. д. В результате это стало для них шаблоном: иконка плей — это всегда запуск аудио или видео; крестик — это закрыть. Когда следует соблюдать эти шаблоны поведения, а когда их можно нарушить?
Если что-то конкретное работает так, как привыкли пользователи, не меняйте его. Человек ожидает ровно то, что он привык видеть. Например, частая ошибка начинающих дизайнеров — применение иконки галочки в качестве радиобаттона. Если у вас возникает мысль, что пользователь переучится, смело бросайте это решение и ищите другое.
Однако вы можете изобретать новые решения с нуля, не основываясь на каком-то привычном элементе или паттерне поведения. Главное, чтобы оно было понятно пользователю и считывалось без объяснений. Вы можете создать новый опыт взаимодействия, применяя механику работы вещей из привычного мира, но не путайте с скевоморфизмом. В качестве хорошего примера: установление будильника в iOS выполнено в виде интерактивных часов с четким и наглядным периодом сна человека. Контраст
На контрасте построено множество ходов в самых различных сферах. Например, в фильме ужасов перед самым страшным моментом сценарист дает нам понять, что главный герой в безопасности. Другой пример: персонаж нам кажется интересней, если по ночам угоняет машины, а днем переводит бабушку через дорогу.
Одно из важных для дизайнера качеств — умение работать с контрастом. Он необходим во всем. В подаче — большие объемы информации нужно разбавлять инфографикой или изображениями. В размере элементов и в свободном пространстве — для создания интересной композиции с правильными акцентами. В логике — у вас должен быть четко построен основной сценарий пользователя с большими кнопками, а дополнительные пути уже проходят через второстепенные ссылки.
Чем лучше вы чувствуете контраст, тем больше у вас шансов заинтересовать пользователя.
При работе со сложным интерфейсом пользователи могут по ошибке удалить то, что не следовало бы. Некоторые сервисы используют архив или корзину с удаленными элементами, что помогает оградить человека от необратимой ошибки и незапланированного удаления своих данных.
Первое, что приходит в голову — алерт-подтверждение. Однако всплывающие окна при повторяющихся действиях могут сильно раздражать.
Если коротко, то ошибки можно разделить на критичные и некритичные. После удаления некритичного элемента из списка нет смысла выводить на экран громоздкий алерт с подтверждением — можно на несколько секунд вывести сообщение об удалении с возможностью отменить действие или на месте удаленного элемента разместить кнопку «восстановить», пока пользователь находится на этом экране.
Если же речь идет об удалении важных данных, здесь не обойтись без подтверждения. В сервисе Zeplin, который помогает взаимодействовать дизайнерам и разработчикам, например, нужно ввести полное название проекта для подтверждения удаления.
Ошибаться не страшно, страшно не продумывать возможные ошибки пользователей. Отзывчивый интерфейс
Вы пытались когда-нибудь общаться с человеком, который находится к вам спиной? Это довольно непростая задача, ведь без ответной реакции трудно понять, как он относится к тому, что вы говорите, и слушает ли вас вообще.
То же самое и с интерфейсом. Основное правило: на любое действие пользователя должна происходить реакция, например, каждая ссылка, кнопка или целый блок должны моментально сообщать, что ваше действие принято, и не нужно совершать что-то повторно. Следующий уровень, когда наведения не только могут сказать о кликабельности элемента, но и начинают подталкивать пользователя к действию, создавая правильную атмосферу, либо сообщают дополнительную информацию.
Если вы видите неотзывчивый интерфейс, знайте — дизайнер повернулся спиной к своему пользователю. Привычная механика
В процессе развития интерфейсов люди учились управлять элементами, привыкали к новым паттернам поведения, изучали, как работают свитчеры, барабаны, тоглы, свайпы и т. д. В результате это стало для них шаблоном: иконка плей — это всегда запуск аудио или видео; крестик — это закрыть. Когда следует соблюдать эти шаблоны поведения, а когда их можно нарушить?
Если что-то конкретное работает так, как привыкли пользователи, не меняйте его. Человек ожидает ровно то, что он привык видеть. Например, частая ошибка начинающих дизайнеров — применение иконки галочки в качестве радиобаттона. Если у вас возникает мысль, что пользователь переучится, смело бросайте это решение и ищите другое.
Однако вы можете изобретать новые решения с нуля, не основываясь на каком-то привычном элементе или паттерне поведения. Главное, чтобы оно было понятно пользователю и считывалось без объяснений. Вы можете создать новый опыт взаимодействия, применяя механику работы вещей из привычного мира, но не путайте с скевоморфизмом. В качестве хорошего примера: установление будильника в iOS выполнено в виде интерактивных часов с четким и наглядным периодом сна человека. Контраст
На контрасте построено множество ходов в самых различных сферах. Например, в фильме ужасов перед самым страшным моментом сценарист дает нам понять, что главный герой в безопасности. Другой пример: персонаж нам кажется интересней, если по ночам угоняет машины, а днем переводит бабушку через дорогу.
Одно из важных для дизайнера качеств — умение работать с контрастом. Он необходим во всем. В подаче — большие объемы информации нужно разбавлять инфографикой или изображениями. В размере элементов и в свободном пространстве — для создания интересной композиции с правильными акцентами. В логике — у вас должен быть четко построен основной сценарий пользователя с большими кнопками, а дополнительные пути уже проходят через второстепенные ссылки.
Чем лучше вы чувствуете контраст, тем больше у вас шансов заинтересовать пользователя.
Ещё новости по теме:
18:20