{"id":9132,"title":"\u041f\u043e\u0447\u0435\u043c\u0443 \u043a\u0430\u043d\u0430\u0434\u0441\u043a\u0438\u0435 \u043b\u044e\u0431\u0438\u0442\u0435\u043b\u0438 \u043a\u0432\u0430\u0434\u0440\u043e\u0446\u0438\u043a\u043b\u043e\u0432 \u043f\u043e\u043a\u0443\u043f\u0430\u044e\u0442 \u0437\u0430\u043f\u0447\u0430\u0441\u0442\u0438 \u0432 \u0420\u043e\u0441\u0441\u0438\u0438","url":"\/redirect?component=advertising&id=9132&url=https:\/\/vc.ru\/pochta\/325041-kak-kanadskie-lyubiteli-snegohodov-i-kvadrociklov-otkryli-dlya-sebya-rossiyu&placeBit=1&hash=cd54543b13c8a6083dd50d5669dab69e3e15e40792f9ed69859d5c8934b50d3d","isPaidAndBannersEnabled":false}
Дизайн
Inostudio

Как работают принципы дизайна в digital

В первой статье мы рассмотрели принципы дизайна и то, из каких этапов состоит действие человека. В этой поделимся, как это применяется при работе с цифровыми решениями. Далее рассказ пойдёт от лица UI/UX-дизайнера INOSTUDIO — Данила Шклярского.

Есть такой термин — “User Experience Design”. Он означает пользовательский опыт, который дизайнер создаёт для того, кто будет использовать продукт. Автор книги «Дизайн привычных вещей» Д. Норман — основоположник концепции User Experience Design. Он подсказывает, как дизайнерам использовать все эти знания в своей работе.

Как это делать

Я беру схему из 7 этапов действия и адаптирую под систему.

Проблема пользователя. Цель меняю на проблему пользователя, которую мне, дизайнеру, необходимо правильно определить и решить.

Потребность к действию. Здесь пользователь уже собирается совершить какое-то действие. И мне нужно понимать, как он это будет делать. Исходя из этого, я строю пользовательский сценарий.

Уточнение действия. На этом этапе я должен понять, с каким элементами интерфейса (означающими) пользователь встречается.

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

Восприятие действия. Это то, как пользователь понимает, что действие произошло.

Интерпретация системы. Это то, как пользователь понимает, в каком состоянии находится система.

Сравнение. Этот этап подсказывает пользователю, решил ли он свою проблему.

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

Так вот после прочтения книги «Дизайн привычных вещей» меня осенило. Что если я соберу эти вопросы в разные группы и попробую их разбить на этапы? Вот как я это сделал.

Проблема пользователя

  • Определить проблему
  • Определить ЦА (целевую аудиторию)
  • Сопереживать пользователю

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

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

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

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

Начинается этап разрыва выполнения.

Потребность к действию

  • Построение пользовательского сценария
  • Учёт ожиданий пользователя
  • Описание информации или контента, который должен быть виден сразу

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

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

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

Уточнения действий

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

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

Исполнение действия

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

Дальше начинается этап разрыва оценки.

Восприятие действия

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

Кстати, об ошибках. Важно всегда подсказывать пользователю, что делать в момент ошибки. Это дополняет его концептуальную модель, как использовать систему.

Интерпретация системы

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

Сравнение

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

Это то же самое, что в оригинальной схеме, пользователь задаёт вопрос, а тот ли это результат, которого я хотел добиться? Интерфейс в этом случае должен подсказать человеку, что его проблема решена.

Взаимодействие пользователя с системой

Посмотрим на пример сценария взаимодействия пользователя с системой.

Проблема была в том, что человеку надо было найти определённый результат в системе. В центре расположен основной сценарий взаимодействия, где пользователь начинает работать с поиском, каждый блок — это его действие. Человек вводит данные, видит результаты поиска и получает желаемое.

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

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

Кое-что интересное

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

Первая методика — поиск первопричины

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

