Для разработки собственного интерфейса на Huawei Watch 3 Pro необходимо скачать официальный редактор Watch Face Studio от Samsung, так как нативного инструмента от Huawei для сторонних разработчиков не существует. Программа работает на Windows и macOS, поддерживает экспорт в формат .watch, совместимый с экосистемой HarmonyOS через приложение «Темы» или «Здоровье».

Запустите установленную среду и создайте новый проект, выбрав разрешение 466 × 466 пикселей — именно такое диагональное разрешение имеет AMOLED-экран про-версии. В настройках проекта сразу укажите целевую платформу Wear OS / HarmonyOS, чтобы редактор корректно сформировал манифест и не добавил лишние слои, не поддерживаемые прошивкой часов.

Подготовка ассетов и структура слоёв

Качественный циферблат начинается с векторной графики: часы, индексы, компас и фон лучше рисовать в SVG или экспортировать в PNG с прозрачностью @2x. Растровые текстуры (карбон, кожа, градиенты) допускаются только для фона, иначе при включении Always On Display они дают артефакты мерцания.

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

  • 🎨 Фон: один слой, блокированный от редактирования
  • ⏱ Часовая стрелка: вектор, pivot в центре, привязка к [HOUR_0_23]
  • ⏱ Минутная стрелка: вектор, pivot в центре, привязка к [MIN]
  • 🔋 Батарея: текстовый слой с тегом [BATTERY_PER] и иконка
  • 💓 Пульс: компликейшн типа Heart Rate с fallback-текстом «--»

Настройка компликейшнов и интерактивности

Huawei Watch 3 Pro поддерживает до 8 слотов компликейшнов, но системные ограничения HarmonyOS позволяют отобразить только 4–5 одновременно. В Watch Face Studio перетащите виджеты «Complication» на холст и в инспекторе задайте типы: Short Text для погоды, Ranged Value для шагов, Icon для уведомлений.

Для интерактивных зон (tap actions) используйте компонент Tap Area: нарисуйте прозрачный прямоугольник над элементом и в свойствах «Action» выберите «Open App» — «Workout», «Alarm» или «Music». Проверьте координаты в превью: зоны не должны перекрывать стрелки, иначе нажатие сработает некорректно.

⚠️ Внимание: На прошивках HarmonyOS 3.0+ системные компликейшны «Погода» и «Календарь» обновляются только при синхронизации с телефоном. Если данные не подтягиваются — проверьте разрешения приложения «Темы» в настройках телефона.

Режим Always On Display: экономия пикселей

В разделе «AOD» редактора включите галочку «Enable Low Bit Ambient». Все цветные слои автоматически превратятся в монохромные белые контуры. Критически важно скрыть секундную стрелку и анимированные частицы — они сгорят OLED-матрицу за неделю. Оставьте только часовую, минутную стрелки и статичные цифры времени.

Добавьте условие видимости для слоя «Батарея»: #[IS_AOD] == false#. В ambient-режиме процент заряда не обновляется в реальном времени, поэтому лучше убрать его совсем, оставив только иконку молнии при зарядке.

☑️ Чек-лист перед сборкой

Выполнено: 0 / 5

Сборка, тестирование и установка на часы

Нажмите «Run» → «Build» → «Watch Face File (.watch)». Файл весом 2–5 МБ появится в папке Documents/WatchFaceStudio/Builds. Перенесите его на телефон через USB или облако, затем откройте приложение «Файлы» на смартфоне и запустите .watch — система предложит установить через «Темы».

Если установка завершилась ошибкой «Unsupported format», откройте manifest.json внутри архива (переименуйте в .zip) и убедитесь, что minApiLevel не выше 26, а targetApiLevel равен 30. Huawei Watch 3 Pro работает на API 30 (HarmonyOS 2/3), более новые манифесты часы просто проигнорируют.

Решение ошибки "Install failed"

Часто причина — несовпадение package name. В Watch Face Studio заполните поле "Package Name" по шаблону com.yourname.watchface.unique. Не используйте com.huawei. или com.samsung. — системный установщик заблокирует такие идентификаторы как подозрительные. После изменения пересоберите проект полностью (Clean + Build).

