Компоненты, состояния и правила для веба и мобильных интерфейсов.
Проектирую интерфейсы для сложных рабочих задач
15+ лет в дизайне. Разбираюсь в задачах бизнеса, общаюсь с пользователями, создаю UI kit и дизайн-системы. Работаю с разработчиками до выпуска продукта.
* Многие примеры находятся в стадии концепта. Реальные рабочие макеты под NDA
Enterprise UX
Industrial Systems · B2B · SaaS
15+ лет
B2B-продукты, дизайн-системы и руководство дизайн-командами.
Подход
Что даёт моя работа
Интервью, наблюдения на рабочем месте и проверка прототипов.
Разбор процессов и задач вместе с заказчиком и командой.
Сопровождение разработки, проверка интерфейса и выпуск обновлений.
Selected work
Ключевые проекты
Задачи бизнеса, исследования, интерфейсные решения и результаты работы с командой.
Industrial / B2E / Enterprise
Цифровая платформа управления горнодобывающим предприятием
Задания, маршруты и состояние техники — в интерфейсах для операторов, диспетчеров и руководителей.
35%простои техники
×7реакция
60%ROI
Исходная ситуация
На предприятии заказчика управление работами во многом строилось на бумажных документах и устной коммуникации. Наряды-задания выдавали на бумаге, рейсы фиксировали механическими счётчиками, а обращения операторов передавали по рации через помощников. Информация о неисправностях и авариях поступала диспетчеру с задержкой, иногда — только к концу рабочего дня.
Что изменила система
Централизованная система объединила данные с датчиков и бортовых устройств, позволив отслеживать ситуацию на предприятии в реальном времени. Диспетчеры получили возможность быстрее реагировать на события, перераспределять задачи и сокращать простои техники. Система также позволила планировать буровые работы и заранее резервировать технику для погрузки и доставки руды. Решение проектировалось для двух предприятий и охватывало диспетчерский центр, аналитику, веб-платформу и рабочие места операторов на борту техники.
Мой вклад и полевые исследования
Изучал работу операторов на производстве, участвовал в замерах буровых скважин и проводил интервью. По этим наблюдениям проектировал сценарии, интерфейсы и прототипы. На этом проекте промышленной автоматизации в Рексофте отвечал за UX/UI всей системы.
Проектные ограничения
Проектирование для горнодобывающей отрасли требовало учитывать реальные условия работы. Полевые исследования нередко выявляли расхождения между потребностями операторов и представлениями руководства о том, какие данные нужны в кабине техники. Эти наблюдения помогали определять состав информации, её приоритеты и способ отображения в интерфейсе.
Сценарии проверки
Для оценки эффективности системы выбрали несколько частых сценариев: препятствие на дороге, срочную смену задания, поломку и запрос на эвакуацию, получение и подписание маршрутного листа. До автоматизации многие из этих процессов требовали личного присутствия. За новым заданием сотрудник шёл в пункт выдачи, а при поломке мог вызывать транспорт, ехать в технический отдел и устно объяснять проблему.
Автоматизация процессов
После внедрения системы часть событий стала фиксироваться и передаваться автоматически. Информация, требующая уточнения или подтверждения, поступала на бортовое устройство оператора или рабочее место диспетчера. Это сократило число ручных действий и промежуточных звеньев в коммуникации. Перепланирование работ, привлечение резервной техники и оповещение служб стали происходить быстрее, а сведения о событиях сохранялись в отчётах для руководителей.
Измеримый результат
Полевые замеры показали заметное сокращение времени на выполнение сценариев. Например, получение нового задания занимало 2–3 минуты вместо прежних 30 — в 10–15 раз быстрее. Дополнительным результатом стала единая база данных о работе предприятия: накопленную информацию можно было использовать для отчётности, планирования работ и оценки будущих рисков. Решение было доведено до этапа промышленного тестирования.
Бортовое устройство исполнителя
Рабочий интерфейс в кабине техники
Бортовое приложение было одним из нескольких продуктов экосистемы автоматизации добычи. Через него исполнитель получал задания, видел план и факт рейсов, место погрузки и разгрузки, а также передавал диспетчеру актуальный статус работы.
Пример решения
Поиск места работ без клавиатуры
В кабине и в перчатках вводить длинные названия неудобно. Поэтому сценарий поиска построен на последовательном сокращении вариантов по тем символам, которые действительно встречаются в названиях рабочих мест.
Шаг 01
Показать только используемые символы
Анализ структуры данных показал, что в названиях используется лишь 20–30% букв алфавита. Пользователь сразу выбирает первую букву из ограниченного набора и видит часто используемые места.
Шаг 02
Сократить список после первого выбора
После выбора первой буквы интерфейс оставляет только допустимые вторые символы и подходящие числовые значения. Уже на этом шаге большинство лишних вариантов исчезает.
Шаг 03
Уточнить и выбрать место
Если подходящий вариант ещё не виден, пользователь добавляет цифру. Система оставляет минимальный набор совпадений, из которого можно выбрать место без ввода с клавиатуры.
Бизнес-задача
Свести управление добычей, транспортировкой и сменными заданиями в единую систему для двух предприятий.
Результат
- Платформа покрыла диспетчерский центр, аналитику и рабочие места операторов.
- Задания и сообщения о событиях передаются через систему.
- Решение вышло на промышленное тестирование.
Мой вклад
- Интервью с операторами и наблюдения на производстве.
- Пользовательские сценарии, CJM и проверка прототипов.
- Веб‑платформа для диспетчеров и мобильные интерфейсы для техники.
Интерфейсы продукта
Dashboards · Tablets · Planning
EdTech / Enterprise SaaS
Springer Nature / Macmillan Education — платформа управления образовательным контентом
Рабочая среда для авторов, редакторов и продакшен‑команд, которые создают и согласуют образовательный контент.
−45%подготовка контента
×3скорость ревью
−30%ошибки контента
Контекст продукта
Macmillan Education — образовательное подразделение группы Springer Nature, которое выпускает учебные материалы и цифровые инструменты для обучения. Для подготовки контента компания использует собственное программное обеспечение, разработанное международной командой.
Задача
Авторы часто обращались в поддержку: им было трудно работать со структурой материалов и инструментами редактора. Я разбирал причины этих обращений и перерабатывал сценарии и интерфейс.
Исследование
Обсуждал проблемы с авторами, владельцами продукта и разработчиками. Проверял навигацию по каталогам, работу с текстом, вложенными данными и комментариями. Интервью и демонстрации для международной команды проходили на английском.
Перепроектирование системы
Переработал создание, редактирование и согласование материалов: дерево активностей, комментарии, роли и статусы. Привёл элементы интерфейса к общему виду и предложил автоматизировать повторяющиеся действия.
Результат
Структуру каталогов стало проще просматривать, а материалы — редактировать и согласовывать. Обновили комментарии и статусы, добавили инструменты редактирования.
Измерение эффекта
До переработки интерфейса мы замерили время ключевых задач. Повторная проверка показала, что подготовка материалов стала занимать меньше времени, хотя возможностей редактирования стало больше.
Бизнес-задача
Упростить создание и согласование учебных материалов, снизить число обращений в поддержку.
Результат
- Пересобраны сценарии создания, ревью и согласования контента.
- Улучшена работа с древовидной структурой активностей.
- По комментариям и статусам видно, что требует правок и согласования.
Мой вклад
- Интервью с авторами и разбор обращений в поддержку.
- Редактор, структура материалов и согласования.
- Демо, интервью и обсуждения решений на английском.
Интерфейсы CAPE
Authoring · Review
Simulation Software / SaaS
AnyLogic — новый веб‑продукт для инженерной платформы
Смотреть проект на Behance−35%когнитивная нагрузка
×2скорость сценариев
MVPзапуск продукта
О продукте
AnyLogic — программа для моделирования бизнес-процессов и сложных систем: производства, логистики, транспорта и работы людей. Она позволяет проверять разные сценарии в виртуальной среде и оценивать последствия решений до их внедрения в реальности. Среди пользователей продукта — крупные международные компании.
Переход в веб
Исторически основной средой создания моделей было десктопное приложение. Команда, к которой я присоединился, работала над переносом этого опыта в веб-среду. Важно было сохранить возможности профессионального инженерного инструмента и одновременно снизить сложность пользовательских сценариев. Также предстояло решить накопившиеся проблемы: многие вопросы регулярно повторялись в обращениях в службу поддержки.
Моя роль
Разбирал проблемы пользователей и проектировал веб-интерфейс. Создал дизайн-систему и UI kit с состояниями компонентов, проверял решения с пользователями и дорабатывал их вместе с разработчиками.
Область работы
Работа охватывала как общую структуру интерфейса, так и отдельные инструменты: рисование кривых Безье, отображение связей между объектами на боковой панели и холсте, размещение библиотек и их иконок, поведение полей и форм. Я также создавал и адаптировал иконки, разрабатывал новый дизайн сайта документации и консультировал коллег по интерфейсным решениям.
Исследование и коммуникация
Изучал обращения в поддержку, обсуждал задачи с владельцами продукта и технические ограничения с разработчиками. Проверял решения с теми, кто строит модели, и с теми, кто использует готовые.
Проверка решений
Проверяли расположение инструментов, рисование и соединение блоков. Неудачные варианты меняли или откатывали. Для единообразного поведения интерфейса я собрал библиотеку компонентов и их состояний.
Результат
В сжатые сроки команда подготовила MVP веб-продукта, который стал частью направления AnyLogic Cloud. Основным критерием успеха стала самостоятельность пользователей: на тестировании 9 из 10 участников без ошибок выполняли предложенные задачи в новой среде. Мы также фиксировали сокращение количества промежуточных действий при создании и редактировании моделей.
Главная задача · Desktop → Web
Перенос среды моделирования в веб
Главной задачей проекта была миграция профессиональной среды моделирования из десктопного приложения в веб. Новая версия сохраняет возможности инженерного продукта, но перестраивает рабочую область, навигацию и панель свойств под современные веб-сценарии.
Примеры решений
Два примера кейсов из множества
В рамках общей миграции я последовательно перерабатывал отдельные инструменты и пользовательские сценарии. Ниже — два примера таких подзадач.
Кейс 01
Упрощение выбора и создания объектов
Задача и исследование
Я разобрал сценарий работы с объектами через боковую панель. В исходном интерфейсе пользователь сначала выбирал тип объекта с помощью радиокнопок, а затем указывал конкретный объект. Исследование показало, что пользователи чаще выбирают объекты непосредственно на холсте и реже пользуются списком.
Решение
Вместо радиокнопок и отдельного поля выбора я спроектировал единый выпадающий список с группировкой объектов по типам. В нём можно выбрать существующий объект, перейти к выбору на холсте через Select on canvas или нарисовать новый через Draw new.
Реализация и проверка
Я обсудил техническую сложность решения с командой и представил его стейкхолдерам. После реализации 9 из 10 участников тестирования выполнили задание без затруднений. Также я переработал группировку параметров и привёл поля и отступы к единым правилам.
Кейс 02
Выбор распределения без модального окна
Задача и исследование
В десктопной версии окно выбора распределения вероятностей перекрывало холст. Опрос показал, что пользователи редко обращаются к описаниям распределений и нечасто меняют значения параметров по умолчанию.
Решение
Я предложил перенести выбор распределения и его параметры в дополнительное меню боковой панели. График остался рядом с выбранным распределением, а подробное описание стало доступно по ссылке на справку.
Реализация и проверка
Концепцию согласовали с командой разработки и стейкхолдерами, а затем обсудили с пользователями. После реализации участники тестирования успешно справились со сценарием; замечаний к новой механике не возникло.
Бизнес-задача
Собрать MVP веб‑продукта без потери мощности профессионального инженерного инструмента.
Результат
- Спроектирован MVP нового продукта.
- Решение стало частью направления AnyLogic Cloud.
- Инструменты моделирования адаптированы для веба.
Мой вклад
- Дизайн-система, UI kit и состояния компонентов.
- Сценарии моделирования и проверка с пользователями.
- Доработка интерфейса с разработчиками до MVP.
Концепции веб‑продукта
Web product · MVP
Education / Mentoring
ИТМО — куратор магистерских дипломных работ
Помогал магистрантам исследовать проблему, спроектировать решение и подготовиться к защите.
2023–2025период
25+дипломных работ
UX/UIмагистерские проекты
Контекст
Курировал магистерские дипломы по дизайну цифровых продуктов. На консультациях разбирали, какую проблему решает интерфейс и чем подтверждено выбранное решение.
Что я делал
Помогал сформулировать проблему и проверить гипотезы. Разбирал исследования, сценарии, прототипы и презентации, давал обратную связь перед защитой.
Результат
Студенты готовили к защите проекты с исследованием, прототипом и обоснованием своих решений.
Задача
Развивать у студентов продуктовую логику: от проблемы и исследования до аргументации решения.
Результат
- Курирование магистерских дипломных работ.
- Развитие продуктового мышления у студентов.
- Подготовка к защите и презентации решений.
Мой вклад
- Консультировал по UX/UI и продуктовой логике.
- Разбирал исследования, сценарии и прототипы.
- Оценивал итоговый результат работы.
- Помогал объяснить и защитить решения.
Logistics / CRM / Presale
Газпромнефть — G‑Manager и сервисы логистики
Операционные продукты для сети АЗС и логистики топлива: мобильная CRM, контроль нарушений, BI и пресейл нового направления.
60 млн ₽в мес. новый контракт
×5скорость контроля
−40%ручные операции
Контекст
Работал над мобильной CRM для АЗС, контролем нарушений и аналитикой логистики. Отдельная задача — подготовить концепцию нового сервиса для обсуждения с заказчиком.
Что я делал
Изучал процессы, проводил интервью и полевые исследования. Проектировал интерактивные концепции, на которых можно было показать заказчику сценарии работы и обсудить предложение.
Решения и эффект
Концепция показывала, как сократить ручной контроль в логистике. Она помогла подготовить коммерческое предложение и стала основой контракта. За вклад в развитие направления получил премию «НИКА».
Бизнес-задача
Показать, как цифровой продукт может снизить ручной контроль и открыть новое направление работ в логистике.
Результат
- Концепция стала основой контракта около 60 млн рублей в месяц.
- Интерактивная концепция помогла согласовать новое направление с заказчиком.
- Проект отмечен корпоративной премией «НИКА».
Мой вклад
- Полевые исследования, интервью и разбор процессов.
- Интерактивные концепции для пресейла.
- Менторинг дизайнера на старте проекта.
Интерфейсы и концепции
CRM · Logistics · Prototypes
Webcoding
От идеи до работающего продукта
Личные проекты: определяю задачи, проектирую интерфейс, с помощью ИИ пишу код и выпускаю обновления.
Personal product / Mobile Web / AI Development
SSSPORT — запись на баскетбол и чат команды
Мобильный сервис для баскетбольной команды в Петербурге: выбрать игру, подтвердить участие и оставаться на связи с командой.
Открыть SSSPORT ↗Idea → Liveполный цикл продукта
Mobile firstфокус на смартфоне
Design + AIдизайн и реализация
Как создавался продукт
Спроектировал выбор игры, запись и статусы участников. С помощью ИИ пишу и дорабатываю код, проверяю сценарии в браузере и выпускаю обновления. Развиваю профили игроков, чат и установку приложения на телефон.
Задача продукта
Упростить организацию регулярных игр: собрать расписание, запись и статусы участников в одном месте.
Результат
- Работающий сервис на sssport.ru.
- Запись на игру как гость или с профилем игрока.
- Настройки уведомлений и переход к ботам команды.
Мой вклад
- Идея продукта и пользовательские сценарии.
- Интерфейс для телефона и поведение компонентов.
- Реализация и развитие сервиса с помощью ИИ.
Экраны SSSPORT
PWA приложение · iPhone 16 Plus · Демо-данные
Personal project / Travel / AI-assisted development
Sostavok — поездка из нескольких билетов
Личный сервис поиска мест в поезде. Если одного места на весь путь нет, подбирает билеты по участкам со сменой места или вагона в том же поезде.
Открыть Sostavok ↗По участкамподбор билетов
Один поездсмена места в пути
В продакшенеsostavok.ru
Проблема
На весь маршрут места может не быть, хотя на отдельных участках они есть. Я спроектировал поиск таких сочетаний и выдачу, в которой видно число билетов, места и станции смены.
Интерфейс и проверка
Первые подтверждённые варианты появляются, пока остальные ещё проверяются. Схема показывает участки пути и время смены места; фильтры помогают выбрать нижние места или один вагон. Проверяю длинные маршруты и узкие экраны.
Выпуск и ограничения
С помощью Codex реализую поиск и интерфейс, выпускаю обновления в Яндекс Cloud и проверяю их на продакшене. Билеты покупаются отдельно у перевозчика; наличие мест и цена могут измениться. Время поиска зависит от ответов перевозчиков.
Задача продукта
Найти способ доехать, когда прямого билета на нужное место нет, и понятно показать, где и когда нужно пересесть.
Результат
- Поиск составных вариантов и повторная проверка мест.
- Схема маршрута, вагоны и время смены места.
- Работающий сервис в Яндекс Cloud.
Мой вклад
- Идея, логика поиска и интерфейс.
- Разработка с помощью Codex и проверка реальных маршрутов.
- Публикация, проверка продакшена и доработка сервиса.
Экраны Sostavok
Реальные результаты поиска · 7 ноября 2026
Recognition
Премия «НИКА» за вклад в развитие бизнеса
Награда Рексофт в номинации «За особые заслуги» после привлечения нового направления работ для Газпромнефть ТЛК.
Интерактивная концепция помогла заказчику оценить предложение до начала разработки.
About
Как я работаю
UI kit и дизайн-системы
Создаю библиотеки компонентов, описываю состояния и правила. Работаю с Auto Layout, переменными и токенами в Figma.
Пользователи и бизнес
Провожу интервью и наблюдения, разбираю обращения в поддержку. Сопоставляю проблемы пользователей с задачами бизнеса.
От макета до выпуска
Обсуждаю ограничения с разработчиками и проверяю реализацию. Личные сервисы выпускаю и развиваю с помощью Codex.
Работа с командой
Руководил дизайнерами в Рексофте и JetRuby: найм, ревью и развитие команды. В ИТМО курировал магистерские проекты.
Contact
Обсудим ваш продукт и задачи дизайна
Константин Киргинцев
Senior Product UX/UI Designer / Продуктовый UX/UI дизайнер
Петербург: офис и гибрид. Удалённая работа.
+7 981 978-85-48 kirgintcev@gmail.com Telegram: @kirgincev