Автоматизация дизайн-процесса

LukCafe Menu Builder — это набор инструментов, которые автоматизируют создание макетов: минимизируют ручную сборку, снижают риск ошибок и делают обновления быстрыми и предсказуемыми.

Проблема

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

изначальный файл до оптимизации, который правился ВРУЧНУЮ

Решение и моя реализация

Разработать набор инструментов для автоматизации создания макетов меню в Figma на основе Excel-таблицы с ассортиментом и UI Kit. Пять инструментов и документация образуют единый конвейер: от подготовки данных до готовых макетов и файловой структуры.

скорость 3х

Шаг 1. Подготовка данных

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

Шаг 2. Подготовка UI Kit.

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

Компоненты ниже создаёт дизайнер по заданным правилам.

Шаг 3. Подготовка и настройка структуры в Web-редакторе.

Специалист загружает подготовленный Excel в Web-редактор, проверяет данные и настраивает группировку товаров.

Шаг 4. Генерация в Figma.

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

Шаг 5. Тиражирование.

Инструмент создаёт файловую структуру папок на основе подготовленной Excel-таблицы и тиражирует макеты меню.

Документация и передача

Весь процесс описан в документации. Проект можно передать другому специалисту без потери контекста: для дизайнера предусмотрена инструкция по UI Kit и плагину, а для специалиста по ассортименту — правила подготовки Excel, работы с редактором и тиражирования.

Итог

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