Английские термины UX/UI-дизайна — значение и примеры

То, насколько легко люди достигают целей и что чувствуют при использовании продукта, услуги или сайта — от первого посещения до последующей поддержки.

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

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

Человек или группа, на которых влияет проект или которые могут повлиять на его цели и решения.

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

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

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

Редкая или необычная ситуация, которую система всё равно должна обрабатывать корректно.

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

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

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

Модель проектирования из четырёх этапов — Discover, Define, Develop и Deliver, — изображаемых как два цикла расширения и сужения. Сначала исследуют и определяют проблему, затем разрабатывают и уточняют решение.

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

Индивидуальная беседа с нынешним или потенциальным пользователем, обычно на 30–60 минут, чтобы узнать его цели, привычки, проблемы и мнения.

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

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

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

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

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

Находить и приглашать подходящих людей для исследования или тестирования.

Метод объединения заметок и наблюдений в группы по смысловому сходству для выявления тем.

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

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

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

Визуальное представление этапов пути пользователя, его действий, мыслей и эмоций при взаимодействии с услугой.

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

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

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

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

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

Схема страниц сайта и связей между ними, показывающая его информационную структуру.

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

Строка ссылок, обычно вверху страницы, показывающая её место в структуре сайта, например: Главная > Обувь > Бег.

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

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

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

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

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

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

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

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

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

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

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

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

Человек, принимающий участие в исследовании или тестировании продукта.

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

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

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

Часть дизайна, определяющая поведение продукта при использовании: что происходит при нажатии, вводе, свайпе или ожидании и как отвечает система.

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

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

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

Собственное представление человека о том, как что-то работает, основанное на прошлом опыте и формирующее его ожидания от продукта.

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

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

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

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

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

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

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

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

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

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

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

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

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

Текст интерфейса, объясняющий, что действие не удалось или введённые данные нужно исправить.

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

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

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

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

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

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

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

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

Расположение элементов и блоков на экране или странице.

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

Подход, при котором интерфейс автоматически перестраивается под размер и ориентацию экрана.

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

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

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

Расположение элементов по общей линии или относительно друг друга.

Расстояния между элементами и внутри них — например промежуток между карточками или внутренний отступ кнопки, — задающие ритм и группировку.

Ширина экрана, при которой адаптивный макет меняет расположение элементов.

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

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

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

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

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

Готовая коллекция элементов интерфейса — например кнопок, форм, значков и панелей навигации, — которые дизайнеры добавляют в макеты для быстрой сборки экранов.

Повторно используемое решение распространённой задачи проектирования интерфейса.

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

Разница яркости текста или значка и фона, определяющая, насколько легко их различить, особенно людям со слабым зрением.

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

Международный стандарт W3C с рекомендациями по обеспечению доступности сайтов и приложений; сокращение от Web Content Accessibility Guidelines.

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

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

Перемещение по элементам интерфейса и их использование с помощью клавиш без мыши.

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