Публикация в AppGallery и Theme Store

Для распространения через официальный магазин зарегистрируйтесь в Huawei Developer Console как Individual или Company. В разделе «Watch Face» загрузите .watch-файл, скриншоты 466×466 (минимум 3), иконку 1024×1024 и заполните описание на русском и английском. Модерация занимает 3–7 дней; частый отказ — отсутствие политики конфиденциальности (Privacy Policy URL).

В настройках цены выберите «Free» или укажите стоимость в USD — Huawei конвертирует в локальную валюту. Выплаты приходят на банковский счёт, указанный в профиле разработчика, с задержкой 60 дней после конца календарного месяца.

ПараметрЗначение для Watch 3 ProПримечание
Разрешение экрана466 × 466 pxКруглый AMOLED
Формат файла.watch (ZIP-архив)Манифест + ресурсы
Макс. размер билда15 МБЛимит Theme Store
Поддержка AODОбязательнаТолько белый цвет
API Level30 (HarmonyOS 3)min 26, target 30

Оптимизация потребления энергии

Каждый лишний пересчёт слоя в рантайме съедает процент заряда в сутки. Отключите «Smooth Animation» для секундной стрелки — пусть она тикает дискретно. Используйте системные шрифты HarmonyOS Sans вместо кастомных TTF: это экономит 200–400 КБ и ускоряет рендеринг.

Сгруппируйте статичные декоры в один растровый слой (Merge Layers) перед экспортом. Редактор сам сделает это при сборке, но ручная проверка гарантирует отсутствие прозрачных пикселей, которые GPU всё равно обрабатывает.

⚠️ Внимание: Не вставляйте в циферблат анимированные GIF или APNG — HarmonyOS их не воспроизводит, а Watch Face Studio вызовет ошибку компиляции. Для анимаций используйте последовательность PNG в компоненте «Animation» с частотой не выше 10 FPS.
💡

Сохраняйте исходный .wfs-файл проекта в Git. При обновлении прошивки часов может измениться поведение компликейшнов — придётся пересобрать билд за 5 минут, а не рисовать с нуля.

Частые ошибки новичков и их решения

Проблема: стрелки смещены относительно центра. Причина — холст в графическом редакторе был неквадратным или точка привязки не в (233, 233). Решение: в Photoshop/Figma сделайте холст 466×466, центрируйте объект, экспортируйте PNG без полей.

Проблема: компликейшн погоды показывает «N/A». Причина — на телефоне отключено геолокация для приложения «Погода» или нет интернета. Циферблат тут бессилен, но можно добавить fallback-слой с текстом «Нет данных», видимый когда [WEATHER_TEMP] == "".

💡

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

📊 Какой способ создания циферблатов вам ближе?
Watch Face Studio (визуальный)
Код на JavaScript (Watch Face Format)
Готовые конструкторы в приложении Темы
Пока только изучаю тему

FAQ: ответы на популярные вопросы

Можно ли сделать циферблат прямо на часах без компьютера?

Нет. Полноценная разработка требует Watch Face Studio на ПК. На самом устройстве доступен только конструктор комбинаций из готовых элементов в приложении «Темы».

Почему после обновления прошивки циферблат пропал из списка?

Обновление HarmonyOS иногда сбрасывает сторонние watch faces. Зайдите в «Темы» → «Мои» → «Циферблаты» и нажмите «Применить» снова. Если файла нет — установите .watch повторно.

Как добавить второй часовой пояс?

В Watch Face Studio добавьте текстовый слой с формулой [UTC_HOUR_0_23]+3 (для МСК) и настройте формат через компонент «Digital Clock» с ручным смещением timezone offset.

Поддерживает ли Watch 3 Pro интерактивные анимации при касании?

Да, через Tap Area → Action → «Animation Trigger». Но анимация должна быть заранее заготовлена в компоненте Animation и не превышать 2 секунд, иначе система прервёт её.

Где взять бесплатные ассеты для коммерческого использования?

Сайты Figma Community, Undraw, Iconscout (фильтр Free for Commercial). Всегда проверяйте лицензию: CC0 или MIT — безопасно, CC BY — нужна атрибуция в описании.