Проекции графики

Материал из Posmotre.li
Перейти к: навигация, поиск
Типы проекций.png

Проекция графики — способ отобразить трёхмерный игровой мир на плоском экране.

Проекции бывают:

Необоснованный разнобой проекций — известная ошибка игровых художников. В одной из мобильных игр автор этих строк (работавший утилитчиком и консультантом по движку) насчитал четыре разных проекции: плоскую, «три четверти» снизу, «три четверти» сверху и диметрическую.

Содержание

[править] Параллельные проекции (2D)

Параллельные проекции называются «2D» потому, что проекция предмета не зависит от его координат. Поэтому изображения можно подготовить заранее, в виде двухмерных спрайтов. Но в этом же и засада — нужны дополнительные визуальные подсказки, где по оси Z объект (это замечательно обыграно в Fez). Из собственного опыта: в 2006-м разработали для мобильников (на Java ME) несложную 3D-головоломку — шарик прыгает по конструкции из кубиков, висящей в космосе. Но только для тех, которые поддерживают 3D (их немного, наобум некоторые Nokia и Sony Ericsson). Решили сделать такое же для 2D-мобильников — в аксонометрии. Написали прототип и бросили — неиграбельно, не поймёшь, как стоят эти кубики.

[править] Ортогональные

В ортогональных (или прямоугольных) проекциях направление проецирования перпендикулярно экрану.

[править] Плоская

Большинство двухмерных игр используют именно плоскую проекцию. На скриншоте — Super Mario Bros.

Самая тупая из проекций — уровень выглядит как на чертеже в разрезе. Но заодно и самая «экономная» и потому применяется там, где надо блеснуть разнообразием ландшафтов или сложным геймплеем, а графические красоты приберечь.

[править] «Три четверти»

Проекция «три четверти». Слева — косой вариант, справа — прямой. Различия, как видно, невелики. Для тех, кто в танке: косоту смотрят не по кубику, а по линиям, проецирующим его на экран.

Другими словами — «в фас и немного сверху».

Трудно сказать, чем считать проекцию «три четверти» — косой или ортогональной. Ортогональная проекция отличается от косой сжатым масштабом по оси Y. Но всё-таки разница между тем и другим невелика[1] — так что пускай будет «условно прямая».

Проекцией «три четверти» известен, например, WarCraft II. Была очень популярна в ранних jRPG эпохи NES и SNES, например, Final Fantasy c I по VI; сейчас её использует инструментарий для создания jRPG серии RPG Maker, продолжающий те традиции.

[править] Изометрическая

Изометрическая проекция
X-COM: UFO Defense; изометрическая проекция с ромбическими плитками. В оригинале использовался режим 320×200 с неквадратным пикселем, и картинка не была так безжалостно сплющена по вертикали.

Аксонометрической называется параллельная проекция, у которой все три оси переходят в разные прямые. Изометрическая проекция — аксонометрическая с одинаковым масштабом по всем осям. Из всех аксонометрических проекций особенно важна — и в черчении, и в играх — прямоугольная изометрическая (зачастую просто «изометрическая»): проектирующие прямые параллельны вектору (1, 1, 1).

Ось Z в изометрии смотрит на 12 часов (вертикально вверх), остальные две — на 4 и 8 часов (на 30° от горизонтали). Впрочем, часто используют «почти изометрию» со ступенчатыми линиями 2:1 — это даёт угол arctg 0,5 ≈ 26,57°.

Интересно: в режимах 320×200 пиксель вытянут по вертикали. Это идеальное соотношение для изометрии: и числа круглые, и соотношение 2:1 даёт угол 30,96°[2]. Скорее всего, так вышло ненамеренно, в попытках сесть на два стула — и пристойный текст, и выход на NTSC (да, CGA имел выход на NTSC).

Изометрические игры, в свою очередь, делятся на игры с ромбическими плитками (X-COM: UFO Defense) и на игры с квадратными плитками (StarCraft). В целом считается, что ромбические плитки хороши для автоматической генерации уровня (X-COM: UFO Defense, Diablo) и для явно изометрической механики (X-COM: UFO Defense, Knight Lore, Spindizzy), квадратные — для реалистичного вида при редактировании вручную. Плюс расходуют меньше памяти.

[править] Прочие аксонометрические

Nether Earth. Если быть буквоедом, это косая проекция, но «косота» мало заметна.

Прочие ортогональные аксонометрические проекции встречаются крайне редко — обычно в головоломках и стратегиях.

[править] Косые

В косых проекциях направление проецирования — под углом к экрану.

[править] Диметрическая

