# Машинный растр как визуальный язык Дата: 2026-06-23 Теги: design, frontend Источник: https://ponomar.art/notes/mashinnyy-rastr/ > Почему изображения на сайте — не фото, а сетка штрихов: один движок печёт и статику, и интерактив. --- Сайт намеренно отказывается от фотографий: ни одного полноразмерного снимка, ни лайфстайла, ни стоковых лиц. Но изображения всё-таки нужны — и вместо фото здесь живёт **растр**: картинка превращается в сетку вертикальных штрихов, где длина штриха задаётся яркостью исходного пикселя. Светлое рвётся в разрывы, тёмное сливается в сплошные линии. Это не фильтр поверх фото. Это отдельный визуальный слой, у которого есть один важный принцип — **одно ядро на два таргета**. ## Как это устроено Вся математика растра живёт в чистом модуле: он сэмплирует картинку в сетку яркостей и выдаёт абстрактные «метки». Дальше два тонких адаптера превращают эти метки либо в инлайновый SVG (на сборке, ноль JS в рантайме), либо в отрисовку на canvas (для интерактивного hero). Один источник правды → статика и интерактив совпадают пиксель-в-пиксель.
ФОТО СЕТКА ЯРКОСТЕЙ ШТРИХИ
Один движок: сетка яркостей → метки. SVG на сборке, canvas в рантайме.
## Зачем так Растр держит сайт честным: изображение есть, но оно «машинное» — данные, а не глянец. У блока с фото появляется характер, при этом в рантайм не уезжает ни лишнего килобайта картинки, ни JavaScript. А там, где нужен живой акцент, тот же движок включает интерактив — и переключатель HUMAN / MACHINE показывает, что под штрихами всё это время лежало настоящее изображение. Эта заметка — первый пример нового визуального языка блога: **растр для образов, SVG-метафоры для идей.**