Снова представим ситуацию: я иду в магазин с зонтом, пошёл дождь. Появляется фактор из окружающего мира, это требует нашей оценки, чтобы поставить себе цель — открыть зонт. У меня есть продукт дизайна, который спрячет меня от дождя. С помощью него я решил свою цель. Но открывание зонта не было первостепенной целью. Если мы зададимся вопросом: зачем я вообще пошёл куда-то? Мы можем копнуть чуть глубже.

Я открыл зонт, чтобы не попасть под дождь. Попал под дождь, потому что шёл куда-то. Куда я шёл? Например, в магазин — это одна ключевая точка. Мы можем поразмышлять, как решить проблему человека, которому нужно в магазин.

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

Вторая методика — «не»

Допустим, человек проголодался, ему надо встать с дивана и пойти в магазин. И на каждом этапе думаем, а что можно не делать пользователю, чтобы достичь цели? Что можно сделать, чтобы не идти в магазин, но при этом поесть?

Или же, например, пользователю нужно отправить рабочий отчёт. Для этого нужно открыть специальное приложение и сформировать его. У меня эти шаги прописаны в сценарии пользователя, и для каждого думаю, а что я могу сделать, например, чтобы человек не заполнял отчёт?

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

Самое важное

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

0
2 комментария
Популярные
По порядку

Спасибо за статью!

1

Благодарим! Рады, что понравилась :)

0
Читать все 2 комментария
С такой красотой я живу один в деревне. Настоящая русская зима
SkillFactory раздает подарки: повышенная ставка и новогодний марафон для вебмастеров

В преддверии Нового года мы решили порадовать своих настоящих и будущих партнеров — участников партнерской программы школ Skillfactory, Contented и Product LIVE. Это возможность получить денежный бонус и заодно увеличить прибыль от продажи наших курсов.

Доказал, что миллиардеры не видят разницы между вином за $500 и $10 тысяч: история Руди Курниавана Статьи редакции

Курниаван продавал подделки под видом редких вин предпринимателям, генеральным директорам и голливудским продюсерам и обманул их более чем на $35 млн.

Руди Курниаван LA Times
Дайджест новостей Сбера: сайт Digital Пётр, сценарии для умного дома и платина от Forbes

Прошлый дайджест мы целиком посвятили 180-летию Сбера, поэтому новостей накопилось много. Среди них — запуск сайта по распознаванию рукописей Петра I, большое обновление на платформе умного дома Sber и другие. Рассказываем всё самое интересное.

Картинка, сгенерированная ruDALL-E по запросу «рыжий котик»
Доколе? Уже 3 года ссылки с VC.RU на Facebook никуда не ведут

Если привязать аккаунт Facebook к VC.RU, то в профиле появляется ссылка на эту соцсеть, но она никуда не ведёт. Разработчики VC.RU уже 3 года не могут поправить этот баг, зато выпустили корпоративную звонилку.

Откуда берут взрослые деревья для парков и улиц

А также сколько они стоят и почему выращивать их — неплохой бизнес.

«Смысл “Тура” — чтобы бренды на футболке получили больше времени на экране»: как устроена экономика гонки «Тур де Франс» Статьи редакции

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

«Тур де Франс» в 2021-м Bicycling
И сотрудников тоже касается: кибербуллинг на рабочем месте
Design vector created by pikisuperstar - www.freepik.com
Продавец eBay из Кургана стала победителем в финале Всероссийского конкурса «Молодой предприниматель России 2021»

27 ноября в Москве состоялся финал ежегодного конкурса «Молодой предприниматель России 2021». В нём приняли участие предприниматели и самозанятые в возрасте до 35 лет. Всего было подано более 300 заявок из 43 регионов страны.

Яндекс Еда по подписке завышает цену доставки

Доброе утро

Глава американской компании Better.com уволил 900 сотрудников одним видеозвонком Статьи редакции

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

Я пришёл к вам с плохой новостью. Рынок изменился, как вы знаете, и мы должны двигаться за ним вперёд, чтобы выжить, процветать и исполнять нашу миссию. [...] Я делаю это второй раз в своей карьере и не хочу повторять. В последний раз, я плакал, но на этот раз надеюсь быть сильнее. [...] Если вы сейчас смотрите это, значит вы в той невезучей группе, которую увольняют.

Вишал Гарг
null