Prince of Persia — игра в диметрической проекции. Снова-таки, не обращайте внимание на сжатую картинку: использовался всё тот же режим 320×200 с неквадратным пикселем. И обратите внимание на Принца в плоской проекции.

Если изометрическая подразумевает одинаковые масштабы по всем осям, в диметрической два масштаба — один по двум осям, и другой по третьей. Диметрическая проекция бывает фронтальной и ортогональной. Если ортогональная используется крайне редко, то фронтальная диметрическая (более простая, но косая[3]) широко применяется в двухмерных играх, как в горизонтальном разрезе, так и в вертикальном, давая суррогат трёхмерности. Масштаб по третьей оси — 50 %.

Персонажей, бегающих по уровню, обычно в диметрию не переводят, а рисуют в традиционной плоской проекции (или в «три четверти»).

[править] Планиметрическая

Планиметрическая проекция

Та же диметрическая, но повёрнутая на 135°. Ею пользуются очень немногие игры, в основном jRPG и стратегии. На приставках с «лежачим» пикселем проекция становится ближе к ортогональной, на компьютерах со «стоячим»[4] — наоборот, портится. В связи с особенностями нашего зрения масштаб по оси Z может быть как классические 50 %, так и поменьше.

[править] Перспективные

В перспективных проекциях, как уже говорилось, проецирующие прямые пересекаются в «объективе» виртуальной камеры.

Поскольку экран ограничен, у перспективной проекции есть два важных параметра — фокусное расстояние (в «условных миллиметрах») и угол зрения (от 0 до 180°). Они взаимосвязаны: между углом зрения φ и фокусным расстоянием d соотношение

d = ½ w ctg (φ/2),

где w — ширина стандартного фотоматериала (36 мм). На старых трубчатых мониторах угол зрения ставят 90° или чуть меньше, современные (2014) 16:10 могут отобразить без дискомфорта до 120°.

И к программированию видео на движке применяются те же правила, что и к обычной фото- и видеосъёмке: так, говорящую голову «снимают» фокусным расстоянием от 70 до 140 мм.

[править] Трёхточечная (3D)

Почему трёхточечная
Альбрехт Дюрер. «Построение перспективы лютни». Самое настоящее low-tech 3D.

Собственно, настоящая «трёхмерная» проекция называется трёхточечной, с лёгкой руки художников, которые где-то за рамкой картины выбирают три точки схода и делают, чтобы продолжения линий пересекались в этих трёх точках. Разумеется, компьютер никаких точек схода не расставляет — они получаются автоматически, если честно прокрутить 3D-расчёты.

3D использовалось в серии Final Fantasy эпохи PSX (VII—IX) для трехмерных моделей героев, монстров и NPC, а также фонов в боевых сценах; для всего остального использовались нарисованные в той же проекции статичные 2D-задники. Начиная с десятки, серия стала полностью трёхмерной и лишилась прибитой гвоздями камеры.

Сейчас, с засильем 3D, часто делают игры в перспективных проекциях, похожих на традиционные плоскую или изометрическую: WarCraft III, StarCraft II… Хотя часто это приводит к противной дилемме: либо нужно показывать левую и правую границу поля, либо смириться, что доступ к объектам у этой границы будет затруднён (StarCraft II: Wings of Liberty, миссия «В кромешной тьме»).

«Первая попавшаяся» трёхмерная игра (BioShock)


[править] Двухточечная (2,5D)

Двухточечная перспектива

Если картинная плоскость вертикальна, любая вертикальная прямая останется вертикальной (остаются только две точки схода). Опыт художников показывает, что наш мозг успешно корректирует вертикальную перспективу, и здания и интерьеры, показанные в статике в трёхточечной проекции, смотрятся плохо. Поэтому на картинах делают только две точки схода, а вертикальные линии оставляют вертикальными. Фотографы, снимающие здания, корректируют перспективу фотошопом или шифт-объективом.

А чем она интересна для нас, геймеров? А тем, что в годы с 1992 по 1996 она процветала в 3D-играх. Wolfenstein 3D, Doom, Duke Nukem 3D и многие другие трёхмерные игры того времени использовали двухточечную проекцию и рисовали стены по столбцам, а полы — по строкам.

Основная статья: Псевдотрёхмерность


[править] Одноточечная

Atic Atac — здание в одноточечной проекции (для экономии памяти изрядно «поломанной»), а персонажи внезапно с видом сбоку.

Последняя разновидность перспективной проекции — когда картинной плоскости параллельны аж два ребра (то есть, одна грань). Раз две точки схода удалены в бесконечность, остаётся только одна — в направлении взгляда (обычно, но не обязательно, в центре картины).

