Движение, звук и тактильный отклик
Статус: нормативный справочник по мультимодальному дизайну
Версия: 0.1
Этот документ определяет temporal, auditory и tactile feedback в HIF. Эти modalities — функциональные каналы интерфейса. Они MAY усиливать continuity, причинность, внимание, ориентацию и последствия, но MUST NOT становиться декоративной нагрузкой, зависимостью доступности или заменой правильного состояния.
1. Мультимодальный контракт
Начальная точка — semantic event:
событие → предполагаемое понимание/действие человека
→ визуальное представление
→ программное/assistive представление
→ optional motion
→ optional sound
→ optional haptic
Для каждого feedback event определяются:
- условие запуска, ответственный и предусловие;
- meaning и urgency;
- intended audience и environment;
- start, update, completion, cancellation и failure;
- modality mapping и timing relationship;
- пользовательская и системная настройка;
- резервный вариант для неподдерживаемой возможности;
- repetition, escalation и suppression;
- verification и telemetry без сбора лишних sensitive data.
Ни одна modality не добавляется, пока нельзя сформулировать её вклад. Motion, sound и haptics MUST согласовываться относительно event. Success chime MUST NOT сопровождать pending visual state; error haptic MUST NOT срабатывать до получения результата validation.
2. Функциональная таксономия
2.1. Движение
| Роль | Результат для человека | Пример | Ограничение |
|---|---|---|---|
| Direct response | действие ощущается связанным с input | dragged object следует за pointer | latency и geometry сохраняют causality |
| State transition | изменение видно, а не происходит магически | disclosure расширяется | final state доступен без ожидания decoration |
| Continuity | object identity переживает transformation | selected card становится detail | origin и destination достоверны |
| Spatial orientation | navigation сохраняет mental map | соседний pane входит со смоделированного direction | direction соответствует information architecture |
| Feedback | command или constraint подтверждается | control приходит в selected state | semantic state независимо exposed |
| Attention | существенное изменение замечается | сдержанный highlight обновлённого value | не continuous, coercive или sole cue |
| Progress | представлены time и phase | determinate operation продвигается | не фабрикует progress |
| Demonstration | объясняется новая связь | first-use gesture demonstration | replayable, dismissible и альтернативно документирована |
2.2. Sound
| Роль | Представление | Уместное применение |
|---|---|---|
| Speech | language | instruction или content, когда speech — выбранный mode |
| Earcon | абстрактный musical/timbral motif | небольшой изучаемый event vocabulary |
| Auditory icon | звук, связанный с real-world cause | event с достоверной acoustic analogy |
| Status tone | короткий non-speech cue | confirmation, warning или boundary |
| Continuous sonification | changing sound отображает changing data | monitoring или data exploration с training и alternative |
| Spatial cue | воспринимаемые direction/distance | off-screen или spatial object, где position осмысленна |
| Ambience | environmental state | immersive context, но никогда не sole essential status |
2.3. Haptics
| Роль | Пример |
|---|---|
| Contact/activation | press или touch зарегистрирован |
| Selection/detent | дискретный slider step или picker value |
| Alignment/snap | object достиг guide или valid drop position |
| Boundary/collision | movement достиг реального limit |
| Завершение | процесс или команда завершены |
| Успех/ошибка/предупреждение | класс результата усилен |
| Текстура/непрерывный параметр | специализированное управление или доступное представление данных |
Количество semantic signals SHOULD оставаться достаточно малым для изучения и различения. Одна intensity MUST NOT кодировать обширный vocabulary.
3. Причинность и непрерывность
Feedback принадлежит вызвавшему его event. Воспринимаемый source SHOULD быть ясен во времени и пространстве.
Для direct manipulation:
- controlled object следует за input с минимальной предотвратимой latency;
- animation не борется с gesture;
- отпускание сохраняет текущее положение и скорость, где этого требует физическая модель;
- snap, collision и boundary feedback происходят на фактическом threshold;
- cancellation возвращает к достоверному state;
- interruption начинается с текущего rendered state, а не устаревшего keyframe.
Для state transitions:
- persistent objects сохраняют узнаваемую identity;
- inserted и removed content определённо воздействует на neighbours;
- direction следует navigation или spatial model;
- teleportation MAY использоваться, если spatial relationship отсутствует;
- motion MUST NOT создавать впечатление transfer, deletion или save данных, если этого не произошло.
Shared-element transitions требуют стабильной object identity. Одно visual similarity не делает два elements одним object.
4. Внимание и прерывание
Motion, sound и vibration конкурируют за ограниченное attention. Используется наименее interruptive channel и intensity, достаточные для результата.
Events классифицируются:
- ambient: optional awareness без interruption;
- status: относится к текущей работе; видим/слышим без захвата focus;
- action required: нужен своевременный ответ; есть ясный persistent route;
- urgent/safety critical: немедленный существенный risk; сильный multimodal cue с escalation и acknowledgement.
Marketing importance MUST NOT классифицироваться как urgency. Repeated animation, sound или haptics MUST NOT использоваться для coercion engagement.
Notifications MUST определять:
- source и affected object;
- почему человек получает уведомление;
- urgency и expiry;
- grouping и rate limit;
- quiet hours, focus mode и channel preferences;
- acknowledgement и history;
- duplicate suppression между devices;
- escalation, только когда её оправдывает consequence.
Notification sound или vibration MUST NOT раскрывать sensitive content или relationship окружающим без соответствующих privacy policy и preference.
5. Временные параметры
5.1. Модель времени
Timing выводится из purpose, distance, complexity, platform convention, device performance и user preference. HIF не предписывает одну универсальную duration.
Product Profile определяет рекомендуемые semantic ranges:
- immediate response: acknowledgement во время или непосредственно после input;
- micro-transition: локальная state change;
- navigation transition: смена region или context;
- explanatory sequence: управляемая пользователем demonstration;
- continuous/system-driven: progress, monitoring или simulation.
У каждого range есть minimum, preferred и maximum values, а также reduced-motion equivalent. Наличие token не доказывает, что duration перцептивно пригодна.
Feedback direct action SHOULD доставляться настолько близко к triggering event, насколько platform способна надёжно обеспечить. Delayed feedback ослабляет causality и MAY быть принят за другой event. Animation MUST NOT задерживать доступ к уже готовому result.
5.2. Последовательность
Предпочтительно небольшое число осмысленных stages. Staggering MAY раскрывать order, но:
- MUST NOT задерживать routine access к последующим items;
- list length MUST NOT создавать неограниченную total duration;
- focus MUST NOT попадать на moving или unavailable target;
- repeated navigation SHOULD сокращать или исключать уже понятую sequence.
Sound envelopes и haptics SHOULD совпадать с material event, а не просто с началом animation file.
6. Easing и physics
6.1. Parametric easing
Easing сообщает, как изменение начинается, продолжается и завершается:
- entering object может decelerate при прибытии;
- exiting object может accelerate при уходе;
- persistent object может использовать symmetric или context-specific curve;
- directly manipulated object следует за input, а не decorative easing curve.
Named token MUST включать фактическую curve и intended role. Термины «smooth», «natural» или «snappy» не являются specifications.
6.2. Spring и inertial models
Physics-based motion MAY улучшать continuity, когда velocity, target или forces могут измениться во время interaction. Определяются:
- mass или равнозначный perceptual weight;
- stiffness;
- damping ratio;
- initial и current velocity;
- rest thresholds;
- bounds и collision;
- retargeting и cancellation.
Bounce не тождественен natural motion. Underdamped springs могут продлевать settling, отвлекать, ухудшать precision и влиять на motion-sensitive людей. Overshoot используется только когда выражает реальное interaction property и остаётся controllable.
Implementation MUST иметь deterministic completion condition. Oscillation, никогда не достигающая rest, непригодна для routine UI state.
7. Прерывание, смена цели и отмена
User input имеет приоритет над non-essential animation. Каждый interactive transition определяет:
- можно ли его interrupt;
- что происходит при repeated activation;
- reverse, retarget, complete или snap;
- как меняются фокус и состояние доступности;
- как отменяются callbacks и pending operations;
- final state после application backgrounding, route change или process interruption.
При retargeting сохраняются current position и velocity, где это соответствует модели. Restart с original keyframe создаёт discontinuity.
Visual cancellation не отменяет underlying command. Command и presentation требуют отдельных cancellation contracts. Ушедший screen MUST NOT позднее получать stale completion animation или sound.
Rapid repeated input MUST NOT ставить в queue длинную sequence устаревших animations, tones или vibrations. Feedback объединяется вокруг resulting state.
8. Доступность и безопасность движения
8.1. Reduced motion
Product MUST соблюдать platform reduced-motion preferences, где они доступны, и SHOULD давать in-product control, если motion существенно.
Reduced motion — semantic alternative, а не global duration multiplier. В зависимости от effect:
- исключаются parallax, simulated camera travel и large-field movement;
- spatial transition заменяется immediate state change или restrained dissolve;
- сокращаются distance, scale, blur и overshoot;
- останавливаются automatic и repetitive animation;
- essential progress и state change сохраняются в non-motion representation;
- direct tracking под контролем человека сохраняется, если безопаснее autonomous motion.
Alternative MUST проектироваться и тестироваться, а не генерироваться установкой каждой duration в zero. Мгновенное удаление само может разрушить orientation или вызвать flashing.
8.2. Vestibular risk
High-risk patterns:
- parallax и противоположное foreground/background movement;
- крупные zoom, scale и depth transitions;
- simulated camera или world motion без контроля viewer;
- movement через большое поле или в peripheral vision;
- repeated oscillation, spinning и auto-scroll;
- быстрые blur или perspective change.
В routine interfaces их SHOULD избегать; для non-essential effects MUST быть reduced alternative.
8.3. Вспышки и мигание
Content MUST соответствовать принятым WCAG flashing requirements. Одно замедление flash не доказывает safety. Frequency, area, luminance change и red flash оцениваются по normative threshold официальными test methods.
Автоматически движущееся, мигающее, прокручивающееся или обновляемое содержание, попадающее в область WCAG, MUST предоставлять требуемый механизм паузы, остановки или скрытия. Существенное состояние должен оставаться доступным при paused animation.
9. Performance и rendering
Качество motion включает responsiveness, frame consistency, power, memory и thermal behaviour. Тестирование проводится на lowest supported performance profile.
Implementation SHOULD:
- выполнять expensive preparation до interaction, где это безопасно;
- избегать unnecessary layout и paint на каждом frame;
- анимировать properties, эффективно поддерживаемые target platform;
- использовать platform frame scheduler;
- ограничивать particle, blur, shadow и layer costs;
- не удерживать большие off-screen surfaces;
- останавливать работу при invisible animation или backgrounded application;
- снижать decoration раньше semantic feedback.
Нельзя предполагать universal refresh rate или фиксированный 16.7 ms frame. Измерение ведётся по active display и platform APIs. Высокий average frame rate не оправдывает input latency, long frames или jank в момент действия.
Performance degradation MUST NOT пропускать final state, терять completion announcement или рассинхронизировать modalities. Если transition нельзя надёжно отрендерить, подставляется более простой transition.
10. Звуковой дизайн
10.1. Semantic sound
Sound принадлежит semantic family и SHOULD различаться не только volume. Определяются:
- event и urgency;
- duration, envelope, timbre и pitch range;
- repetition и maximum rate;
- relative gain и mix priority;
- spatial behaviour;
- ducking или interruption policy;
- silence и visual/haptic alternative;
- ownership, licence и mastering requirements.
Культурно или физически нагруженный auditory icon не используется без исследования target population. Abstract earcon требует learning и consistent reuse.
10.2. Управление аудио
Интерфейс MUST соблюдать системные настройки отключения звука, устройства вывода, громкости, доступности и фокуса. Запущенные пользователем медиа, коммуникация, навигационные сигналы и уведомления sounds требуют разных policies.
Автоматически запускаемый web audio подчиняется WCAG audio-control requirements и user-agent autoplay policies. HIF SHOULD избегать automatic audio в general-purpose interfaces. Visible control MUST оставаться accessible при недоступном audio.
Speech и essential listening content MUST NOT маскироваться background sound. Transient cues SHOULD микшироваться сдержанно и тестироваться через speakers, headphones, assistive listening configurations и noisy environments.
10.3. Spatial audio
Spatial audio MAY поддерживать orientation, когда position — часть domain. Определяются:
- coordinate space и listener reference;
- source ownership и persistence;
- distance attenuation и occlusion;
- head-tracked или screen-relative behaviour;
- конфликт со speech и safety signals;
- резервные варианты для стерео, моно и отсутствия звука.
Spatial position MUST соответствовать фактической interface или world model. Routine notifications не размещаются произвольно вокруг listener. Critical information требует non-spatial equivalent и MUST оставаться понятной через один channel, при hearing loss или device downmix.
11. Дизайн тактильного отклика
11.1. Semantics
Haptics используются для усиления discrete material event. Source SHOULD быть понятен через concurrent action или visual change. Haptics MUST NOT добавляться к каждому tap; saturation уничтожает meaning и может вызвать fatigue.
Для standard interactions предпочтительны platform-defined semantic effects. Нестандартные паттерны MAY применяться, когда предметная область требует отдельного словаря и документированы аппаратная поддержка, обучение, резервный вариант и проверка.
11.2. Возможности и ограничения
Actuators различаются latency, amplitude, frequency control, location и waveform support. Platforms могут предоставлять только predefined effects. Поэтому:
- support обнаруживается runtime;
- capability не выводится из device category;
- предоставляется no-haptic path;
- соблюдаются system intensity и disable settings;
- не обещается одинаковое ощущение custom waveform на разном hardware;
- duration и repetition ограничиваются ради comfort, power и thermal constraints;
- синхронизация с audio/visual events использует измеренное device behaviour, где важна precision.
Vibration MUST NOT быть единственным носителем alarm, error, navigation direction или completed action. Человек может не чувствовать device, иметь reduced sensitivity, работать в gloves или отключить haptics.
12. Мультимодальная эквивалентность
Эквивалентность означает сохранение результата, а не взаимную имитацию всех каналов.
| Event | Visual/programmatic core | Optional sound | Optional haptic |
|---|---|---|---|
| Команда принята | состояние элемента управления и статус | сдержанное подтверждение | лёгкая активация |
| Операция успешна | устойчивый результат или статус | мотив успеха | паттерн успеха |
| Проверка не пройдена | связь с полем и сводка ошибок | сигнал ошибки, если уместно | паттерн ошибки |
| Boundary reached | visible constraint и accessible status, если нужен | boundary tick | collision/detent |
| Off-screen urgent event | persistent notification и route | urgent tone | urgent pattern |
| Progress | determinate/indeterminate state и announcement policy | sonification только для обоснованного monitoring | continuous haptic только для specialist case |
Отключение любого optional channel MUST оставлять задачу понятной и operable. Где sound, motion или touch сами являются предметом задачи, по возможности domain предоставляется appropriate description, transcript, visualisation или device-specific alternative.
13. Токены и ассеты
Рекомендуемые семейства tokens:
motion.duration.immediate/micro/navigation/explanatory
motion.easing.enter/exit/persistent/emphasised
motion.spring.direct/settle/boundary
motion.distance.local/region
motion.reduced.*
sound.event.activation/success/warning/error/urgent
sound.gain.interface/notification/media
sound.rate.maximum
sound.spatial.*
haptic.event.activation/selection/alignment/boundary/success/warning/error
haptic.intensity.subtle/standard/strong
feedback.suppression.*
Каждый token фиксирует:
- semantic role и forbidden uses;
- value или referenced asset;
- units и platform transformation;
- сопоставление пользовательских настроек;
- резервный вариант;
- версия, ответственный, лицензия и происхождение;
- зависимые компоненты и проверки.
Raw filenames вроде ding2.wav, произвольные cubic-bezier values и vibration
arrays MUST NOT быть public semantic API. Assets MUST проходить loudness и
quality checks, иметь licence, version и доставляться в performance budgets.
14. Алгоритм спецификации
- Определить event, желаемое understanding и urgency.
- Убедиться в правильности persistent visual и programmatic state.
- Выбрать наименее interruptive достаточный modality set.
- Определить causality, spatial source и modality timing.
- Определить complete, failure, cancellation, repeated-input и background cases.
- Спроектировать reduced-motion, silent и no-haptic equivalents.
- Принять platform semantic patterns, где они соответствуют event.
- Токенизировать roles и зарегистрировать licensed assets.
- Прототипировать на репрезентативном оборудовании и устройствах вывода.
- Проверить восприятие, различимость, комфорт, доступность и производительность.
- Измерять field suppression, repeated notifications и unintended interruption без сбора лишнего content.
- Удалить любой cue без доказанного вклада.
15. Матрица QA
15.1. Функциональные состояния
Тестируются start, update, success, warning, error, cancellation, timeout, offline, background, resume и rapid repeated input. Подтверждается, что displayed final state, а не completion animation, владеет operation result.
15.2. Preferences и capabilities
- reduced motion on/off и изменение во время работы;
- звук отключён, низкая громкость, моно, другое устройство вывода и активная программа экранного доступа;
- haptics unsupported, disabled и reduced intensity;
- notification focus/quiet modes;
- high contrast, forced colours и magnification;
- low-power и reduced-data modes, где уместно.
15.3. Performance
- lowest supported hardware и thermally constrained state;
- high и variable refresh rates;
- interrupted frames и main-thread load;
- задержанная выдача звука и тактильного отклика;
- application background/foreground;
- multiple simultaneous cues и notification storms.
15.4. Human evaluation
Репрезентативные participants SHOULD уметь:
- определить event и source без угадывания;
- различить signals, требующие разных action;
- завершить задачу при отключении каждой optional modality;
- interrupt и reverse motion без потери control;
- использовать reduced-motion mode без потери orientation;
- переносить repeated routine use без неприемлемых distraction, discomfort или fatigue;
- распознавать urgent events без того, чтобы marketing или routine events становились неразличимо интенсивными.
Включаются люди с vestibular conditions, hearing differences, tactile sensitivity или reduced sensation и релевантным assistive-technology experience. Participants не подвергаются flashing или motion, заведомо превышающим safety requirements.
16. Контрольные этапы выпуска
Выпуск блокируется, когда:
- semantic state зависит только от motion, sound или haptics;
- reduced motion, silence или unsupported haptics делают задачу неполной;
- animation задерживает или отклоняет input без task reason;
- transition теряет focus, state, data или command result;
- flashing не оценён по normative threshold;
- notification urgency завышена или preferences игнорируются;
- cues существенно рассинхронизированы со своими events;
- performance вызывает dropped final states или repeated stale feedback;
- licence или provenance asset неизвестны.
Источники
- W3C — Web Content Accessibility Guidelines (WCAG) 2.2
- W3C — Media Queries Level 5
- W3C — Web Animations Level 1
- W3C — CSS Easing Functions Level 2
- W3C — Web Audio API
- Apple Human Interface Guidelines — Motion
- Apple Human Interface Guidelines — Playing haptics
- Apple Human Interface Guidelines — Playing audio
- Android Developers — Haptics design principles
- Android Developers — Animate movement using spring physics
- Microsoft — Motion in Windows apps
- Microsoft — Haptics design guidelines
- Gaver (1986), Auditory icons: Using sound in computer interfaces
- Blattner, Sumikawa and Greenberg (1989), Earcons and icons: Their structure and common design principles
- Brewster and Brown (2004), Tactons: Structured tactile messages for non-visual information display