Словарь-справочник проектировщика пользовательского интерфейса
Зубодробительные детали для дизайнеров,
Предварительное издание. 225 терминов
- Полнота справочника
- Справочник составляется. Напишите нам, если какого-то термина недостаёт:
ilyabirman@ilyabirman.ru
А
- А/б-тест
- Эксперимент на аудитории, после которого выбирают вариант дизайна с более подходящими измеримыми показателями.
- Автодополнение
- Поведение поля ввода, когда по мере ввода предлагается наиболее вероятное продолжение или полное значение (в самом поле, в т.ч. через выделение; во всплывающем списке).
- Автозаполнение
- Поведение формы, когда все или часть полей заполняются значениями автоматически на основе уже известных данных или пресетов.
- Авторизация
- Установление программой того, есть ли у текущего польз-ля право доступа к запрашиваемой функциональности (ср. Аутентификация).
- Автосохранение
- Поведение программы, когда данные польз-ля сохраняются периодически или при каждом изменении, а не по команде; см. Сохранение данных.
- Адаптивный дизайн
- Подход к дизайну и-фейса, при котором компоновка эл-тов, подчиняясь некоторым правилам, сама подстраивается под размер окна и тип ввода (мышь или тач; в отличие от дизайна с раздельными версиями для разных устройств).
- Адрес ресурса
- Уникальный идентификатор веб-страницы, документа, файла, экрана или состония и-фейса, напр. https://
example.com/ filename.jpg. Хоть это и техническая строка, но польз-ли часто видят её в и-фейсе (в адресной строке; отправляя в чате и т. д.), поэтому желательно уделить внимание её структуре. Во многих и-фейсах адреса автоматически распознаются и превращаются в ссылки. - Адресная строка
- Поле для ввода адреса ресурса. При завершении ввода нажатием клавиши Enter ⏎, происходит переход по адресу, то есть загрузка ресурса. Поле одновременно является и индикатором адреса текущего загруженного ресурса: при переходе на другой ресурс, значение поля автоматически обновляется. Из-за этого возможна потеря данных: пока польз-ль вводит один адрес, программа заканчивает загрузку ресурса по другому и переписывает пользовательские данные.
- Айфон
- Телефон, выпущенный компанией Эпл в 2007 году, с важными и-фейсными инновациями: тактильное управление, прямое взаимодействие с физичной обратной связью, инерционная прокрутка, экранная клавиатура с динамическими областями нажатия, физическая кнопка «домой» и др.
- Аква
-
Графический стиль и-фейса Макоса 10 (Mac OS X), представленный Эплом в 2000 году. Характеризовался обилием бликов, как на каплях воды, и голубым акцентным цветом:
Стив Джобс, представляя и-фейс: «Одной из целей дизайна было, чтобы хотелось лизнуть, когда увидишь».
- Активное состояние
- Термин может означать разные состояния и-фейса
- Анду
- I. Команда, отменяющая предыдущее действие в и-фейсе. II. Принцип проектирования, когда у польз-ля есть право на ошибку и возможность её легко исправить. См. Привычка. Ср. Обратимость.
- Аффорданс
- То, как внешний вид и форма органа управления или эл-та и-фейса помогают понять, что с ним можно делать. Например: выпуклая кнопка приглашает себя нажать; круглая ручка — повернуть; ползунок — потянуть и т. д.
- Антипаттерн
- Регулярно встречающееся, но бесполезное или вредное и-фейсное решение, например: спросить подтверждение перед опасным действием. Такие решения повторяют, так как на поверхности они кажутся разумными. См. также тёмный паттерн.
А
Б
- Балун
- Рамка или плашка с сообщением и небольшим хвостиком («пипкой»), указывающим на источник сообщения
- Барабан ★
-
Эл-т выбора одного из нескольких взаимоисключающих значений. Изображается как цилиндр, на боку которого нанесены значения:
- Бегунок
- См. Слайдер.
- Бирка
- Подпись к эл-ту, характеризующая его тип, рубрику или статус. Часто даётся уменьшенным шрифтом на цветной плашке.
- Близость ★
- Закон восприятия, согласно которому объекты, расположенные рядом, кажутся связанными и по смыслу.
- Боковая панель
- Второстепенная область и-фейса сбоку. При чтении слева направо в левой панели размещают навигацию, а в правой — эл-ты работы с документом (команды, свойства, история изменений и даже другой документ для справки). Фильтры размещают как слева, так и справа. Часто боковую панель можно скрыть или сделать, чтобы она появлялась при приближении курсора мыши к краю окна (см. Прицеливание).
- Бутерброд
- Cпособ вёрстки веб-страницы, когда модули, называемые также «этажами», располагаются слоями друг под другом (см. совет Артёма Горбунова). Когда модули достаточно независимы, бутербродная вёрстка позволяет добавлять и удалять их без пересмотра страницы в целом.
Б
В
- Валидация
-
Обеспечение корректного заполнения формы. При валидации либо делают некорректный ввод невозможным, либо выводят сообщения об ошибке и требуют исправления от польз-ля:
См. Поле ввода. - Вкладки
- Эл-т и-фейса для навигации, когда польз-ль переключается между разными экранами внутри общей прямоугольной области (в отличие от переключателя, используемого для выбора).
- Вибрация
-
Оптический эффект, вызываемый регулярной контрастной графикой, напр. ряд одинаковых кнопок или полей в жирных рамках:
См. Информационный мусор.
- Виджет
- Небольшая самостоятельная область и-фейса с данными, индикаторами или быстрыми командами, обычно сделанная по шаблону и заменяемая другими подобными в том же контексте.
- Висивиг
- WYSIWYG (What You See Is What You Get; «что видишь, то и получишь»). Подход к проектированию редакторов, при котором документ во время редактирования выглядит так же, как и во время итогового просмотра. Противопоставляется подходу, когда польз-ль при редактировании лишь логически размечает содержимое, но не видит результата, а при просмотре результата не может его редактировать. Висивиг радикально сокращает цикл обратной связи, но и ограничивает точный контроль над результатом возможностями редактора.
- Воспринимаемая производительность ★
- Насколько быстрым ощущается и-фейс, независимо от его реальной скорости. Повышается за счёт качественной обратной связи, опоры на привычки и повышения информативности.
- Всплывающая подсказка
- Плашка с текстовым пояснением эл-та и-фейса, которая появляется, когда польз-ль ненадолго задерживает указатель мыши над эл-том:
Если в окне есть строка состояния, текст подсказки также отображается в ней.
- Вход
- См. Аутентификация.
- Вход с паролем
- Паттерн при аутентификации, где польз-ль представляется системе (именем, псевдонимом, адресом эл. почты, номером телефона) и подтверждает личность паролем. Польз-ль получает или придумывает пароль при регистрации. Возникает конфликт удобства и безопасности: простой пароль легко подобрать врагу, требование сложного пароля затрудняет запоминание и ввод. Браузеры автоматизируют хранение и ввод паролей при правильной разметке формы входа (см. также Поле пароля). Вход с паролем заменяют или дополняют входом через другой акаунт, одноразовый код, почту, биометрию.
- Выключатель
-
I. Физический эл-т управления, предназначенный для включения и выключения эл. тока или переключения соединения с одной цепи на другую.
II. Эл-т графического интерфейса, предназначенный для включения или выключения определённого поведения. Изображают как рычажок, перемещаемый из одного положения в другое. Во включённом положении дополнительно изменяют цвет на акцентный:
- Выпадающий список, выпадайка ★
-
Эл-т и-фейса, предназначенный для выбора одного из нескольких взаимоисключающих вариантов. Выглядит как поле, в котором указано выбранное значение и добавлена стрелка — индикатор возможности выбора:
В
Г
- Галочка ✓
- В и-фейсе галочка может означать а) включённый чекбокс (иногда его сам называют «галочкой» или его включение называют «поставить галочку»); б) выбранный пункт списка или меню; в) статус вроде «завершено», «утверждено», «проверено» или, реже, соответствующую команду. Чтобы вложенный смысл считывался, должно быть достаточно контекста.
- Геймификация
- Добавление в продукт игровых механик для развлечения, удержания или побуждения польз-лей к определённому поведению. Геймификация использует естественную для человека тягу к развитию, достижениям, коллекционированию, соревнованию, сотрудничеству, любопытству и помогает эффективнее учиться или выполнять монотонную работу. Часто её используют в интересах продукта, а не польз-ля, вынуждая его задерживаться, возвращаться, покупать; см. тёмный паттерн). Приёмы: очки, статистика, прогресс, серии, достижения, награды, задания, рейтинги, сравнение с другими.
- Геометка
- Обозначение некоторой точки на карте (выбранной, сохранённой, текущей и пр.). Часто используют форму чупа-чупса (шарик на палочке) или перевёрнутой капли, располагая основную массу обозначения выше самой точки и тем оставляя её на виду. При обозначении движущегося объекта используют микроанимации, намекая, что данные обновляются.
- Графический и-фейс
- Вид польз-льского и-фейса, где человек взаимодействует с устройством через нарисованные на экране кнопки, меню, пиктограммы и другие визуальные эл-ты. Ср. Командная строка.
- Группа эл-тов
- Несколько эл-тов и-фейса, образующих смысловое единство. Примеры: кнопки родственных команд (Ответить, Ответить всем, Переслать); родственные поля ввода (Фамилия, Имя, Отчество; Серия, Номер); связанные слайдеры (сумма и срок вклада; частоты в эквалайзере). Для группировки эл-тов их ставят ближе друг к другу и дальше от остальных (см. Близость); выравнивают по общей линии. Другие приёмы: общая рамка или плашка, отделение линейками от других, раскрывающаяся область (но см. Информационный мусор).
Г
Д
- Дата-матрикс
-
Оптический код, узнаваемый по сплошным линиями слева и снизу:
- Дашборд
- Область и-фейса с ключевыми показателями большой системы для быстрой оценки. Дашборды собирают из виджетов с графиками, числами, ключевыми индикаторами, таблицами и пр.; как правило, размещают на главном экране, избегая прокрутки. Часто польз-ль может настроить состав и порядок виджетов. Клик по виджетам ведёт на более детальные разделы.
- Дерево
-
Эл-т навигации, представляющий иерархическую структуру (сайта, документа, файловой системы). Одноуровневые объекты выравнивают по вертикали, дочерние — группируют под родительскими со сдвигом вправо. Иногда связи дополнительно изображают линиями (но см. Информационный мусор). Части дерева могут быть скрыты для экономии места и снижения сложности; тогда обычно шеврон вправо обозначает скрытость дочерних эл-тов, по клику они раскрываются, а шеврон поворачивается вниз; аналогично обратно.
Добавление эл-тов управления к объектам в дереве само приводит к их сдвигу, что может затруднять понимание их отношений, так что дизайн требует проверки на разных данных. К раскидистым деревьям часто добавляют кнопку «свернуть всё».
- Диалог
- Модель и-фейса, в которой происходит метафорический диалог машины и польз-ля: машина обращается (что-то сообщает; просит подтвердить, ввести, выбрать); польз-ль отвечает. Диалог обычно сам появляется в ответ на действие польз-ля (переходит в раздел, машина спрашивает пароль). Если диалог инициирует машина, это лишает польз-ля чувства контроля.
- Дизайн-система
- Набор компонентов для сборки экранов и-фейса или страниц веб-сайтов. С усложнением продуктов растёт число необходимых единиц дизайна; становится слишком сложно вручную проверять каждый (в случае автоматической генерации на основе данных, напр. ленты соцсетей или карточки товаров — невозможно). В отличие от юайкита, под дизайн-системой обычно понимают не просто макеты, а реализованные в коде и оттестированные компоненты. Дизайн-системы ускоряют реализацию новых функций с минимальным ущербом для качества, но и ограничивают свободу в развитии продукта.
- Джог
- Свободно вращающийся диск для точного управления движением. Характер углового движения джога (направление, скорость, ускорение, и т. д.) либо буквально воспроизоводится поступательным движением объекта управления, либо со сдвигом на ступень (т. е. скорость джога управляет ускорением объекта управления). Собственная инерция джога (бывает настраиваемой) обеспечивает плавность движений. Их используют в диджейских проигрывателях и видеомонтажных консолях, где они особенно удобны для точного указания момента или тонкого управления скоростью длинного материала.
- Джойстик
- Орган управления в виде палки, которую держат кистью и наклоняют в разные стороны, чем задают направление и величину изменения управляемого параметра: скорости и направления движения или поворота манипулятора, машины, камеры. Как правило, при отпускании возвращается в вертикальное (нейтральное) положение. Джойстик управляет именно характером движения, поэтому плохо подходит для точного указания на объекты. См. также Руль.
- Дом
- Метафора в графическом и-фейсе, означающая отправную точку навигации, первый экран или страницу, откуда постепенно можно попасть на все остальные. Постоянно доступная команда «домой» помогает не заблудиться в и-фейсе.
- Доступность
- Качество и-фейса, определяющее, насколько возможно им пользоваться в ограничениях: от временных обстоятельств (яркое солнце, шумное помещение, занятые руки) до тяжёлой инвалидности. Базовая доступность естественно достигается при следовании принципу человечности, более высокая может требовать специальных знаний о конкретных ограничениях. Доступность иногда конфликтует с эстетикой: высокий контраст улучшает различимость эл-тов, но и-фейс кажется «сложнее»; работа же дизайнера в том, чтобы найти разрешение без компромиссов.
- Дропдаун
- I. Выпадающий список. II. Кнопка-меню.
Д
Е
- Естественное соответствие
- Взаимное расположение или форма органов управления, похожие на взаимное расположение или форму того, чем они управляют. Например: левый выключатель включает свет в комнате слева, а правый — справа.
Е
Ж
- Жест
- I. Действие или последовательность действий, которые человек не разделяет на составляющие, а выполняет как бы единым движением. Для опытного польз-ля ввод короткого слова с клавиатуры — один жест. Для начинающего отдельным жестом будет нажатие каждой клавиши. См. Модальность. II. Характерное движение, особенно в тактильном и-фейсе, интерпретируемое устройством определённым образом, например оттяг, смахивание, щипок и под.
Ж
З
- Замкнутость ★
- Полнота и непротиворечивость правил, определяющих состояния и-фейса и переходы между ними при всех допустимых сочетаниях данных, условий и событий.
- Закон Фиттса ★
-
При движении к объекту по прямой линии время прицеливания логарифмически растёт с увеличением расстояния до объекта и падает с увеличением размера объекта:
Закон объясняет, почему для успешного прицеливания объекты нужно делать достаточно большими, но не слишком большими — логарифмический характер показывает, что увеличение объекта вносит всё меньший вклад в ускорение прицеливания.
- Залипание
- Поведение, когда эл-т внутри прокручиваемой области перестаёт прокручиваться, как бы «упираясь» в её край, пока остальное продолжает двигаться. Так сохраняют доступ к важным эл-там при просмотре длинного содержимого (напр. фильтры остаются на виду по мере просмотра каталога одежды). Когда залипает слишком много эл-тов, реальная область для просмотра содержимого сокращается.
- Залипающий заголовок
- Заголовок секции списка, который при прокрутке залипает у верхнего края области списка, пока его не вытеснит заголовок следующей секции.
- Заставка
- Экран или окно, показываемые во время загрузки программы. Заставка даёт быструю обратную связь на команду запуска, увеличивая воспринимаемую производительность по сравнению с отсутствием такой реакции; но и привлекает внимание к тому, что программа тормозит. Чтобы снизить негативный эффект, заставкой пытаются развлечь польз-ля. Эффективнее организовать программу так, чтобы она мгновенно становилась видимой как если бы была загружена, даже если в реальности её функциональность ещё недоступна. Для этого используют скелеты экранов и отложенную загрузку.
- Заусенцы
- Графические артефакты, которые появляются, если скруглённый эл-т касается другого эл-та или края области, на которой он размещён.
- Зумворлд
- Модель и-фейса, где все объекты размещаются на единой плоскости. Пользователь перемещается по ней, приближается для просмотра деталей, отдаляется для общего обзора. Раскин предполагал, что такая навигация лучше, чем окна, меню и ссылки; что человеку проще помнить, где что находится в пространстве, а не в логической структуре. Подобие зумворлда реализовано в досках совместной работы, таких как Миро, Фигма, Фриформ; люди действительно располагают там объекты разными способами, включая совершенно хаотичные, но ориентируются в них и предпочитают классификации по формальным атрибутам. Такой «зумворлд» ограничен документом и не показывает всю информацию пользователя, что отражает ограничение пространственной модели: удобно делить разные кучки информации по разным зумворлдам, которые сами по себе организованы, напр., иерархически.
З
И
- Игровые механики
- См. Геймификация.
- Иерархия
- Навигационная модель, в которой данные и экраны организованы по уровням от корня к ветвям, у которых могут быть свои ветви и т. д. Напр. в каталоге разделы «Мебель», «Посуда», «Текстиль»; в разделе «Мебель» подразделы «Шкафы», «Столы», «Диваны». Дизайнер распределяет содержимое по уровням так, чтобы польз-ль видел в этом логику (см. Ментальная модель). К любому родительскому экрану вопрос: есть у него собственное содержимое или его роль только в группировке дочерних. В и-фейсе иерархию показывают явно деревом, хлебными крошками; неявно — кнопкой «Назад» и меню дочерних экранов. В меню веб-сайта главную страницу традиционно ставят в один ряд с дочерними. Иерархия сложна для восприятия, поэтому предусматривают эл-ты навигации, не требующую её понимания: поиск, фильтры, рекомендации и пр.; предусматривают надёжный способ надёжно вернуться к корню (домой, на главную).
- Иконка
- Часто используется как синоним пиктограммы, но в и-фейсе иконка больше, чем просто изображение. Иконки на рабочем столе можно перетаскивать, выделять, копировать, то есть это не просто картинки, а интерактивные объекты, причём их подписи мы считаем частью каждой из них. Иконку можно нажать как кнопку, напр. ▶︎ мы сразу воспринимаем как команду «начать воспроизведение».
- Индикатор
- Эл-т и-фейса, роль которого в том, чтобы отображать значение или состояние: уровень сигнала, права доступа, число сообщений и пр. Индикаторы повышают информативность и-фейса: польз-ль получает информацию не в ответ на явный запрос, а в любой момент просто бросив взгляд. Индикаторная функция может совмещаться с другой: индикатор языка ввода также открывает меню настройки клавиатуры.
- Индикатор домашнего экрана
- Горизонтальная полоска на краю экрана Айфона, подсказывающая, что если смахнуть из-за этого края, попадёшь на домашний экран. См. Дом.
- Индикатор загрузки
- Индикатор того, что система занята обработкой или загрузкой (напр. Спиннер); возможно, степени завершённости процесса (напр. Прогрессбар). Отображение статуса длительных процессов важно для обратной связи, но и привлекает внимание к самому факту ожидания, что снижает воспринимаемую производительность. Для разрешения этого конфликта используют скелеты экранов.
- Инспектор
- Окно со свойствами выделенного объекта. В и-фейсе с инспектором не нужно открывать отдельное окно свойств для каждого объекта, так как содержимое инспектора меняется при изменении выделения. Минус в том, что нельзя открыть свойства разных объектов в разных окнах для сравнения или копирования. При выделении нескольких объектов хороший инспектор показывает общие свойства объектов и даёт изменить их схожим образом. Чтобы избежать перекрывания окном содержимого документа, используют боковые панели.
- Информативность ★
- Доля смысловой части в общей длине сообщения. И-фейс предполагает обмен информацией, а пропускная способность любого канала ограничена. Поэтому высокая информативность — признак хорошего и-фейса.
- Информационный мусор
- Бессодержательная графика, такая как рамки, линейки, плашки, тени, не наделённые значением цвета, пиктограммы, фоновые изображения и пр. декорации. Такая графика часто взаимодействует с содержательной, конкурируя с ней за внимание польз-ля и вынуждаяя себя фильтровать. Это затрудняет восприятие и снижает информативность и-фейса. Контракстные мусорные эл-ты часто образуют регулярные структуры, напр. решётки в таблицах и на графиках, чем вызывают неприятный оптический эффект (вибрацию) и ещё сильнее перетягивают внимание на себя.
- Инфоскроллер
- Полоса прокрутки с представлением содержания в виде графических символов, придуманная Артёмом Горбуновым и Ромой Воронежским.
И
К
- Калькулятор
- Паттерн и-фейса расчёта по заданным польз-лем параметрам (вклада, расхода, сложной услуги и пр.). В плохих реализациях: • сначала требуют ввода всех параметров (что вызывает сопротивление); • потом по команде рассчитывают результат (что делает невозможным важный сценарий — понять, как параметры влияют друг на друга и на результат). В хороших: • заданы реалистичные значения по умолчанию; • есть мгновенная и непрерывная обратная связь, то есть результат меняется постоянно по мере изменения параметров (см. Слайдер).
- Карта сайта
- Страница со ссылками на все остальные страницы сайта. Изначально карта сайта была одним из способов навигации для посетителей, поэтому организация ссылок в ней отражала логическую структуру сайта. В современном вебе для навигации используют поиск и рекомендации. Карта помогает поисковым системам индексировать содержимое сайта, но сегодня она имеет вид технического файла sitemap.xml, не предназначенного для человека.
- Квазирежим
- Состояние и-фейса, в котором польз-ль его удерживает физически, например удерживая модификатор или педаль. См. Модальность.
- Клик ★
- Нажатие и следующее за ним отпускание кнопки мыши (или аналога) в той же позиции или над тем же эл-том.
- Кнопка ★
-
I. Эл-т управления, основное взаимодействие с которым — нажатие.
II. Эл-т графического и-фейса, обычно в виде прямоугольника с подписью или пиктограммой; метафора физической кнопки:
- Колесо прокрутки
- Колёсико на мыши для управления прокруткой. Традиционно вращение колёсика к себе приводит к прокрутке вниз (то есть движению содержимого вверх).
- Колорпикер
- Пикер для выбора цвета. Операционные системы предоставляют программам стандартный колорпикер, но графические редакторы часто используют собственный, более богатый и-фейс выбора цвета: с управлением палитрами, выбором цветовой модели, сохранением именованных цветов и пр.
- Командная строка
- I. Вид польз-льского и-фейса, где человек взаимодействует с устройством, печатая и отправляя текстовые команды и получая результаты в прокручиваемом экране. II. Поле ввода для текстовых команд.
- Комбобокс ★
-
Эл-т и-фейса, гибрид поля ввода и выпадающего списка. В комбобокс можно как ввести значение напрямую с клавиатуры, так и выбрать из предложенного перечня:
- Консистентность
- Последовательность и согласованность в выборе и-фейсных решений: выглядящие одинаково вещи и работают одинаково и значат одно и то же; разные — по-разному и значат разное. Напр.: • выбранный цвет ссылок используется только в ссылках; • стиль шрифта для заголовков только в заголовках; • отступы между эл-тами в группе одинаковые, а между группами другие, но тоже одинаковые между собой; • реакция на наведение, показывающая интерактивность эл-та, не возникает у неинтерктивных эл-тов; • языковая форма, выбранная для подписей эл-тов, используется для всех однородных эл-тов и т. д. Дизайнеры стремятся к консистентности в своём продукте, но так же в платформе, для которой проектируют, и с другими продуктами для эффективного использования привычек польз-лей.
- Конструктор,
Конфигуратор - И-фейс настройки предмета из составных частей и изменяемых параметров (напр. конструктор окон, кухни; конфигуратор автомобиля). Как и с калькулятором, предпочтительны реализации, когда результат виден постоянно по мере настройки. Реализации по типу мастера ограничивают свободу польз-ля, навязывая порядок шагов.
- Контекстное меню ★
- Меню для управления определённым объектом (файлом, изображением) или относящееся к определённой области и-фейса.
- Контро́л
- Эл-т управления, то есть эл-т и-фейса, предполагающий взаимодействие (ср. Индикатор)
- Конфликт жестов
- Нежелательная ситуация, когда один жест имеет несколько ожидаемых интерпретаций и-фейсе, и польз-ль не может предсказать актуальную. Примеры: • На географической карте жест прокрутки часто интерпретируется как изменение масштаба. Что произойдёт при выполнении жеста над картой, размещённой внутри обычной прокручиваемой страницы? • Жест смахивания вправо в часто интерпретируется как команда Назад. Что произойдёт при выполнении жеста на листаемой галереей фотографий? См. также Модальность.
- Корень
- Начало иерархии, самый старший объект в ней.
- Корзина
- I. Паттерн и-фейса интернет-магазина, куда польз-ль добавляет товары перед покупкой, метафора покупательской корзины. В реальных интернет-магазинах частый сценарий отличается от задуманного: люди добавляют товары в корзину без цели купить, чтобы не потерять. Человечность требует поддержки этого сценария, для чего в корзине дают отметить, какие именно товары нужны; остальные остаются в ней после заказа. В кассах самообслуживания список купленных товаров иногда тоже называют «корзиной», что разрушает метафору: в реальности товары попадают на кассу из покупательской корзины. В качестве иконки чаще изображают тележку. II. Место, куда попадают документы в ответ на команду «Удалить» вместо того, чтобы реально удаляться, что реализует принцип Анду. Это метафора корзины для мусора, из которой можно достать выброшенный по ошибке документ; её же изображают на иконке.
- Край экрана
- См. Прицеливание.
- Крутилка
- I. Спиннер (индикатор загрузки). II. Вращаемая ручка.
- Куаркод
-
Оптический код, узнаваемый по трём квадратам в углах:
- Курсор мыши
- Графическое обозначение положения мыши на экране. Вид курсора может меняться при наведении на объект или при зажатом модификаторе, тем подсказывая польз-лю доступное поведение («пальчик» для перехода по ссылке, стрелки для изменения размера объекта, лупа для изменения масштаба и пр.; см. Обратная связь)
- Курсор текста
- Графическое обозначение текущего места ввода с клавиатуры. Положение курсора меняется кликом мыши или стрелками на клавитуре; при вводе курсор перемещается вместе с текстом. Курсор мигает, когда стоит на месте, чтобы его можно было найти, и перестаёт мигать во время движения, для того же.
- Курсор меню
- Контрастный фон, которым выделяют выбранный пункт меню.
К
Л
- Ленивая загрузка
- См. Отложенная загрузка.
- Логин
- I. Технический псевдоним человека, которое ему приходится придумать и помнить для входа в программу; лучше использовать адрес эл. почты или номер телефоа. II. Аутентификация.
Л
М
- Маска ввода
- В поле ввода шаблон ввода типовых данных, таких как номер телефона, дата, номер платёжной карты:
- Мастер ★
- Модель и-фейса, при которой данные у польз-ля запрашиваются пошагово, а в конце выдаётся результат. Каждый отдельный шаг посвящён ответу на единственный вопрос или вводу данных, тесно связанных по смыслу.
- Ментальная модель
- Представление польз-ля о том, как устроен и-фейс и как с ним взаимодействовать. Дизайнер участвует в разработке концептуальной модели продукта, а затем проектирует и-фейс так, чтобы у польз-ля сформировалась такая же ментальная модель. Формирование ментальной модели зависит от опыта и привычек польз-ля. Когда модели совпадают, польз-ль чувствует управляемость, работает эффективнее.
- Меню ★
- Набор эл-тов навигации и управления, обычно организованных в виде однородного перечня, называемых пунктами меню.
- Меню веб-сайта ★
- Привычный способ навигации на сайтах, обычно в виде строки ссылок на разделы в верхней части части страницы.
- Меню Мака ★
- Важнейший эл-т и-фейса операционных систем компьютеров Макинтош или Мак. Меню расположено вдоль верхней границы экрана и меняется при переключении между приложениями.
- Меню «Пуск» ★
- Вместе с вызывающей его кнопкой «Пуск» — важнейший эл-т и-фейса операционных систем «Виндоус», появившийся в «Виндоусе 95».
- Метафора
- Перенос понятия из реального мира в и-фейс («документы» на «рабочем столе», в «папках» или «корзине»). Метафоры работают как источник терминов, но вопреки заблуждению не объясняют работу и-фейса: в реальные папки не вкладывают другие папки, а на реальном рабочем столе не клеят обои и не двигают окна.
- Модальность ★
- И-фейс называется модальным, если в нём есть режимы, то есть состояния, которые человек не осознаёт во время жеста, но в которых этот жест интерпретируется по-разному.
- Модальная ошибка
- Ошибка, совершённая человеком из-за того, что он не осознавал, в каком состоянии находился и-фейс, и получил не тот результат жеста, которого ожидал. См. Модальность.
- Модальное окно
- Окно, переводящее и-фейс в режим, где привычные клики и прокрутка не работают, т. к. перехватываются этим окном (см. Модальность). Для возвращения рабочий режим м. о. нужно закрыть. Различают м. о. уровня системы, когда блокируется всё взаимодействие с системой, и уровня приложения, когда блокируется лишь взаимодействие с приложением. Не всякое диалоговое окно модально.
- Модальное уведомление
- Уведомление, появляющееся в модальном окне, попапе, тосте или другой подобной области и-фейса.
- Модификатор
- Клавиша, которая при удержании временно изменяет действие другой клавиши или вообще жеста (Шифт ⇧, Контроль ⌃, Комманд ⌘, Опшен ⌥ или Альт, Вин, Фн и пр.), то есть включает квазирежим. Модификаторы расширяют набор доступных команд без добавляния жестов. За разными модификаторами закрепилась разная «тема», характер влияния, напр. Шифт делает буквы заглавными при вводе текста; увеличивает эффект основного действия; при изменении размера, Шифт сохраняет пропорции; при повороте, меняет угол с шагом 15°; Опшен открывает альтернативное, более тонкое действие; при изменение размера изменяет симметрично относительно центра. Несколько модификаторов могут использоваться одновременно: Шифт и Опшен при изменении размера сохраняют и пропорции, и симметричность. В сложных программах доступны целые аккорды из модификаторов, сам их набор может быть расширен (см. Рука), причём в некоторых случаях действие модификатора зависит от того, был ли он нажат до начала жеста или уже во время жеста.
М
Н
- Наведение
- Жест, когда пользователь прицеливается курсором мыши к эл-ту, но не кликает в него. При наведении эл-т может изменять внешний вид, показывая, что клик сработает (когда это так; см. наведёное состояние). Дизайнеру необходимо выбирать, где такая обратная связь полезна, а где — избыточна. Встречаются и-фейсы, где при наведении раскрываются скрытые эл-ты или данные. Это иногда упрощает и-фейс визуально, но затрудняют работу с ним, так как делает эл-ты невидимыми, а реакции и-фейса неожиданными. Также такое поведение затрудняет прицеливание, так как состав и положение эл-тов и-фейса меняется в его процессе.
- Навигация,
Навигационная модель - Процесс перемещения между страницами, экранами, состояниями и-фейса. Для навигации используют переключение между окнами, вкладками, разделами меню, листание, прокрутку, приближение и удаление (см. Зумворлд), погружение и подъём в иерархии, ссылки, теги, карту сайта, поиск и другие инструменты. Разделяют эл-ты и-фейса, используемые для навигации, и навигационную модель, т. е. сам принцип, лежащий в основе навигации. Модель эл. книги — последовательность страниц, но для навигации по ней наряду с листанием используют поиск, ссылки. Модель веба — множество страниц, связанных произвольными ссылками, но для навигации по нему используют всё, включая листание кнопками «Назад» и «Вперёд» в браузере.
- Навигатор
- I. Эл-т и-фейса для перемещения по содержимому и индикации того, какая его часть в данный момент отображается на экране целиком. II. Мн-во других значений в смежных областях: программа для прокладывания маршрута, файловый менеджер, браузер.
- Назад
- Команда «Назад» работает по-разному в зависимости от навигационной модели: в иерархии это переход на родительский экран; в вебе — на предыдущую страницу независимо от её отношений с текущей. В одном и-фейсе эти модели могут сосуществовать (браузер внутри иерарихического приложения на телефоне), из-за чего поведение команды становится непредсказуемым и приводит к ошибкам.
- Нападалка
- Маркетинговый попап, появляющийся по инициативе программы, а не в ответ на команду польз-ля. Поскольку измерить число польз-лей, которые приняли предложение, легко, а измерить раздражение из-за прерванной работы — сложно, нападалка всегда создаёт иллюзию измеримо хорошего решения.
- Непосредственное взаимодействие ★
- Иллюзия в графическом и-фейсе, когда поль-з перестаёт воспринимать экран как устройство ввода и отдачи команд и начинает ощущать, что буквально взаимодействует с объектами на экране: двигает их, изменяет размеры и т. д. Достигается благодаря качественной обратной связи.
Н
О
- Область прицеливания
- Область и-фейса, прицельные жесты по которой фиксируются как адресованные конкретному эл-ту. См. Прицеливание.
- Обратимость ★
- Свойство эл-та, при котором польз-ль может в любой момент вернуть его в начальное состояние, а в общем случае — свободно переключать между всеми доступными состояниями.
- Окно
- Самостоятельная область и-фейса, в которой программа показывает документ, инструмент, сообщение или другой самостоятельный фрагмент работы. Окна обычно можно перемещать по экрану, в том числе перекрывая другие окна; изменять размеры. У них есть собственные эл-ты управления: кнопки закрытия, сворачивания, разворачивания и др.
- Онбординг
- I. Специально спроектированный процесс вовлечения польз-ля в продукт. II. Блокирующие экраны, где польз-лю против его воли рассказывают о продукте.
- Опережающий ввод
- Поведение и-фейса, когда текущая операция не блокирует дальнейшие команды польз-ля. В зависимости от смысла, команды выполняются или сразу после завершения текущей операции, или останавливают или отменяют её. На Айфоне при нажатии на кнопку «Домой» идёт анимация сворачивания приложения в иконку, но в экран можно нажать в том месте, куда вот-вот прилетит иконка другого приложения, и это приложение откроется.
- Оптический код
- Изображение, где графически закодированы данные для считывания устройством без ручного ввода.
- Отзывчивость
- См. Воспринимаемая производительность.
- Отложенная загрузка
- Способ организации загрузки программы или сайта, когда части загружаются не все сразу при открытии, а уже после первичного появления и-фейса, что сокращает воспринимаемое время загрузки. При плохой реализации загрузку откладывают до последнего, что замедляет уже дальнейшую работу: вместо мгновенной реакции человеку приходится ждать (модуль загружается только когда человек пытается им воспользоваться; картинка загружается только при прокрутке до неё). В хороших реализациях части загружают фоново в порядке важности; стараются предугадать, какие эл-ты понадобятся. Отложенная загрузка также снижает нагрузку на сервер: часть ненужных ресурсов не загружаются вовсе.
- Ощущение скорости
- См. Воспринимаемая производительность.
О
П
- Палитра
-
I. Панель инструментов в виде отдельного окна, обычно в графических программах. Используется аналогия с палитрой в общепринятом смысле, но не только для подбора цветов, а и шрифтов, кистей, эффектов и пр.
II. Набор используемых в дизайне цветов.
- Панель инструментов
- Область, в которой организованы эл-ты и-фейса, обычно для управления документом. Может иметь вид тулбара, боковой панели, палитры, поповера. См. также инспектор.
- Параллакс
- Поведение прокрутки, при котором разные эл-ты двигаются с разной скоростью, создавая иллюзию разного отдаления от польз-ля, как при физическом параллаксе.
- Паттерн
- I. Типовое решение и-фейсной задачи (напр. Вход с паролем). Применение паттерна упрощает проектирование и ускоряет работу по привычке, но и означает отказ от поиска лучшего решения. Из-за привычки искажённое применение паттерна может вызвать у польз-ля бо́льшую фрустрацию, чем незнакомое решение. II. Узор, основанный на повторении эл-тов.
- Переключатель ★
-
Эл-т и-фейса, предназначенный для выбора одного из нескольких взаимоисключающих значений. Значения, иногда называемые кнопками или сегментами, объединены в общий горизонтальный контейнер; одно из значений выделено как выбранное:
- Пикер
- Диалог или попап для выбора структурированного значения, например имени файла, шрифта, цвета, даты и времени.
- Пиктограмма
- Условное графическое обозначение объекта, действия, статуса. Традиционно пиктограммы упрощённо изображают сам объект (самолётик, огнетушитель, батареечка), поэтому человек его может узнать. В и-фейсах многие обозначаемые сущности абстрактны и не имеют узнаваемых прообразов в физическом мире (вайфай, ссылка, избранное), поэтому узнать объект через пиктограмму невозможно; можно лишь узнать саму пиктограмму, если уже выучил её значение (см. Привычка). Для обучения используют всплывающие подсказки. Ср. Иконка.
- Пипка
- Хвостик у балуна или торчащий уголок у попапа, указывающий на их источник: кто это сказал, откуда это появилось. Использование пипки в обратную сторону, чтобы ею как стрелкой указать на объект — ошибка.
- Подтверждение
- Антипаттерн, когда при получении команды опасного действия машина переспрашивает и польз-ля, уверен ли он, исходя из ошибочного предположения, что увидев вопрос, польз-ль снова обдумает решение. Подтверждения формируют привычку соглашаться на всё, не читая, и не предотвращают ошибок, кроме чисто механических (об эффективной борьбе с ошибками см. Анду). Как и любая преграда, подтверждения вызывают раздражение и сопротивление.
- Поиск
- И-фейс навигации, где польз-ль вводит запрос в поле ввода («поисковую строку») и получает результат: перечень вероятных ответов или ссылок на них. В хороших реализациях поиск: • помогает дописать запрос с помощью автодополнения; • прощает опечатки; • принимает слова в разной форме; • понимает синонимы; • выдаёт результат по мере ввода, а не после его окончания; • показывает более релевантные результаты первыми. Поиск подходит, когда польз-ль представляет, что ищет, и может это сформулировать, поэтому редко подходит как основной инструмент, уступая место меню и рекомендациям. Если по запросу ничего не найдено, пользу пустых результатов повышают, предлагая альтернативы; при этом важно не создать у пользователя впечатление, что это и есть истинные результаты поиска.
- Поле пароля
-
Поле для ввода пароля при входе с паролем и его создании. Скрывает вводимый пароль, но отображает на месте символов звёздочки или буллиты, давая обратную связь при вводе:
При использовании экранной клавиатуры может также кратковременно показывать последний введённый символ. При входе поле сопровождают ссылкой «забыли пароль?», ведущей на страницу восстановления пароля. Невидимость вводимого пароля при создании создаёт проблему: польз-ль может опечататься и не заметить; потом не сможет ввести правильно. Решают размещением двух полей пароля подряд и требованием ввести одинаковый пароль. Встречаются также реализации с иконкой-глазиком, которая управляет видимостью пароля: польз-ль может увидеть, что пишет. - Полоса прокрутки
- Эл-т и-фейса для управления прокруткой.
- Постоянная ссылка
- Адрес, по которому материал неизменен и является главным содержимым, в отличие от других адресов, по которых он может быть доступен временно или в среди других.
- Попап
- Контейнер, который всплывает поверх основного экрана и содержит эл-ты и-фейса или информацию. Имеет все недостатки модального окна. Также согласно теореме Горбунова о попапах, «Попап — это самое тупое, что можно сделать»: содержимому не приходится искать собственное место в и-фейсе, оно просто размещается поверх. Чем больше попапов, тем больше и-фейс ощущается непродуманным, навигация затрудняется.
- Привычка ★
- Автоматизм, который формируется, когда польз-ль многократно повторяет действие. Роль привычки в использовании и-фейса огромна: по привычке действие вполняется быстро, без усилий и решений, но невнимательно (напр. люди соглашаются, не читая вопрос, что делает бесполезным подтверждения); без привычки медленно и внимательно. Принцип человечности требует не бороться с привычками, а помогать им формироваться и использовать их силу для повышения производительности и снижения числа ошибок (см. Паттерн). См. также Анду.
- Прицеливание ★
- Важнейшая часть взаимодействия человека с и-фейсом: прицеливание к физическим органам управления (клавишам, ручкам, педалям); в графическом и-фейсе — к объектам на экране (опосредованно мышью или непосредственно пальцем); в виртуальной реальности — глазами. Прицеливание начинает с понимания самой области, соответствующей органу или эл-ту управления, что в графических и-фейсах всё чаще составляет сложность. Скорость и точность прицеливания влияют на ощущение от и-фейса, эффективность работы, число ошибок, поэтому и-фейсы проектируют так, чтобы упростить прицеливание: делают эл-ты достаточно большими (см. Закон Фиттса), а их область прицеливания очевидной; избегают соседства взаимно-нежелательных эл-тов и т. д.
- Прогрессбар
- Индикатор загрузки, показывающий степень завершённости процесса (прогресс) с помощью закрашивающейся полосы. Может сочетаться с числовым значением прогресса (в процентах, байтах и пр.), оценкой оставшегося времени, когда она достаточно надёжна. Закрашивающийся круг или другую фигуру тоже иногда называют прогрессбаром.
- Прокрутка ★
- Поведение и-фейса, когда на экране постоянно виден фрагмент содержимого, а польз-ль плавно перемещается по нему при помощи специальных жестов и экранных эл-тов.
- Пуск
- См. Меню «Пуск».
- Пусть потеет машина
- Принцип проектирования, при котором любая работа, которую вместо человека может выполнять машина, должна выполнять машина; следует из человечности.
- Путь к объекту
- Строка, указывающая на положение объекта в иерархии через перечисление вышестоящих объектов, например: «Товары → Для кухни → Посуда → Кастрюля». Обычно записывается через стрелку (→) или слеш (/). См. также Хлебные крошки.
П
Р
- Радиогруппа, радиокнопки ★
- Группа радиокнопок; эл-т и-фейса, предназначенный для выбора одного из нескольких взаимоисключающих вариантов. Классический вид радиогруппы в операционных системах — перечень подписей с окружностями слева, а выбранная обозначена жирным кружком внутри:
- Разделение жестов
- Приём устранения модальности.
- Растягивание
- Жест, когда человек прикасается к экрану двумя пальцами и двигает их в противоположных направлениях, увеличивая или уменьшая изображение, благодаря тому, что под каждым пальцем остаются одни и те же точки изображения.
- Режим
- Состояние и-фейса, в котором жесты интерпретируются не так, как в другом режиме. См. Модальность.
- Руль ★
-
I. Общее название средств направления движения и удержания в равновесии транспортных средств.
II. Рулевое колесо, орган управления направлением движения машин. Оно зафиксировано в центре вращения и поворачивается в одинаковых пределах против и по часовой стрелке. Начальное положение соответствует прямому направлению колёс, а при отклонении от него колёса поворачиваются, и автомобиль движется по дуге:
- Рука
-
В и-фейсах, управляемых мышью, инструмент и способ перемещения по документу: польз-ль захватывает документ, удерживая кнопку мыши, и перемещает его внутри статичного окна. Противоположен классической прокрутке, где польз-ль перемещает как бы саму рамку, через которую смотрит на документ (на полосе прокрутки или вращая колесо мыши). Используется в графических редакторах, где традиционно включается зажатием пробела (см. Квазирежим; см. также Навигатор). В тач-интерфейсах рука не требуется: при прокрутке польз-ль всегда управляет движением документа (но это затрудняет разделение жестов перетаскивания и прокрутки). Под влиянием тач-интерфейсов возникло понятие «естественная прокрутка», когда про направление прокрутки стали понимать направление движения документа, как при использовании руки.
Р
С
- Синтаксис эл-тов и-фейса ★
- Правила сочетаемости эл-тов и-фейса друг с другом и с окружающим текстом. Начал формулировать Артём Горбунов, он же ввёл термин. В основе идея, что эл-ты в и-фейсе имеют те же роли, что слова в предложении, напр. заголовок формы — подлежащее, главная кнопка — сказуемое, а поля внутри — второстепенные члены.
- Скеоморфизм
- Графический стиль, в котором эл-ты на экране имитируют внешний вид, форму, материалы, поведение знакомых физических предметов:
Может как помочь польз-лю понять роль и поведение эл-та (см. Аффорданс), так и помешать, если поведение различается или вовсе непереносимо на экран (см. Метафора). При этом точный перенос физических аспектов на экран может помешать проявиться преимуществам экрана. Приёмы (блики, тени, текстуры) добавляют и визуального богатства, и мусора. Обычно противопоставляется флет-дизайну, но не противоречит ему: аналоговые часы с плоскими стрелками — скеоморфизм; цифровые часы с цифрами из жидкого стекла — нет. - Скелет,
Скелетон -
Схематичное изображение экрана и-фейса, которое показывают во время загрузки настоящего содержимого:
Скелет даёт информативную обратную связь, показывая расположение будущих блоков и помогая польз-лю познакомиться с интерфейсом, что повышает воспринимаемую производительность. Скелет рисуют так, чтобы минимизировать скачки при окончательной загрузке и избежать мусора. Если загружаемый экран представляет собой список эл-тов, то его скелетом окажется просто чередование одинаковых полос, то есть мусор. См. также Скелет как состояние компонента и экрана. - Скроллер
- Индикатор положения прокрутки в виде тонкой полосы, представляющей долю видимого содержимого в общей его длине. В отличие от полосы прокрутки, не предполагают взаимодействие (хотя и может его поддерживать на всякий случай).
- Слайдер
- Эл-т и-фейса для выбора значения из диапазона. Выглядит как бегунок, который перетаскивают по шкале (шахте). При реализации важно учесть требования к прицеливанию и обратной связи. Область прицеливания расширяют на весь слайдер и больше; нажатие в любую точку шкалы мгновенно выбирает соответствующее ей значение. При перетаскивании дают непрерывную обратную связь по мере движения мыши или пальца, даже если сам объект управления невозможно обновлять непрерывно.
- Смахивание
- Жест в тач-интерфейсе, когда польз-ль касается экрана, проводит пальцем в сторону и одновременно отводит палец, как бы смахивая что-то с его поверхности. Используется для листания, навигации, раскрытия спрятанного за эл-том списка набора кнопок. Выделяют смахивания, начинающиеся из-за края экрана. Этот же жест запускает прокрутку, но в этом случае его не называют смахиванием.
- Состояние и-фейса
- См. Модальность.
- Состояние эл-та ★
- Свойство эл-та, описывающее возможности взаимодействия с ним, характер или этап текущего взаимодействия, например: наведённое, нажатое, сфокусированное, отключённое, заполненное, заполненное с ошибкой, переполненное, посещённое и под.
- Сопротивление
- Нежелание взаимодействовать с и-фейсом из-за ожидаемой связанной ним фрустрации. Сопротивление невозможно увидеть по аналитике, т. к. оно проявляется ещё до взаимодействия: человек из опыта знает, что и-фейс ощущается как препятствие, поэтому откладывает дело или ищет способ сделать его без и-фейса. См. также «И-фейс — зло».
- Сохранение данных ★
- Свойство и-фейса, когда машина помнит все пользовательские данные, пока не получила команду их забыть или сбросить; следует из человечности. Под данным понимается всё, что явно или неявно ввёл польз-ль: открытые вкладки, положения окон и прокрутки, выделенный текст, настройки и пр. При сохранении чувствительных персональных данных, важно внимательно отнестись к приватности: польз-лю должно быть очевидно, что данные сохраняются, и должно быть легко от этого отказаться. См. также Чужой компьютер.
- Спиннер
-
I. Числовое поле ввода (с кнопками-стрелками для изменения значения мышью):
II. Небольшой крутящийся индикатор загрузки
. Подходит, когда степень завершённости процесса определить невозможно или когда он очень короткий и это не нужно. - Список ★
-
I. Эл-т и-фейса, используемый как для выбора значений, так и для составления самого их перечня. Список выглядит как многострочное поле, где каждая строка показывает одно значение, а выбранное подсвечивается фоном:
Поведение списка слабо стандартизировано, и по внешнему виду списка невозможно предсказать, как он себя поведёт, поэтому использовать его стоит с осторожностью.II. Способ вёрстки и-фейса, когда эл-ты следуют один под другим, а при недостатке высоты области автоматически включается прокрутка.
- Сценарий ★
- Цепочка событий в жизни польз-ля, в которой он обращается к и-фейсу, включающая его знания, ожидания, опасения, ограничения и цели. Анализ сценариев — ключевой инструмент понимания задачи, который предшествует проектированию. Сценарий не описыват и-фейс, в отличие от флоу.
- Ссылка
- Эл-т и-фейса для прямой навигации к странице, а также ключевой эл-т разметки гипертекста. Классический вид ссылки — синий подчёркнутый текст — выделяет её, показывая, что фрагмент связан с некоторым адресом. Сам адрес ссылки можно скопировать и сохранить или передать. Слово «ссылка» часто употребляют как синоним адреса («скинь ссылку»), ведь большинство интерфейсов автоматически превращают текст адреса в рабочую ссылку, ведущую по нему. Встречаются и-фейсы с подчёркнутым текстом, который истинной ссылкой не является: кликнуть можно, но адреса за ним нет. При вёрстке учитывают удобство нажатия, информативность, выделяющийся вид и форму (совет Горбунова).
- Статусбар
- Область и-фейса с группой индикаторов, показывающих уровень громкости, приёма, батареи; использование функций (камера, блутус, геолокация) и режимов (полёта, не беспокоить); дату и время, наличие будильника, погоду и пр. Для компактности используют пиктограммы, но всё же встаёт вопрос о том, как приоритезировать индикаторы, если все они в отведённое место не вмещаются или как показать польз-ю, что показан неполный набор. См. также Строка состояния.
- Строка состояния
- Строка в нижней части окна, используемая в классических приложениях для отображения названия текущей задачи, прогресса, соединении, но также различной статистики и пр. компактных данных. При наведении на эл-ты и-фейса содержимое заменяется текстом подсказки. Встречают «всплывающие» реализации, когда строка появляется только если программе есть что в ней показать.
С
Т
- Тач,
Тач-интерфейс - Графический и-фейс, где указание осуществляется прикосновениями и другими жестами в прямом контакте с экраном (в отличие от и-фейса с мышью).
- Теги
- Способ навигации по материалам: каждому назначается набор слов, называемых тегами и отражающих его тему и другие свойства (например, «кино», «мнение», «лонгрид»), и затем даётся возможность просматривать материалы, объединённым общим тегом.
- Текстария,
текстобласть,
текстовая область - Многострочное поле ввода.
- Тёмный паттерн
- И-фейсное решение, целенаправленно вводящее человека в заблуждение, подталкивающее к действию против его интересов (напр., платные услуги навязывают, включая автоматически, невнятно информируют об этом, затрудняют отключение). Термин закрепился в таком виде, хотя слово паттерн в нём лишнее; им обозначают любое подобное решение.
- Тормоза
- Медлительность и-фейса, мешающая свободному взаимодействию и тем самым вызывающая фрустрацию и раздражение. По теореме Бирмана, все тормоза являются ошибками и исправимы.
- Треугольник прицеливания
- Область внутри основного меню, при быстром движении курсора мыши по которой текущее подменю сохраняется раскрытым, несмотря на то, что под курсором уже оказываются другие пункты основного меню, так как это движение интерпретируется как направленное к пункту подменю. Треугольник помогает польз-лю прицелиться в подменю, двигаясь по прямой, не открыв случайно другое подменю.
Т
У
- Угол экрана
- См. Прицеливание.
- Указатель
- См. Курсор мыши.
У
Ф
- Флет-дизайн
- Графический стиль, основанный на отказе от приёмов передачи объёма: бликов, теней, текстур. Возник как противопоставление скеоморфизму (но см.). Плоские эл-ты труднее распознать, так привычные признаки многих из них как раз связаны с объёмом (кнопки выпуклые, поля ввода — вдавленные).
- Флоу
- Последовательность страниц или экранов, которые проходит польз-ль, выполняя некоторую задачу в и-фейсе. Флоу описывается в терминах самого и-фейса: что польз-ль видит, нажимает, заполняет в том или ином сценарии.
- Фоновая загрузка
- См. Отложенная загрузка.
Ф
Х
- Хлебные крошки
- Эл-т навигации, показывающий положение текущего экрана в иерархии, называющий и дающий переходить на родительские уровни. Крошки отражают именно уровни иерархии, а не историю переходов польз-ля. В отличие от полного пути к объекту, в них не показывают домашний экран, если на него и так ведёт логотип или аналогичный эл-т; текущий экран, ведь как переход на него не имеет смысла, а название есть в заголовке.
Х
Ч
- Человечность ★
- Свойство и-фейса, когда он проектируется для человека, а значит подстраивается под слабости, такие как невнимательность, небезупречную память, трудность устного счёта и пр.
- Чекбокс ★
- Эл-т и-фейса для выбора одного из двух состояний, условно называемых «включённым» и «выключеным». Классический вид чекбокса в операционных системах — квадратик с опциональной галочкой, означающей включённость
- Чужой компьютер
- Паттерн для обеспечения безопасности при аутентификации на сайтах. В и-фейсе аутентификации размещают чекбокс «Чужой компьютер», при включении которого вход выполняет только на время работы в текущей вкладке браузера; после её закрытия потребуется повторная аутентификация.
- Чупа-чупс
- См. Геометка.
Ч
Ш
- Шаттл
- То же, что джог, хотя в некоторых контекстах эти термины разделяют, чтобы подчеркнуть, чем именно каждый из них управляет (напр., джог — позицией, а шаттл — скоростью).
- Шум
- См. Информационный мусор
Ш
Щ
Щ
Ю
- Юай
- UI (User Interface; «пользовательский интерфейс»). Несмотря на буквальный смысл, на практике обычно означает графический дизайн экранов и эл-тов и-фейса без учёта их смысла, задач и сценариев, хотя именно последнее составляет основу проектирования и-фейса. Противопоставляется термину «Юикс».
- Юайкит
- Набор заготовленных эл-тов и-фейса платформы или продукта, организованных так, чтобы их было удобно переиспользовать в разных контекстах. Обычно содержит часто используемые эл-ты: кнопки, поля ввода, переключатели, пиктограммы и др. Юайкиты ускоряют проектирование, повышают консистентность, помогает делать реалистичные прототипы. См. также: Дизайн-система.
- Юикс
- UX (User eXperience; «пользовательский опыт»). Несмотря на буквальный смысл, на практике обычно: а) означает проектирование логики и-фейса без проработки внешнего вида (см. Флоу), хотя внешний вид и существенно влияет опыт пользователя (см., напр., Аффорданс); б) не включает продуктовый опыт польз-ля за пределами интерфейса. Противопоставляется термину «Юай».
Ю
Я
- Якорь
- Именованное место на странице, куда можно дать прямую («якорную») ссылку: адрес дополняется знаком # и именем якоря, напр. https://
example.com/ #anchor; браузер открывает страницу и сразу прокручивает её к якорю. Якоря используют в оглавлениях, длинных документах. Браузеры никак не отображают якоря на страницах, поэтому если есть задача сделать их доступными людям, необходимо предусмотреть собственный способ скопировать якорную ссылку.
Я
Илья Бирман
Главред
Александра Озкан
Редактор
Настасья Тулаева
Редактор