В 2D-играх одноточечной перспективой делают только внутренности зданий. Персонажей и объекты обычно рисуют в проекции «три четверти» или боковой — даже если взгляд сверху вниз. Естественно, перспектива пригодна в основном для поэкранного фона; чтобы на прокручивающемся фоне артефакты не были заметны, художнику нужно хорошее чувство перспективы.

Современные ремейки классических игр (Prince of Persia Classic, Duck Tales Remastered) переводят в 3D с одноточечной проекцией.

Ещё примеры.

Ещё раз.

Проекция Для художника Для компьютера Жанры
Трёхточечная Три точки схода Настоящее 3D Все
Двухточечная Две точки схода Картинная плоскость параллельна одной из осей 3D-шутеры 90-х
Одноточечная Одна точка схода Картинная плоскость параллельна двум осям Поэкранные аркады 80-х
Современные платформеры


[править] Ломаная перспектива

Ломаная проекция в Super Contra. Стены — попытались сделать какую-то перспективу, края платформ — «три четверти», узор на платформе — диметрия.

В ломаной проекции вообще нет проецирующих прямых: одни объекты проецируются так, другие этак. Это неплохо разнообразит 2D-игру, однако требует от художника опыта: нужно чувствовать перспективу и понимать габариты экрана, знать, что игрок увидит часто, что — редко, а что — вообще не увидит.

Причин «поломать» проекцию много.

Обратная перспектива, распространённая в средневековой иллюстрации и иконописи, тоже ломаная. Изредка её используют и в играх — для построек намного больших, чем экран. В жизни подобие обратной перспективы встречается, если какой-нибудь объект находится в сантиметрах от носа — между глаз.

[править] Параллаксная (многослойная) прокрутка

(link)

Кто не играл в «Аладдина» на «сеге»? Обратите внимание на барханы и облака на заднем плане — это один слой, но с фирменной «полосатой» прокруткой.

Параллакс — это видимое смещение объектов друг относительно друга, когда смещается зритель. Самый впечатляющий параллакс будет, если посмотреть из окна автобуса или поезда. Следующий наш метод моделирует это явление.

Устроена параллаксная прокрутка несложно, этот метод освоили ещё мультипликаторы. Берём несколько слоёв (все, кроме нижнего — с прозрачными «дырками») и перемещаем их с разной скоростью, получается неплохая иллюзия перспективы. Сами же слои редко делают перспективными — обычно в какой-нибудь из параллельных проекций.

Super Nintendo (он же SNES) позволял до четырёх слоёв, Sega Megadrive (она же Sega Genesis) — всего два, но могла независимо прокручивать полосы фона[6]. На ПК многослойная прокрутка возможна, начиная с 386-х машин[7]. Из JavaME-телефонов (во времена их максимального распространения, середина 2000-х) многослойную прокрутку поддерживали только самые шустрые[8].

В квестах фирмы Daedalic Entertainment (The Whispered World, Deponia) таких слоёв может быть более десятка. Правда, это уже 2000-е годы…

В 3D параллакс получается автоматически. Однако, чтобы не рисовать много далёких объектов, используют так называемый скайбокс — большой задник, малоподвижный по сравнению со всеми остальными игровыми объектами. Старые FPS наподобие Doom заливали экран особой текстурой, когда движок попадал на «небесные» стены. В современных играх скайбокс — очень отдалённый, но существующий в геометрии уровней задник.

[править] Нелинейные искажения

Двухмерные игры искажают крайне редко, в основном как спецэффект. В трёхмерных же…

С развитием шейдеров стали делать локальные искажения, связанные с преломлением в воде или перегретом воздухе — но это уже не проекция.

[править] Трактат о неквадратном пикселе

Выше много раз говорилось: пиксель неквадратный, должно быть вытянуто (или, наоборот, приплюснуто) по вертикали. А почему оно так? Вкратце: ориентация на телевизор и ориентация на текст.

Давайте посмотрим несколько распространённых на то время машин (пропорция =1 — квадратный пиксель, >1 — стоячий пиксель, <1 — лежачий).[9]

