Масштабирование внутренней платформы Бургер Кинг
О продукте
BK Admin (название под NDA) — внутренняя веб-платформа Бургер Кинга для управления ресторанами и операционными процессами. В ней собраны инструменты для менеджеров ресторанов и офисных сотрудников: управление меню и киосками, заказами, сменами, отчётностью и другими операционными процессами.
Компания отказалась от стороннего подрядчика и перешла на собственный продукт, чтобы обеспечить контроль, гибкость и масштабируемость. Система развивается итеративно и постепенно объединяет административные интерфейсы всех продуктов сети.
Платформа доступна через интерфейс браузера, реализована в светлой и темной теме.
Бизнес контекст
Переход на собственную платформу дал возможность объединить ранее разрозненные админки и создать единый пользовательский опыт для разных операционных сценариев.
При этом BK Admin развивался итеративно: новые функции нужно было запускать одновременно с формированием самой дизайн-основы платформы.
Это создало несколько дизайн-вызовов:
Сложные сценарии;
Миграция существующих интерфейсов админки мобильного приложения;
Необходимость поддерживать консистентность между разными частями платформы;
Построение масштабируемой дизайн-системы;
Подготовка платформы к поддержке светлой и тёмной тем.
Ключевые метрики
Time on task
Error rate
Migration rate
Моя роль
В качестве продуктового дизайнера я одновременно занималась задачами по проектированию новых флоу, работой над UI-kit, интеграцией админки мобильного приложения в BK Admin.
В мои задачи входило:
Проектирование новых сценариев: таблиц, списков, форм и навигации;
Миграция существующих интерфейсов в BK Admin;
Развитие и документирование дизайн-системы;
Создание масштабируемой цветовой архитектуры для светлой и тёмной тем;
Полевые исследования с сотрудниками и менеджерами ресторанов;
Анализ паттернов взаимодействия и бенчмаркинг;
Работа в связке с продакт-менеджерами, аналитиками, разработчиками и другими дизайнерами.
Ниже — несколько инициатив, которые лучше всего показывают мою работу над платформой.
Миграция админки мобильного приложения в BK Admin
Проблема
Компания приняла решение объединить разрозненные системы в единую платформу. Я участвовала в критическом этапе — переезде админки мобильного приложения, который был ограничен по срокам (1,5 месяца на дизайн).
Старая версия содержала избыточную функциональность и использовала паттерны, которые отличались от паттернов BK Admin.
Задача
Перенести существующую админку мобильного приложения в BK Admin, упростив опыт там, где это возможно, и сохранив необходимые пользователям рабочие процессы.
Подход
Я тесно работала с аналитиками, которые выступали владельцами задач: вместе мы разбирали требования, уточняли неоднозначные сценарии и валидировали решения.
Мой процесс включал:
Аудит существующего интерфейса и поиск избыточной функциональности;
Интервью с пользователями;
Построение пользовательских сценариев и их проверку с аналитиками;
Бенчмаркинг внешних продуктов и существующих паттернов BK Admin;
Адаптацию компонентов BK Admin под специфику мигрируемых сценариев;
Проектирование списка позиций меню и экранов их редактирования;
Быстрые итерации вместе с аналитиками;
Подробное описание взаимодействий и корнер-кейсов для аналитиков и разработчиков.
Поскольку параллельно над миграцией работали несколько дизайнеров, особенно важно было сохранить единый визуальный и интеракционный язык платформы.
Результат
Ненужные функции исчезли, интерфейс стал проще и понятнее;
Пользователи админки мобильного приложения получили привычную лексику и безболезненный переход в новую админку;
Сценарии приведены к единому UI BK Admin;
Команда уложилась в жёсткие сроки, что позволило синхронизироваться с редизайном мобильного приложения.
Перевод компонентов на переменные
Проблема
По мере развития BK Admin существующие цветовые стили становились всё сложнее поддерживать.
Они не давали достаточно системной основы для реализации светлой и тёмной тем и приводили к несогласованности между интерфейсами.
Команде требовался более устойчивый подход, который упростил бы работу и дизайнеров, и разработчиков.
Задача
Создать масштабируемую цветовую архитектуру на основе переменных и встроить её в рабочий процесс команды.
Подход
Сначала я провела аудит существующих цветовых стилей и способов их использования в продукте.
Затем изучила подходы крупных цифровых продуктов и сопоставила существующие цвета с прода с новой системой.
На основе этого я разработала семантическую структуру токенов для основных категорий:
Контент;
Фон;
Акцентные элементы;
Уровни прозрачности.
После этого я реализовала переменные в Figma и интегрировала новую систему в рабочий процесс команды.
Чтобы переход был понятен не только мне, я провела воркшоп для дизайнеров и подготовила документацию для разработчиков с описанием новой логики цветов и соответствий между старыми стилями и новыми переменными.
Результат
Темная тема стала внедряться без лишних итераций;
Разработка снизила количество ошибок при переносе макетов;
У команды появилась единая устойчивая система с документацией, которая ускорила работу.
Дизайн на основе полевых исследований
Проблема
BK Admin напрямую связан с реальными операционными процессами ресторанов.
Из-за этого полностью понять потребности пользователей только через требования, аналитику и кабинетные исследования было сложно.
Важно было увидеть, как сотрудники действительно используют внутренние инструменты в рабочей среде.
Задача
Понять реальные сценарии работы сотрудников ресторанов и использовать эти наблюдения для принятия продуктовых решений.
Подход
Я несколько раз выезжала непосредственно в рестораны Бургер Кинга, где:
Наблюдала за работой менеджеров и сотрудников;
Проводила глубинные интервью с менеджерами;
Фиксировала реальные рабочие сценарии и потенциальные точки боли;
Формулировала гипотезы и обсуждала их с продуктовой командой.
Дополнительно я наблюдала за тем, как посетители взаимодействуют с киосками самообслуживания, чтобы лучше понять общий операционный контекст продукта.
Результат
Полевые исследования помогли команде:
Проверить и уточнить продуктовые гипотезы;
Выявить реальные операционные проблемы;
Связать дизайн-решения с поведением пользователей в рабочей среде;
Принимать решения не только на основе требований, но и на основе реального контекста использования продукта.
Итоги
Работа над BK Admin позволила мне выйти за рамки проектирования отдельных фичей и участвовать в развитии полноценной внутренней продуктовой платформы.
Я работала одновременно на нескольких уровнях: мигрировала разрозненные административные инструменты в единую систему, развивала дизайн-систему, создавала масштабируемую цветовую архитектуру и исследовала реальные рабочие процессы пользователей.
По итогам работы продукт стал масштабируемым, консистентным и удобным как для команды, так и для конечных пользователей.
Некоторые детали продукта и экраны не представлены из-за NDA.
Следующий кейс