Команды MacPng отгружают логотипы, кампейны и UI-полосы, которые должны выглядеть одинаково честно в светлой, тёмной и сезонной темах. Без автоматизации токены меняются, а превью «не доезжают» до всех кадров — маркетинг подписывает не тот кадр. Ниже — учебный HowTo с чеклистом: установка OpenClaw и Gateway на macOS, watch folder или задача по расписанию, подключение манифеста токенов JSON, пакетный рендер PNG, пороговое сравнение с эталоном и вывод отчёта (Markdown или JSON), плюс типовые ошибки и повторы (retry). Базу по агенту зафиксируйте в руководстве по установке OpenClaw на все платформы; паттерны наблюдения за папками — в материале watch folder и многоразмерные PNG на удалённом Mac.
Содержание
Зачем бренду мультитематические PNG-превью
Пользователям MacPng знакомы три класса сбоев, если превью собирать вручную или на разных машинах:
- Тихий дрейф: правка hex в токенах не отражается во всех PNG, и согласование идёт по устаревшему кадру.
- Невоспроизводимый экспорт: разное сглаживание шрифтов и ICC на ноутбуках ломает сравнение с CI и с эталоном в DAM.
- Слабая ревизия: папки «было/стало» плохо сканируются; стейкхолдерам нужен числовой порог и одностраничный summary.
OpenClaw связывает навыки, вызовы CLI и доступ к файлам на одном слое macOS. Сочетайте его с выделенным удалённым Mac (например M4), чтобы Gateway, health-проверки и рендер всегда шли в одной среде — как в продакшене у дизайн-команды.
Матрица триггеров: watch, расписание, ручной вызов
| Триггер | Когда уместен | Компромисс |
|---|---|---|
| Дебаунс watch folder | Дизайнер кладёт обновлённый tokens.json или SVG в inbox/ |
Нужны стабильные пути и при необходимости Full Disk Access; не стрелять на каждый автосейв |
cron / launchd |
Ночная регрессия против токенов из main |
Без gating по git hash можно гонять неизменённые файлы |
| Ручной вызов навыка | Перед тегом релиза или ревью заказчика | Зависит от того, что кто-то запустит команду по SSH |
Объединяйте проверки размера, альфы и ICC с единым контуром QA — см. пакетную проверку PNG через OpenClaw на удалённом Mac, чтобы пороги по байтам и визуальный diff жили в одной политике приёмки.
Воспроизводимые шаги конвейера
- Подготовьте узел. Подключитесь по SSH или VNC (инструкции — в разделе помощи MacPng). Создайте дерево:
tokens/,templates/,out/previews/,out/diff/,logs/, при необходимостиbaselines/. - Установите OpenClaw и включите Gateway. Зафиксируйте версии по install guide. Проверьте health (HTTP 200, ожидаемое тело), что API-ключ читает корень проекта и может запускать нужные навыки.
- Опишите навык или скрипт. Вход: список тем, ширина/высота PNG, правила имён, пути к эталонным PNG для сравнения.
- Подключите триггер. Либо watch на
tokens/с дебаунсом 2–5 с и проверкой стабильного размера файла, либо вызов из CI после merge. - Цикл рендера. Для каждой темы смержьте токены в шаблон, отключите анимации, зафиксируйте фон и DPR, сохраните
{компонент}_{тема}_{WxH}.png. - Сравнение. Сопоставьте новый PNG с утверждённым baseline; при провале порога сохраните heatmap и строку в отчёт.
- Артефакты. Запишите
report.mdилиsummary.jsonвout/diff/, прикрепите к тикету или загрузите в DAM.
Контракт JSON токенов и цикл рендера
Один манифест на линейку бренда. Минимальная форма: массив themes[] с id, картой colors, radius, опционально font и путём template. Шаг валидации JSON Schema в навыке выполняйте до любого headless-рендера — так вы не тратите GPU на битый вход.
- Детерминизм: фиксированный DPR, явный фон, отключённые transition; при политике бренда вшивайте sRGB ICC в выходной PNG.
- Имена: нижний регистр и slug темы — предсказуемая сортировка в Finder и в таблице отчёта.
- Размер партии: на M4 начните с 12–48 превью за прогон; параллелизм наращивайте после замеров памяти и загрузки GPU.
Порог, сравнение и формат отчёта
Инструмент на выбор: magick compare или эквивалент с числовым score и опциональным heatmap PNG. Типовые ворота: доля изменённых пикселей ниже ~1% и RMSE ниже калиброванного потолка на холсте (например 1024 px по ширине после нормализации).
Каждая строка отчёта: тема, файл, метрики, pass/fail, путь к heatmap (только при fail), хэш baseline. Так маркетинг и дизайн-ops читают один файл вместо десятка скриншотов.
Типовые ошибки и политика повтора
| Симптом | Вероятная причина | Повтор |
|---|---|---|
| Gateway 502 / таймаут | Холодный старт навыка или конфликт порта | Backoff 2 / 4 / 8 с; после трёх неудач — перезапуск Gateway |
Permission denied при записи |
Песочница macOS или другой пользователь по SSH | Сверить whoami, владельца каталогов и ACL; один повтор после исправления |
| Пустой или «левый» цвет | Нет шрифта или смешение P3 и sRGB | Установить шрифты на узле, зафиксировать профиль, перерендерить |
| Diff всегда красный | Разный размер кадра или шум сглаживания | Нормализовать размер, слегка увеличить fuzz или пересмотреть порог после калибровки на эталонных парах |
Дописывайте строки в logs/runs.jsonl: время, git SHA, счётчики pass/fail — удобно искать регрессию по токен-коммиту.
Чеклист перед запуском
- Health Gateway OK; версия OpenClaw зафиксирована в README узла
- Схема токенов проходит валидацию; пути к шаблонам существуют
out/иlogs/доступны на запись пользователю SSH- Baseline версионированы; числа порогов задокументированы
- Дебаунс watch настроен; lock-файл блокирует параллельные прогоны
- Отчёт прикреплён к тикету или лежит в согласованном каталоге DAM
FAQ
Достаточно ли одного tokens.json на все кампании?
Лучше разделять по продуктовой линии или бренд-гайду: так проще откатывать тему и не смешивать ключи цвета между кампаниями.
Как не ловить ложные срабатывания на антиалиасинге?
Фиксируйте один и тот же движок рендера и версию шрифта на узле; калибруйте порог на парах «до/после» известного микроизменения токена.
Нужен ли отдельный baseline на каждую тему?
Да: светлая и тёмная тема дают разные эталонные PNG; сравнивайте строго внутри пары «новый рендер темы X» с «baseline темы X».
Запускайте OpenClaw и пакетные PNG-превью на удалённом Mac M4
Откройте главную MacPng, ленту технических идей (блог) и помощь по SSH/VNC; сравните конфигурации на странице тарифов — материалы доступны без входа в аккаунт.