Как перевести пиксели в см в фигме

В дизайне интерфейсов точность измерений играет ключевую роль, особенно когда макеты переходят в разработку. Часто дизайнеры работают в пикселях, но заказчики, типографы или производители полиграфии требуют размеры в сантиметрах. Figma — мощный инструмент, но он работает исключительно в цифровых единицах, что вызывает вопрос: как перевести пиксели в сантиметры? Ответ зависит не от самой Figma напрямую, а от понимания плотности пикселей (PPI/DPI) и контекста использования макета.

Что такое пиксель и сантиметр в дизайне

Пиксель (px) — это минимальная единица изображения на экране. В цифровом дизайне все объекты строятся из пикселей. Размеры в Figma по умолчанию указываются именно в пикселях. Это удобно для адаптации под экраны с разной плотностью, но не всегда подходит для физических носителей.

Сантиметр (см) — метрическая единица длины, используемая в реальном мире. Она необходима при создании печатной продукции, упаковки, вывесок, этикеток и других материалов, где важна точная геометрия. Однако Figma не имеет встроенной функции переключения единиц измерения с пикселей на сантиметры.

Разница между этими единицами заключается в том, что пиксель — относительная величина, зависящая от разрешения устройства, а сантиметр — абсолютная, фиксированная мера. Поэтому прямое «преобразование» внутри Figma невозможно без дополнительных расчётов.

Цифровые и физические измерения

Цифровые интерфейсы (веб-сайты, мобильные приложения) проектируются с учётом пиксельной сетки. Плотность пикселей (PPI — pixels per inch) определяет, сколько пикселей умещается на дюйм экрана. Обычно стандартные мониторы имеют 96 PPI, Retina-экраны Apple — от 220 до 326 PPI.

Физические материалы, напротив, измеряются в миллиметрах или сантиметрах. При подготовке макета к печати важно учитывать, как пиксельный размер будет соответствовать реальному. Например, логотип шириной 200 px на экране может занимать 5 см при выводе на печать — но только если известна плотность растра (DPI).

Зачем нужна конверсия px в см

Дизайнеры сталкиваются с необходимостью перевода пикселей в сантиметры в нескольких сценариях. Один из самых частых — передача макета в печать. Допустим, вы разработали этикетку для бутылки в Figma. Производитель спрашивает: «Какие физические размеры у этого элемента?». Ответ в пикселях его не устроит.

Другой случай — презентация проекта заказчику, который не разбирается в цифровых терминах. Сказать «кнопка высотой 48 пикселей» — значит ничего не объяснить. Гораздо понятнее будет: «высота кнопки — 1,27 см при масштабе 1:1 на экране с плотностью 96 PPI».

Также перевод актуален при создании UI-китов, где необходимо указывать размеры компонентов в разных единицах. Это помогает командам разработчиков и инженерам лучше понимать масштаб.

Где чаще всего требуется перевод

• Полиграфия: визитки, буклеты, упаковка, плакаты.
• Продуктовый дизайн: создание физических устройств с экранами (часы, панели управления).
• Архитектура и интерьер: макеты интерактивных панелей, выставочных стендов.
• Образование: методические пособия, где нужно показать реальные пропорции.

Формула перевода пикселей в сантиметры

Перевод пикселей в сантиметры — это математическая операция, основанная на плотности пикселей на дюйм (PPI). Формула проста:

1. Разделите количество пикселей на PPI (например, 96).
2. Умножьте результат на 2,54 (количество сантиметров в одном дюйме).

Например:
Ширина элемента — 300 px.
PPI — 96.
(300 / 96) × 2,54 = 7,94 см.

Это означает, что на экране с плотностью 96 PPI этот элемент займёт около 7,94 см по ширине.

Стандартные значения PPI

Практические шаги перевода

Хотя Figma не позволяет автоматически отображать размеры в сантиметрах, вы можете легко выполнить конверсию вручную или с помощью сторонних инструментов. Ниже — пошаговый алгоритм.

Шаг 1: Определите размер в пикселях

Откройте макет в Figma. Выделите нужный объект. В правой панели Inspector вы увидите его ширину (W) и высоту (H) в пикселях. Запишите одно из значений, например, W = 400 px.

