UX-проектирование: поведение, психология, инстинкты

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

Ссылки на проект вы можете найти тут 👇

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

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

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

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

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

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

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

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

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

А тот известный опыт с собакой Павлова, когда знаменитый ученый ассоциировал потребление пищи собакой вместе со звоном колокольчика. В итоге потом достаточно было зазвонить в этот колокольчик и собака судорожно искала где бы ей подкрепиться. Как вам такой UX паттерн?

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

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

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

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

На этот счет советую очень крутую книгу Роберт Чалдини – Психология Влияния, в которой очень много такого рода примеров, объясняющих наше поведение в тех или иных ситуациях.

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

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

Людям необходимо было проектировать станки, на которых естественно работали другие люди. А как? Я думаю мало кто об этом задумывался , но именно тогда и начал вырабатываться первый осознанный UX опыт взаимодействия с с чем-то похожим на совершенный интерфейс.

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

Кажется, что одним из перых людей, который задумался о пользовательском опыте структурированно и начал проводить целенаправленные исследования был Дональд Норман — основатель одной из ведущих компаний в области дизайна Nielsen Norman Group, бывший вице-президент Apple, профессор информатики Северо-Западного университета. Советую прочитать его книгу «Дизайн привычных вещей».

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

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

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

В 1956 году американский психолог Джордж Миллер выяснил, что человеческий мозг в среднем запоминает 7 (+−2) объектов. Поэтому у групп в интерфейсе должно быть максимум 9 элементов. Самое главное помнить, что трудно сразу вспомнить слишком много вещей.

В интерфейсах это правило можно увидеть при расположении количества слов в одной строке - комфортное восприятие, чтобы снизить когнитивную нагрузку – это как раз 7+/-2 слова на строку.

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

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

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

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

В 1954 году психолог Пол Фиттс, исследуя двигательную систему человека, показал, что время, которое необходимо для перемещения к цели, зависит от расстояния до нее, и вместе с тем обратно пропорционально ее размеру. Согласно его закону, быстрые движения и маленькие кнопки приводят к большему количеству ошибок из-за сложности прицеливания.

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

Вспоминается исследование, когда известный Американский бренд, производящий кетчупы сделал опрос для своих клиентов:

– Хотели бы вы, чтобы мы расширили линейку своих соусов, добавив новые, необычные вкусы?

– Да, конечно, это было бы здорово

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

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

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

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

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

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

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

Тут же вспомнил очень перекликающуюся с этим эффектом историю из книги Роберт Чалдини «Психология влияния», в которой говорится, что красивые люди чаще получают помощь; в споре им без особых усилий удается склонить оппонентов на свою сторону. Красивых чаще считают обладающими более желательными чертами характера и умными. Взрослые придают меньшее значение агрессивным действиям, если они совершаются красивыми детьми, а учителя считают, что привлекательные ученики умнее. И это не пустые слова , а факты, доказанные экспериментами.

По закону Паркинсона, сколько бы времени ни дали на задачу, столько ее и будут выполнять. Замечали за собой такое? Сила магического дедлайна, который мы все так не любим. Ведь дай вам на выполнение 2 часовой задачи целую неделю, вы и будете уделять на нее по 5 минуты в день, вместо того, чтобы сделать все за один раз и сразу сдать.

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

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

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

Люди запоминают незавершенные или прерванные задачи лучше, чем выполненные. Блюма Вульфовна Зейгарник (1900 — 1988) была советским психологом и психиатром. В 1920-х годах она провела исследование памяти, в котором сравнивала запоминание завершенных и незавершенных задач. Она обнаружила, что незавершенные задачи легче запомнить, чем выполненные. Сейчас это известно как эффект Зейгарник.

Как это выглядит в обычной жизни?

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

Этот эффект важен для UX-интерфейсов. Поэтому в дизайне необходимо делать напоминания для незаконченных задач и индикаторы выполнения сложных процессов.

Третий и четвертый (бонусный) модули на курсе были посвящены законам проектирования, собственно поэтому я и завел сегодня такую тему

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

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

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

Результат моих трудов вы можете увидеть в Figma, страница, открыта для всех, так можете пользоваться при необходимости. Там я уже начал собирать компоненты, чтобы не переделывать макеты по нескольку раз.

===========================================

Спасибо за внимание 👏🏼. Ну а я перехожу к модулю 5 в котором речь пойдет уже про основы юзабилити и непосредственно про сами элементы интерфейса.

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

Ссылки на проект вы можете найти тут 👇