Открытый UX
1.3K subscribers
100 photos
4 videos
5 files
143 links
UX-дизайн, интерфейсы и исследования.

Чат канала: @open_ux_chat
Download Telegram
Открытый UX
Закон Миллера (волшебное число семь плюс-минус два) #UX_законы Этот закон помогает определить оптимальное количество объектов в интерфейсе для упрощения и ускорения взаимодействия человека с ним. В 1956 году Джордж Миллер выяснил, что в среднем, человек может…
История возникновения закона Миллера
#Исследование

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

Он описал серию экспериментов, в ходе которых людям нужно было различать звуковые сигналы с разной частотой. Психолог выявил, что если количество сигналов 2 или 3, то у испытуемых не возникает сложностей в их определении. Начиная с 4-го сигнала появляются незначительные проблемы. А на 5-м и более звуках испытуемые ошибаются все чаще. Помимо экспериментов со звуком также проводились эксперименты со вкусом, с визуальным восприятием и др.

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

Миллер обобщил показатели всех экспериментов и получил то самое число 7 и погрешность ±2.

Открытый UX
Исследование_Нетологии_и_AGIMA_Каким_должен_быть_современный_дизайнер.pdf
26.1 MB
Каким должен быть современный дизайнер
#Исследование от Agima, HeadHunter, Нетологии и HAYS.

В 2021 году Нетология и Agima провели исследование российского рынка труда дизайнеров. В опросе приняли участие работодатели, компании-заказчики, начинающие и опытные дизайнеры, выпускники онлайн-курсов.

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

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

Подробное исследование в приложенном файле.

Открытый UX
This media is not supported in your browser
VIEW IN TELEGRAM
Порог Доэрти
#UX_законы

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

Что запомнить:
▸ Нужно обеспечивать обратную связь с системой в течение 0,4 секунды, чтобы удерживать внимание человека и повышать производительность (чтобы не казалось, что система тормозит).
▸ Чем быстрее отклик системы, тем быстрее ей отвечает пользователь. Например, при ответе системы в 0,3 сек. человек реагирует за 9 сек. Когда система тормозит и отвечает за 3 сек. человек думает 16 сек.

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

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

Открытый UX
Media is too big
VIEW IN TELEGRAM
#Мем выходного дня
Признавайтесь, тоже иногда ленитесь и не тестируете свой дизайн? 😏

Открытый UX
Ментальные модели в UX

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

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

«В основе ментальной модели лежат убеждения, а не факты. Это значит, что нужно принять то, что пользователи уже знают (или думают что знают) о том, как работает ваш продукт. И взять это в работу.»
Nielsen Norman Group

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

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

Открытый UX
Закон общего пространства
#UX_законы

Элементы внутри общей границы воспринимаются как группа.

Что запомнить
:
Cоздание общего пространства вокруг элемента или группы элементов — лёгкий способ отделить их от остальных элементов. Самое распространенное использование принципа группировки в дизайне — обвести нужные элементы рамкой, отделив их от остальных.

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

Открытый UX
История возникновения закона Фиттса
#Исследование

Американский психолог Пол Фиттс работавший в университете штата Огайо, в 1954 году провел эксперимент, описывающий движение человека при достижении цели в двумерном пространстве.

Суть эксперимента:
На доске размещены две чувствительных полоски — мишени (черные полоски). При касании специальным пером (аналог современного стилуса) одной из этих полосок фиксируется «попадание в цель».

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

Отслеживая время касаний, Фиттс вывел зависимость: чем больше расстояние от одной цели до другой цели и чем меньше размер самой цели, тем больше времени требуется для её достижения. И соответственно наоборот, чем меньше расстояние от одной цели до другой цели и чем больше размер цели, тем меньше времени требуется для её достижения.

Открытый UX
results_2021.pdf
4.2 MB
#Исследование отношения населения России к различным платежным средствам