Машина/видеорежим Назначение Вывод на ТВ Разрешение Пропорция
ZX Spectrum Бытовой компьютер PAL 256×192 1
BBC Micro режим 1 Бытовой/учебный комп. PAL 320×256 0,94
BBC Micro режим 0 PAL 640×256 1,88
IBM CGA/VGA Деловой компьютер NTSC (CGA) 320×200 1,2
IBM EGA Нет 640×350 1,37
IBM VGA (16 цветов) Нет 640×480 1
IBM CGA (текстовый) NTSC 640×200 2,4
IBM VGA (текстовый) Нет 720×400 1,35
Apple Macintosh Издательский компьютер Нет 512×342 1
Amiga HAM (4096 цветов) Бытовой компьютер PAL[10] 320×256 0,94
Amiga (16 цветов) PAL[10] 640×256 1,88
Nintendo NES/Dendy Игровая приставка NTSC[11] 256×240 0,8
Sega Genesis/Megadrive Игровая приставка NTSC[11] 320×224 1
Nintendo SNES Игровая приставка NTSC[11] 256×224 0,8

В PAL- и SÉCAM-машинах около 256 строк, в NTSC- — начиная с 200: одна строка пикселей — это две строки телевизионной развёртки. Горизонтальное же разрешение — столько, сколько вытягивает техника, обычно поменьше, потому и лежачий пиксель. Sega с квадратным пикселем выглядит «монстром» на фоне других машин. К тому же у телевизора развёртка чересстрочная и пиксельное тонирование будет адски полыхать — поэтому в полное телевизионное разрешение вышли уже тогда, когда truecolor-режимы сделали эти «изыски» ненужными (PlayStation, 1995).

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

А что же Macintosh, явно выбивающийся из нашей таблицы? Кинескоп у него обычный, 4:3. Но он намеренно не использовал полную площадь трубки, чтобы пиксель был в точности квадратный, а плотность была 72 пикселя на дюйм — для удобства настольного издательства. Впоследствии привязка к 72 ppi[12] сильно ударила по Apple (в Windows, например, принято 96 ppi, но не столь жёстко[13]) — но это уже середина 1990-х.[14].

Техническое отступление. Развёртка — это процесс управления электронным лучом приёмной телевизионной трубки (кинескопа). Луч строка за строкой проходит по всему экрану, строя изображение. Развёртка бывает построчной, или прогрессивной (каждый кадр развёртываются все строки одна за другой), и чересстрочной (первый полукадр развёртываются строки 1, 3, 5, 7 и т. д., второй полукадр — 2, 4, 6, 8…).

[править] Примечания

  1. Если быть точным, cos α, который даже для 30° будет 0,86. Малая грань уже 0,5 — а большая всё ещё 0,86!
  2. = arctg[ 0,5·320·3 / (200·4) ]. Коэффициенты 3 и 4 — из соотношения сторон экрана 4:3.
  3. Кто чертил: ось X, которая во фронтальной проекции горизонтальная, в ортогональной наклонена на 7°.
  4. Конечно, имеются в виду приставки и компьютеры тех времён (начало 90-х). 640×480 VGA, 800×600 SVGA и всё, что появилось позднее — это белые и пушистые квадратные пиксели.
  5. Анимация, когда персонаж состоит из плоских сочленённых деталей, как картонная кукла. Детали могут быть нежёсткими и деформироваться (как в портретах Dust: An Elysian Tail).
  6. По поводу того, чем приставки отличаются от ПК: статья, перевод
  7. Скроллинг был и на «двойках» (Golden Axe), но делался он хитрым перепрограммированием VGA по рецептам небезызвестного Майкла Абраша и не позволял «дыр». Другими словами, однослойный. А на полную перерисовку экрана 286-м не хватало пропускной способности шины.
  8. То же самое: особым образом забуферизировав фон, можно наладить очень быструю прокрутку, даже на Samsung C100 дававшую ≈8 fps — но без дыр.
  9. Методика подсчёта: 0,75·ширина/высота. Для всех японских NTSC-приставок берётся высота 240 (приставкам нужно изображение без рамки, а полный NTSC-растр составляет 483 строки). Об Apple см. в тексте.
  10. 10,0 10,1 В NTSC-версиях «Амиги» разрешение ниже.
  11. 11,0 11,1 11,2 Впоследствии появились и PAL-версии с меньшими вылетами изображения (телевизионный термин, часть телесигнала, скрытая за пределами экрана).
  12. Pixels per inch, пикселей на дюйм.
  13. Хотя программирование под большие PPI — такой ещё ад, не зря в Windows 7 придумали виртуализацию PPI (программа должна сказать: «Я поддерживаю высокую плотность пикселей», иначе Windows её отрендерит на стандартной и растянет). Но хотя бы разработчики крупного ПО этот ад знают и проходят.
  14. Ководство, § 70. Разрешение экранов. И немного о происхождении 72 точек на дюйм.
Личные инструменты
Пространства имён
Варианты
Действия
Навигация
Инструменты