Как определить процент текста на картинке прямо в Фигме
Замучились таскать макеты по сервисам, которые постоянно отваливаются, и придумали удобное решение для всех
Зачем нужно знать процент текста на рекламных креативах
Проверка процента текста на изображении — стандартная задача для всех, кто работает с рекламными кампаниями. У ВК Рекламы, myTarget и некоторых других площадок текст на баннере должен занимать строго меньше 20%. На глаз не определить, нужны спецсервисы. Когда-то свои решения предлагал Фейсбук* и другие разработчики, но со временем остался единственный инструмент — Робби. Он был интегрирован в сервисы ВК и автоматически проверял долю текста. Несмотря на отсутствие альтернатив, пользоваться Робби было неудобно, потому что он:
- требовал лишних действий: экспорта, загрузки, ожидания проверки, внесения правок в Фигме и повторные действия для десятков баннеров;
- не позволял работать с несколькими макетами или версиями одновременно;
- периодически отваливался.
В январе 2026 года Робби не работал довольно долго и мы поняли: нужна не просто замена, а более удобный инструмент. Поэтому сделали плагин для Фигмы, чтобы проверять процент текста прямо в макете.
Как работает Текстомер для пользователя
Сценарий очень простой:
- Дизайнер выделяет макет (или слой) и нажимает «Проверить».
- Плагин срабатывает — строит сетку на макете.
- Дизайнер проверяет, весь ли текст попал в сетку. Если не весь, то нажимает кнопку «Добавить вручную», после чего появляется детектор — полупрозрачный прямоугольник, который нужно поместить на незамеченный текст. Если весь текст попал в сетку — переходит сразу к шагу 4.
- Дизайнер смотрит на значения. Если они его устраивают, можно проверять следующий баннер или завершать работу Текстомера. Если нет — макет дорабатывается.
- Дизайнер запускает повторные проверки до тех пор, пока не удовлетворится результатом.
Всё.
Как работает Текстомер под капотом
Площадь текста на картинке невозможно корректно определить с помощью машинного обучения. Единственный рабочий подход — математический. Робби разбивал изображение на квадраты и считал, в какую долю площади попадает текст. Машинное обучение применялось только для распознавания текста, но не для расчета процента. Текстомер работает по тому же принципу, но с усовершенствованиями:
- строит сетку поверх макета — по сути делит изображение на мелкие квадраты,
- распознает текст и замеряет, сколько квадратов он занимает,
- использует систему коэффициентов, чтобы усилить или ослабить расчет в зависимости от жирности, прозрачности и размера шрифта,
- считает итоговый процент текста на изображении.
Точность в первой итерации была около 80–85%. Перед релизом откалибровали значения и предусмотрели некоторый запас, чтобы юзеры стремились чуть сильнее уменьшить текст и наверняка проходили требования по лимитам.
Работает это так: в условном квадратике текст считается не за 1, а за 1,1. Поэтому юзер может проверить процент текста на картинке и увидеть результат 20% там, где Робби увидел бы 19%. Это дополнительная гарантия, что удастся остаться в рамках.
Чем удобен плагин
Даже, если Робби оживёт или появятся новые сервисы, Текстомер будет иметь несколько преимуществ.
- Скорость и непрерывность процесса. Плагин позволяет проверить процент текста прямо в Фигме и тут же в макете внести корректировки.
- Ручные настройки. Если какой-то текст не распознается автоматически, можно вручную добавить детекторы, чтобы точно ничего не пропало.
- Сравнение версий. В Текстомере можно проверять сразу несколько макетов или вариантов одного и выбирать оптимальный по проценту текста.
Никуда без дизайна интерфейса
Текстомер сделан дизайнерами для дизайнеров. Поэтому с UX и UI работали дотошно: экспериментировали с размерами полей, акцентами, цветами. Разумеется, всё в рамках нашего фирстиля.
Интерфейс важно было адаптировать под разные пользовательские сценарии. Например, если дизайнер определяет процент текста сразу на нескольких изображениях, цифры в полях становятся меньше.
Вместо вывода
Текстомер не изобретает новую логику, а аккуратно встраивается в привычный рабочий процесс дизайнера. Это удобно, просто, бесплатно и реально работает. Лучший показатель — то, что дизайнеры начали находить, устанавливать и советовать плагин, а мы его даже особо не рекламировали. Зацените Текстомер и вы!
А мы, кажется, подсели на разработку инструментов для упрощения жизни дизайнеров. Сейчас разрабатываем ещё пару плагинов, и обязательно про них скоро расскажем — стэй тьюнд!