Несколько интересных выводов:
▸ 6% людей снимают деньги в банкомате, потому что им нравится отсчитывать банкноты и держать их в руках.
▸ У 18% респондентов до сих пор нет банковской карты, а у 45% их две и больше.
▸ 33% людей всё ещё предпочитают платить наличными.
▸ 975 рублей — средняя сумма покупки за наличные.

Еще больше интересной статистики в подробном исследовании в источнике или приложенном файле.

Открытый UX
#Мем вдогонку к предыдущему посту про закон Фиттса

Открытый UX
Снижение когнитивной нагрузки на пользователей

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

Существует 2 типа когнитивной нагрузки:
▸ Внутренняя когнитивная нагрузка относится к сложности конкретной тематики. Зависит от знаний пользователя в этой области (чем больше он в теме, тем когнитивная нагрузка ниже). Ее невозможно исключить.
▸ Внешняя когнитивная нагрузка относится к нагрузке, создаваемой способом представления информации. Внешняя когнитивная нагрузка может быть снижена за счёт качественно проработанного юзабилити.

Минимизация когнитивной нагрузки:
1. Представление контента таким образом, чтобы он легко воспринимался.
2. Снижение нагрузки на память за счет улучшения распознавания.
3. Принцип резервирования.
4. Устранение ненужных задач.

Открытый UX
Представление контента таким образом, чтобы он легко воспринимался.
Способ минимизации когнитивной нагрузки №1

Люди не читают слово в слово, они просматривают текст в поисках ключевых слов, которые укажут им на то, что они ищут. Написание текстов для интерфейса лучше начинать с вопроса: а что хочет узнать пользователь? Т.е писать четко, информативно и по существу.

Хороший контент легко читается и воспринимается. В нем используются:
▸ короткие предложения;
▸ разделы с подзаголовками;
▸ простая лексика.

Методы дизайна для организации контента таким образом, чтобы его было легко сканировать:
▸ Последовательность — упорядочивание контента для того, чтобы пользователям было легче понять его суть. Существует несколько методов упорядочивания — контент можно распределить от простого к сложному, от односложного к комплексному, от общего к частному.
Разделение на фрагменты — способ распределения данных на значимые и небольшие блоки. В среднем, человек может удержать в памяти 7 (± 2) элемента за раз (закон Миллера). Когнитивная нагрузка увеличивается, когда вводится больше контента.

Как правило, методы фрагментации включают в себя:
▸ Использование коротких абзацев;
▸ Применение коротких строк в тексте;
▸ Группировка элементов, которые имеют общие признаки.

Открытый UX
Снижение нагрузки на память за счет улучшения распознавания
Способ минимизации когнитивной нагрузки №2

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

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

Открытый UX
Принцип резервирования
Способ минимизации когнитивной нагрузки №3

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

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

Открытый UX
Устранение ненужных задач
Способ минимизации когнитивной нагрузки №4

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

Открытый UX
Традиционный #мем выходного дня будет немного не про UX

Открытый UX
У канала появился стикерпак

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

Приятного использования 🙃
This media is not supported in your browser
VIEW IN TELEGRAM
#мем снова о наболевшем

Открытый UX
Принцип наглядности
#UX_законы

Чем меньше пользователю необходимо думать о способах достижения цели, тем вероятнее цель будет достигнута.

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

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

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

Открытый UX
Открытый UX
Примеры дизайн-систем банков и IT-продуктов Финтех Nova. СберБанк Онлайн Цифровые продукты Альфа-Банка Taiga UI - Тинькофф-Банк Бренд-система Райффайзен Банка D2Design - библиотека для построения банковских приложений Сервисы Paradigm — продукты Mail.ru…
Как-то уже делал подборку интересных дизайн-систем, за это время коллекция немного пополнилась:
Atlassian
Polaris от Shopify
Carbon — система проектирования IBM
Mailchimp
Audi
Airbnb
Lightning

И дабы не забывать классику:
Material Design от Google
Human Interface Guidelines от Apple
Fluent Design System от Microsoft
Ant Design

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

Открытый UX