Шаг 2: Уточните целевую плотность (PPI/DPI)

Задайте себе вопрос: для чего предназначен этот макет? Если для экрана — используйте 96 PPI (стандарт). Если для печати — 300 DPI. Это критически важный параметр.

Шаг 3: Примените формулу

Используйте формулу:
см = (px / PPI) × 2,54

Для 400 px при 96 PPI:
(400 / 96) × 2,54 ≈ 10,6 см

Шаг 4: Проверьте результат

Сравните с реальными объектами. Например, возьмите линейку и проверьте, сколько сантиметров занимает область 400 px на вашем экране (при масштабе 100%). Учтите, что точность зависит от диагонали и разрешения монитора.

Ошибки при переводе и как их избежать

Многие дизайнеры допускают типичные ошибки при попытке перевести пиксели в сантиметры. Вот самые распространённые.

Ошибка 1: Игнорирование PPI

Самая частая ошибка — использовать «прямое» деление, например, 100 px = 1 см. Это неверно. Без учёта плотности пикселей результат будет неточным.

Ошибка 2: Подмена DPI и PPI

Хотя DPI и PPI часто используются как синонимы, технически это разные понятия. DPI относится к печати (точки на дюйм), PPI — к экранам (пиксели на дюйм). При работе с печатью важно использовать именно DPI, установленный в программе вёрстки (например, в Adobe Illustrator).

Ошибка 3: Неправильный масштаб в Figma

Figma позволяет масштабировать макет (от 1% до 400%). Измерения в пикселях остаются неизменными, но визуально объект кажется больше. Не путайте масштаб отображения с реальным размером.

Как избежать ошибок

• Всегда уточняйте контекст использования макета.
• Используйте стандартные значения PPI/DPI.
• Документируйте расчёты в комментариях к макету.
• Проверяйте результат с помощью физической линейки (если возможно).

Инструменты и конвертеры

Если вы регулярно сталкиваетесь с необходимостью перевода, есть несколько удобных решений.

Онлайн-конвертеры

Существуют специализированные сайты, которые выполняют расчёт автоматически:

• Pixel Converter (pixel-converter.com)
• WhatIsMyPPI.com — определяет плотность вашего экрана
• OnlineConversion.com — универсальный калькулятор

Они позволяют ввести px, выбрать PPI и получить результат в см, мм или дюймах.

Figma Plugins

В магазине плагинов Figma есть решения, которые могут помочь:

• Px to CM Converter: добавляет кнопку для быстрого расчёта.
• Unit Switcher: позволяет временно отображать размеры в других единицах (работает через аннотации).
• Measure: полезен для экспорта данных в PDF с указанием размеров.

Однако ни один плагин не меняет базовую систему измерений — они лишь автоматизируют расчёты.

Excel/Google Таблицы

Создайте простую таблицу с формулой:
= (A1 / 96) * 2.54
где A1 — ячейка с количеством пикселей. Такой подход удобен для массовой обработки.

Экспертное мнение

На практике Дмитрий предлагает такой подход:
После завершения макета создаётся фрейм «Print Specs», в котором размещаются:

• Таблица с ключевыми элементами и их размерами в px и см.
• Сноска: «Расчёт выполнен при плотности 96 PPI. Для печати используйте 300 DPI».
• Пример линейки с обозначением 1 см в пикселях.

Это особенно полезно при работе с внештатными исполнителями или клиентами без технической подготовки.

Вопросы и ответы

Заключение

Перевод пикселей в сантиметры в Figma — не встроенная функция, а процесс, требующий понимания основ цифрового и полиграфического дизайна. Главное — помнить, что пиксель не является абсолютной единицей измерения, и его физический размер зависит от плотности отображения.

• Figma работает только в пикселях — прямого перевода в см нет.
• Для конверсии используйте формулу: см = (px / PPI) × 2,54.
• Стандартные значения: 96 PPI для экранов, 300 DPI для печати.
• Используйте плагины и онлайн-конвертеры для упрощения задачи.
• Всегда указывайте плотность и единицы измерения в технической документации к макету.