Растр и вектор. Форматы. 3D

Содержание и основные понятия

← К оглавлению
Alterna · глава 20.2
Растр и вектор. Форматы. 3D
Разрешение, форматы, масштабирование без потерь, основы 3D-графики.
Растр: пиксели и разрешение
Растровое изображение
— сетка пикселей (точек). Разрешение = количество пикселей по горизонтали × вертикали.
DPI
(dots per inch) — плотность пикселей при печати. Физический размер = разрешение / DPI × 25.4 мм.
Ширина (пикселей)
Высота (пикселей)
DPI (при печати)
Глубина цвета (бит)
Размер при печати
—
Объём (бит)
—
Объём (МБ, без сжатия)
—
МП (мегапикселей)
—
Пример: 4000×3000, 24 бита, 300 DPI
Размер печати = 4000/300×25.4 ≈ 338×254 мм (A3). Объём = 4000×3000×24 = 288 000 000 бит ≈ 34.3 МБ. При 96 DPI экранный размер ≈ 416×312 пикселей.
Форматы растровой графики
Формат
Сжатие
Прозрачность
Типичный размер
(4000×3000, 24 бит)
Применение
BMP
нет
—
~34.3 МБ
Сохранение без потерь, Windows
JPEG
lossy
—
3–8 МБ
Фото, веб-изображения. Сжатие 10–20×
PNG-8
lossless
1 бит
5–12 МБ
Веб-графика, иконки, скриншоты
PNG-24
lossless
—
~25 МБ
Скриншоты, диаграммы, арт
WebP
lossy/lossless
да
2–5 МБ
Веб (Google), анимированные стикеры
TIFF
optional
да
~40 МБ
Профессиональная фотография, полиграфия
RAW
none
да
~50 МБ
Цифровые камеры, 48-битный цвет
GIF
lossless
1 бит (простое)
2–10 МБ
Анимация, 256 цветов макс.
Векторная графика
Векторное изображение
— описание геометрических примитивов (линии, кривые Безье, заливки). Масштабируется без потерь: кривые пересчитываются для любого размера. Формат SVG — текстовый, описывает кривые Безье и заливки.
📐 Кривые Безье
Математическая кривая, описываемая 4 точками: начало, конец и две контрольные. Кривая непрерывно проходит между началом и концом, «притягиваясь» к контрольным точкам.
📄 Форматы
SVG
— веб-вектор (текстовый XML).
AI
— Adobe Illustrator.
EPS
— универсальный для печати.
PDF
— вектор+растр.
CDR
— CorelDRAW.
🎯 Когда вектор лучше
Логотипы, иконки, шрифты, чертежи, картография. Фотографии — всегда растр: слишком много деталей для векторизации.
Растр vs Вектор
Растр:
честный пиксель → легко редактируется, но масштабируется с потерей качества (зум в 4× = размытие). Размер файла = X·Y·i.
Вектор:
формулы и кривые → масштабируется бесконечно без потерь, но не подходит для фотореализма. Размер файла зависит от сложности сцены, а не от площади.
🔍
Интерактив: масштабирование растра vs вектора
Два изображения: растр (пиксельная сетка) и вектор (кривая). Увеличь масштаб — растр «поплывёт», вектор останется чётким.
Растр (bitmap)
Пиксели фиксированы. При зуме — ступенчатые артефакты.
×1
Вектор (SVG-подобный)
Линии и кривые. При зуме — пересчёт формул.
×1
Основы 3D-графики
3D-объект
описывается набором полигонов (треугольников или четырёхугольников), текстурами (растровыми картами), материалами и освещением.
Рендеринг
— преобразование 3D-сцены в 2D-изображение.
🧊 Полигоны и меш
Меш
— набор вершин (vertices), рёбер (edges) и граней (faces). Чем больше полигонов — тем детальнее модель, но больше вычислений. High-poly → millions, low-poly → hundreds.
Модель человека: ~100 000 полигонов. Игровой персонаж: ~10 000. Фонтан: 500–2000.
🎨 Текстуры и материалы
Текстура
— растровое изображение, «обёрнутое» вокруг полигона.
UV-развёртка
— проекция 3D-поверхности на 2D для наложения текстур.
Нормаль-карта
— имитация рельефа без добавления полигонов.
Формат
Назначение
Тип
Примеры
OBJ
Геометрия (вершины, полигоны)
Текст
Простой обмен, 3D-печать
STL
Только геометрия поверхности
Текст/бинарный
3D-печать, CAD
FBX
Геометрия + анимация + материалы
Бинарный
Unity, Unreal, Maya
glTF / GLB
Web-ready 3D (JSON + бинарные буферы)
JSON / бинарный
Веб, Three.js, Blender
BLEND
Нативный формат Blender
Бинарный
Моделирование, рендер
DAE
Коллада — универсальный обмен
XML
Веб, игровые движки
Формула объёма (дискретизация, гл. 9.4)
Объём 3D-рендера в секунду:
I
frame
= X × Y × i × K
fps
Где i — глубина цвета, K — количество кадров в секунду. Для 4K (3840×2160), 24 бит, 60 fps: I = 3840×2160×24×60 ≈ 11.9 Гбит/с — именно поэтому нужны мощные GPU.
🎮
Интерактивный 3D-куб (Canvas)
Вращающийся куб. Используется матрица поворота и проекция 3D→2D. Каждая грань — полигон.
🎯
Мини-тест: 5 вопросов
XP: 0