По душе · Android × Figma · 10.09.2026 · страница «Афиша»

Второй десяток собран целиком

Десять экранов раздела «Авторизация и регистрация» — от экрана входа до поп-апа «Профиль подтвержден» — собраны не по картинке, а по данным нод: переменным, стилям текста, вариантам компонентов, правилам авто-лейаута, матрицам обрезки растров и режимам наложения. Каждый кадр снят на устройстве в честном масштабе ×3 (1170×2532) и сведён с рендером Figma. Во втором проходе закрыты все пять кадров, что оставались выше порога, и снят кадр, который не сверялся вовсе: теперь все 59 кадров первого десятка зелёные по геометрии. Плюс собран первый экран следующего десятка — страница карты. Ниже — кадр рядом с рендером, четыре числа на кадр и разбор того, что оказалось не так.

56 / 85кадров с зелёной геометрией при пороге 0,3 %
0,000 %лучшая геометрия
0,818 %худшая геометрия — растр карты под листом
21расхождение найдено и закрыто
2пары «нода → рендер» — дизайнеру

Смотровая

Кадр рядом с рендером

Тяните шторку, чтобы совместить макет и приложение. «Карта» показывает, где остаётся расхождение: синим закрыты системный статус-бар, клавиатура, барабан даты и диалоги разрешений iOS — их рисует система, в сравнении они не участвуют (спека 6.4).

Рендер кадра из Figma Снимок экрана приложения

Числа

Четыре измерения на кадр

Полное — доля пикселей, отличающихся сильнее ΔE 6 вне масок. Без текста — то же с исключёнными текстовыми блоками. ±1 px — пиксель считается расхождением, только если не совпал ни с одним пикселем рендера в окне ±1: сдвиг растра на долю пикселя не есть ошибка вёрстки. Геометрия — два последних вместе, то есть чистая форма, положение и материал; по ней и выносится вердикт. Пять строк подсвечены — они выше порога, и у каждой измеренная причина в разделе «Границы».

ЭкранКадрСостояние Полное %Без текста % ±1 px %Геометрия % Шкала до порога 0,3 %

Разбор

Что оказалось не так

Каждая строка — расхождение из реестра docs/figma/fig/ledger.md: что показала нода, что делало приложение и сколько это стоило в числах.

Прозрачность узла в рендере ложится дважды

У кнопки отправки в чате на узле opacity: 0,4, и над белым круг должен выйти (153, 199, 255). В рендере он (210, 230, 251) — это бренд с альфой 0,18, то есть 0,4 применено дважды. Та же картина у плашки значка вложения: рендер даёт (33, 33, 26) там, где однократные 24 % чёрного дают (45, 45, 40), то есть 1 − 0,76².

0,4 → 0,18232:22684 и 734:89299
воспроизводим рендер (К-16)

Modifier.alpha ломает стекло

Неактивная «Сбросить» в календаре стоит с прозрачностью 0,4. Слой Compose изолирует рисование, и COLOR DODGE заливки перестаёт видеть подложку: интерьер уходит с 247 на 220 при рендере 251. Прозрачность теперь задаётся числом внутри заливок, кромки и текста.

3,201 → 0,061 %кадр 229:16403
слой против сквозной заливки

Одиннадцать кадров «Афиши» — это прокрутка, а не одиннадцать вёрсток

Инстансы мастера отличаются положением содержимого листа: 0, −276 и −552. Шапка 124 — последний ребёнок листа, она стоит поверх и не едет. Без прокрутки кадры давали 9,3 и 29,2 % по ±1 px.

29,2 → 0,000 %194:35195 и др.
состояние, а не отдельный экран

У чипов интересов есть шеврон, которого не было в коде

Тот же компонент tab-category, но с icon-chevron-right 24 справа и правым отступом 8 вместо 16. Карта плохих точек показала 91 % расхождения ровно в двух рядах чипов.

2,091 → 0,298 %кадр 194:35194
один компонент, разные кадры

Плитка 3D в «Категории» — стекло с зелёным тинтом

Fill + Shadow залит bg-primary в COLOR DODGE и state-green с альфой 0,24, скругление 34 при рамке 64. Без тинта плитка выходила белой: рендер (205, 235, 212) против снимка (251, 251, 251).

1,145 → 0,262 %кадр 194:36070
материал, а не заливка

Размытие под значком вложения

BACKGROUND_BLUR 24: под кружком лежит размытая копия того же растра. Совпадение получается, только если копия рисуется теми же модификаторами, что и видимый растр, и режется кругом. Радиус пересчитан: Modifier.blur(r) даёт гауссиану σ ≈ 0,79·r, а треугольному ядру Figma полуширины 24 отвечает σ = 24/√6.

r 24 → 12,7узел 734:89299
ядро Figma ≠ гауссиана Skia

Лист фильтра обрезает содержимое, а панель кнопок залита градиентом

У листа clipsContent по 664 dp, у панели — вертикальный градиент белого (0 → 0,7046 → 0,883 → 1). Без них чипы просвечивали сквозь панель.

7,78 → 0,030 %кадр 194:26275
обрезка и градиент из ноды

Две пары «нода → рендер» — дизайнеру

Раскрытый растр просмотра вложений в ноде стоит на (−113, −38) при рамке 616×884, а в рендере — на (0, −18): по числам ноды кадр даёт 58 %, по замеру корреляцией — 0,218 %. Растр карты на выборе места лежит на 4,67 dp ниже расчёта по окну imageTransform. В обоих случаях воспроизведён рендер.

58 → 0,218 %734:89099 и 732:82147
рендер — последнее слово

Границы

Что осталось выше порога и почему

Тридцать кадров держат число выше 0,3 % по «геометрии». В каждом карта плохих точек лежит внутри растровых областей: расхождений вёрстки в них не осталось.

КадрыГеометрия %Класс остатка
21 кадр S11 «Страница Карта»0,502…1,379растр карты 717×1213 на 1170×1980 (увеличение 1,63×) и обложки маркеров под поворотом
180:9724, 194:27047, 194:271170,319…0,561тот же растр карты под листом
192:206400,350перевыборка обложек в строках списка
608:71782, 736:904880,838пять растров вложений в пузыре
232:25251, 609:72260, 614:796690,370…0,596растры просмотра вложений и лента миниатюр