Дизайн интерфейса, часть 2. Когда изменения оправданы

17 марта 2026 • Николай Жеребцов

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

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

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

Хороший пример — автосохранение. Когда-то закрыть документ без ручного сохранения означало потерять работу. Сегодня автосейв — базовое поведение системы, о котором пользователь даже не задумывается. Та же история с бесконечной прокруткой. Infinite scroll начинался как экспериментальная альтернатива пагинации, а сейчас это норма для лент, каталогов и социальных сервисов.

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

Разберем ситуации, в которых изменения оправданы и дают измеримый эффект.

1. Таблицы 

Скриншот аналитики конкурентов в B2B-приложении.

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

На изменения влияют три вещи:

  • рабочие сценарии стали быстрее и плотнее 
  • пользователи часто работают в нескольких окнах и узких колонках 
  • выросла доля мобильных и гибридных сценариев 

Инлайн-редактирование

Интерфейс B2B-приложения с таблицами и формами для анализа данных.

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

Быстрые действия в строке

Отчеты о налогах на прибыль для компаний в 2024 и 2025 годах.

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

Персонализация и сохранение вида

Скриншот таблицы проектов в системе управления проектами True Engineering.
Скриншот интерфейса ClickUp с задачами и таблицами.

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

Появились микроподстройки:

Таблица с информацией о работе над UI-дизайном для AC Accounting.
  • изменение ширины колонок и высоты строк 
  • выбор плотности интерфейса 
  • изменение формата отображения (например, дата 07.08.25 или 7 августа 2025) 

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

Горизонтальный скролл

Таблица с текстовыми строками в интерфейсе True Engineering.

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

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

Детализация внутри таблицы

Скриншот интерфейса True Engineering с работой над списком задач.
Анализ конкурентов и SEO-оптимизация в системе True Engineering.

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

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

AI как встроенный помощник

AI в таблицах используется для задач, которые сложно делать вручную:

  • интеллектуальный поиск и фильтрация 
  • автоматическое присвоение категорий 
  • аналитика 
  • автозаполнение и исправление данных 
  • генерация сводок 
  • персонализированные рекомендации 

2. Фильтры

Мгновенное обновление

Интерфейс управления поставками и заказами в B2B-приложении.

Раньше фильтры почти всегда работали через кнопку «Применить». Пользователь выбирал параметры, подтверждал, и только после этого обновлялся результат.

Сейчас в простых сценариях данные обновляются сразу по мере выбора. Если фильтр текстовый, добавляют небольшую задержку — обычно 300–500 мс. Для более тяжелых запросов — до секунды. Это нужно, чтобы не перегружать систему лишними запросами.

Отдельная кнопка остается там, где фильтрация сложная или ресурсоемкая.

Сохраненные комбинации

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

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

Поведение по истории

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

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

Интеллектуальные фильтры

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

Разные форматы в одном интерфейсе

Скриншот сайта SP Airlines с выбором рейсов.

Фильтры редко существуют в одном виде.

В одном экране могут сочетаться:

  • быстрые чипсы для частых параметров 
  • вертикальный сайдбар для детальной настройки 
  • модальное окно с расширенными условиями 

Глубина фильтрации зависит от задачи и роли пользователя.

3. Большие формы

Многостраничные формы (Wizards)

Скриншот формы регистрации на платформе True Engineering.

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

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

Формы с секциями вместо шагов

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

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

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

Обычно используют:

  • меню по разделам 
  • аккордеоны для необязательных секций 
  • прогресс или индикаторы заполнения 
  • условную логику 
  • блок с кратким саммари 
На изображении показаны настройки бюджета и персональные данные в интерфейсе True Engineering.

Чат-диалоговые формы 

Форма для ввода имени и фамилии для получения котировки на страхование животных.

Еще один вариант — форма в виде диалога. Один вопрос за раз, ответы идут последовательно, интерфейс подстраивается под предыдущие данные.

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

Сохранение прогресса

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

4. Карточки и модальные окна

Карточки-дашборды

Панель управления организацией в True Engineering Cloud Center.

Раньше карточка объекта была короткой: несколько базовых полей — имя, телефон, адрес.

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

Большие модальные окна

Скриншот интерфейса управления задачами в Acro.Cloud.

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

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

Создание кластера MongoDB в облачной среде.
Скриншот интерфейса для создания электронной почты в HubSpot.

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

Индикаторы заполнения

Создание платежного аккаунта в Yandex Cloud Billing.

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

Появляются числовые индикаторы и понятная индикация состояния разделов.

Горизонтальная скролл в карточках

Интерфейс управления сделками в Acroso.Cloud.

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

5. Меню и навигация

Мега-меню

Скриншот сайта User Interviews с описанием продуктов и функций.

Раньше подменю чаще представляло собой список ссылок.

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

Search-centric навигация

Интерфейс True Engineering с фильтром и результатами поиска.

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

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

Контекстное меню

Интерфейс управления проектами в системе True Engineering.

Контекстное меню перестает быть просто списком действий.

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

Поиск и добавление функций в интерфейсе True Engineering.

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

Меньше уровней вложенности

Многоуровневые меню с тремя-четырьмя уровнями вложенности используются реже. Основные разделы стараются держать на видимом уровне.

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

Переосмысление бургер-меню

Бургер больше не воспринимается как универсальное решение.

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

6. Страницы ошибок

Понятное объяснение вместо технического сообщения

Изображение 404 ошибки на сайте True Engineering.

Раньше страница ошибки часто ограничивалась коротким сообщением вроде «404» или «Page not found». Пользователь видел код и не понимал, что произошло и что делать дальше.

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

Проявление идентичности бренда

404 страница с изображением кофейного зерна и текстом на русском языке.
Изображение демонстрирует страницу 404 ошибки на сайте True Engineering.

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

 Интерактив на страницах ошибок

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

Работа на упреждение

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

7. Голосовые интерфейсы

Приветственное окно веб-приложения True Engineering.

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

Используются три основных направления:

  • голосовой поиск 
  • диктовка и транскрибация 
  • голосовые сценарии поддержки 

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

8. AI интерфейсы

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

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

Скриншот интерфейса с кодом и заметками о создании презентации.

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

Вывод

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

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

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

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

О случаях, когда стоит опираться на устоявшиеся привычки - рассказали в этой статье:

Дизайн интерфейса, часть 1. Когда лучше ничего не менять

Недавние публикации

Еще по теме

Похожие бизнес-задачи и решения, которые мы нашли, проверили и внедрили