{"id":3969,"url":"\/distributions\/3969\/click?bit=1&hash=48c68cd06f36b39a25459ccf1eb45b64c2d731fecbb5a11dd3f0aa328b271ec3","title":"\u041c\u0435\u0447\u0442\u0430\u043b\u0438 \u043f\u043e\u043f\u0440\u043e\u0431\u043e\u0432\u0430\u0442\u044c \u0441\u0435\u0431\u044f \u0432 UX-\u0434\u0438\u0437\u0430\u0439\u043d\u0435? \u0412\u043e\u0442 \u0432\u0430\u0448 \u0448\u0430\u043d\u0441","buttonText":"\u041f\u043e\u043f\u0440\u043e\u0431\u043e\u0432\u0430\u0442\u044c","imageUuid":"ec569b6e-3358-530c-a9e2-771b323df475","isPaidAndBannersEnabled":false}

Магия обмана: графические трюки, о которых вы не догадываетесь Статьи редакции

Самые интересные способы сохранить высокий FPS и не обидеть художников.

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

Блог Саймона содержит кучу интересных и не очевидных трюков, а мы выбрали самые яркие и показательные примеры.

Сферы в WarCraft 3 сделаны обычными спрайтами

Diablo 3: 2.5D деревья, крылья ангелов и «шарики» ресурсов

Если обратить внимание на растительность в мире Санктуария, то можно заметить, что к деревьям не применяются артефакты алиасинга. Они выглядят, словно нарисованы художником на холсте. Как Blizzard удалось добиться такого эффекта?

За счёт фиксированного угла камеры в Diablo 3 разработчики позволили себе не моделировать дерево целиком и использовали при его создании минимальное количество треугольников. Практически всё дерево состоит из спрайтов, которые позже очень остроумно распределяются на примитивный 3D-каркас.

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

Куда сложнее, однако, в Diablo 3 сделаны казалось бы тривиальные вещи. Саймон обращает внимание, сколь много времени и ресурсов Blizzard потратили на хрустальные шары маны и здоровья.

Саймону удалось вытащить из архивов игры развёртку «шарика».

Оказалось, что вместо затратных полигональных сфер художники Blizzard используют оптическую иллюзию. Вот что происходит, если наложить на развёртку шахматную текстуру.

Достаточно сравнить полусферу Саймона и подход Blizzard, дабы понять, сколько машинного времени удалось сэкономить американской компании на такой, казалось бы, ерунде.

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

В итоге игра рендерит очень красивый ресурсный «шар», который как не выглядит чуждо в контексте атмосферы игры, так и заметен во время практически любой схватки. При этом Blizzard не тратят ресурсы вашего железа на что попало.

Крылья ангелов в Diablo 3 тоже сделаны куда интереснее, чем кажется. Для их создания художники применяли сразу несколько техник модуляции текстур и деформации полигональной сетки. Плюс модулируемые текстуры накладывались сразу в несколько слоёв с применением хаков и масок, которые позволяли избегать артефактов.

За счёт такого сочетания разработчикам удалось сделать из такого набора текстур, альфа-каналов и масок.

Достаточно правдоподобные крылья.

Подсветка предметов в Zelda: Breath of the Wild на примере яблок

Достаточно тривиальный эффект из Breath of the Wild на самом деле является отличным примером того, как сотрудничество художников и технических спецов позволяет решать проблемы игрового дизайна. В Breath of the Wild очень много высокой травы, и разработчикам требовалось добиться максимальной заметности даже самых небольших предметов. Причём сделать это так, чтобы игровые ассеты не заслоняли собой сам эффект.

Решение проблемы, как всегда, было куда изящнее прямолинейного подхода. Эффект привязан не к самому объекту, а к его базовым координатам и может отображаться на возвышении от предмета исходя из условий окружения.

При этом «блик» сделан таким образом, что всегда смотрит на камеру немного ближе, чем лежит предмет. Это позволяет изящно избегать клиппинга («западания» эффекта в модель) и обеспечивает плавное исчезновение эффекта когда игрок подходит непосредственно к предмету.

«Грибные» трюки Fallout 4

Ядерный гриб в в Fallout 3 были сделан достаточно классическим образом, то есть честно. Художники Bethesda использовали полигональный каркас с искажением текстур. Давайте взглянем на последние секунды жизни Мегатонны.

И обратим внимание на искажения текстур на полигональной сетке.

В Fallout 4 применяется совершенно другой, менее «честный» подход. Взрывы в игре просчитаны заранее и позже наложены текстурой на слой частиц. Это позволяет делать красивые и правдоподобные взрывы, но при этом экономит машинное время.

Огненная Лара

Огонь в перезапуске Tomb Raider — доказательство того, что святая простота может решить многие проблемы даже на слабом железе. Сам эффект сделан классическим методом переходов текстуры.

Однако проблемы проявляются, когда мисс Крофт начинает дёргать рукой. В общем-то плоскую текстуру надо как-то подстроить под действия игрока.

На PS3 и Xbox 360 никакой речи о модных ныне частицах быть не могло, а потому Crystal Dynamics решили проблему вполне в духе игровой индустрии: тупо, но очень изящно. Спрайт был наложен на простую полигональную сетку в виде гармошки, которая динамически изгибалась в зависимости от действий Лары.

Не менее простой, но эффективный трюк применяется, когда игрок хочет заглянуть «за спрайт».

В этом случае 2D-огонь очень плавно превращается в 3D-эффект в зависимости от позиции игровой камеры.

Интерактивный интерфейс Doom 3

Классика id Software использует достаточно интересный подход к проектированию компьютерных интерфейсов внутри игры. Вместо созданных вручную текстур терминалы можно создавать с помощью специального скрипт-языка. Это позволяет изящно решить сразу несколько проблем.

Во-первых тексты генерирует сам движок и дизайнеры не грузят художников ненужной работой, а модеры могут легко создавать собственные надписи внутри терминалов.

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

Перед нами лишь малая часть интересных находок Саймона. Сейчас в его коллекции находится 67 статей разной степени сложности и полезности. И останавливаться в своём хобби, к счастью, он пока не намерен.

0
123 комментария
Написать комментарий...
Mikhail Kozlov

Блин, самый "вкусный" контент, на мой взгляд, это вот такие "лайв-хаки" от мира графики.

Ответить
Развернуть ветку
Alex Bulgakov

вкусной бывает только еда

Ответить
Развернуть ветку
10 комментариев
Влад Демин

Как говорится, если это тупо но это работает, то это не тупо.

Ответить
Развернуть ветку
Любить Спэйс
Ответить
Развернуть ветку
YamiE
Огненная Лара

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

Ответить
Развернуть ветку
Максим Ханукецкий
Автор

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

Ответить
Развернуть ветку
Партийный хот-дог

Комментарий недоступен

Ответить
Развернуть ветку
3 комментария
Елизар Михеев

просто коллижен-геометрия не везде наложена

Ответить
Развернуть ветку
Vitalii Dmitriev

Спасибо за перевод, побольше бы такого!
Но всё же:
1. Не шрейбт, а шрайбт
2. Это не фамилия, а название блога: Simon schreibt -> Саймон пишет (нем. schreiben -- писать).

Ответить
Развернуть ветку
Максим Ханукецкий
Автор

Внезапно. Поправили, спасибо.

Ответить
Развернуть ветку
dmnm

И если хозяин блога - немец, то тогда он все-таки Симон, а не Саймон

Ответить
Развернуть ветку
1 комментарий
Отличный теркин30см

Рано все эти варкрафты ушли в 3д. Хорошая спрайтовая графика практически не устаревает, тока добавляй новые разрешения: https://media.moddb.com/images/mods/1/26/25608/quick-battle-defending.jpg
В полном 3д такой замок нагнёт свежую видеокарту.

Ответить
Развернуть ветку
Dazzar

Есть и другая сторона монеты: 3D достаточно просто растянуть под любое существующее разрешение, тк сцена по-определению больше, чем влазит в экран пользователя, то спрайты надо именно перерисовывать в большем разрешении, ибо апскейл условной PNG-картинки в два раза и счетчик ебучих шакалов начинает зашкаливать.
Проще говоря: если тоже самый knights of honor запустить в 4k, то здания и юнитов придется разглядывать под микроскопом. Так что да, хорошее 2D не стареет, просто уменьшается)

Ответить
Развернуть ветку
2 комментария
lamurchik

Эм, не нагнет. Довольно простая геометрия и много места под детализацию чисто текстурками.

Ответить
Развернуть ветку
Аккаунт удален

Комментарий недоступен

Ответить
Развернуть ветку
1 комментарий
Alister

В те годы ты либо делаешь 3d, либо тебя не существует для рынка. Дикое время как со стороны разработки, так и со стороны потребителей. Истерию с 60 fps умножь на сто.

Ответить
Развернуть ветку
Denis Shiryaev

Есть классный канал у одного из создателей Соника и Микки под сегу, где он делится похожими вещами, рекомендую: https://youtu.be/nt-AxAqlrOo (и другие видео)

Ответить
Развернуть ветку
IMN

А я еще в 12 лет, когда WC3 только вышел, разглядывал эти сферы на башне магов и понял что они спрайтовые.)) У Близзов конечно, самые клевые спрайтовые эффекты.

Ответить
Развернуть ветку
Даниил Булаев

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

Ответить
Развернуть ветку
2 комментария
Аккаунт удален

Комментарий недоступен

Ответить
Развернуть ветку
Andrey Apanasik

В Disciples II всё спрайтами было сделано. Смотрится до сих пор неплохо.

Ответить
Развернуть ветку
15 комментариев
Аккаунт удален

Комментарий недоступен

Ответить
Развернуть ветку
3 комментария
Зеленый Кирилл

Напомнило трюк в A Link Betwen Worlds.

Ответить
Развернуть ветку
Аккаунт заморожен

Комментарий недоступен

Ответить
Развернуть ветку
2 комментария
Evgenyi V.Reshetnyak

Тем временем разработчики пубг решают проблемы с оптимизацией покупкой готовых моделей и текстур в магазине UE4..

Ответить
Развернуть ветку
lamurchik

Да вы надоели. Все, кроме самого топа типа близзард - используют готовые ассеты. Вообще все. А кто не использует - делает на аутосюрсе у тех же посонов, что работают под эти сторы.

Ответить
Развернуть ветку
Andrey Apanasik
Ответить
Развернуть ветку
Andrey Apanasik
Ответить
Развернуть ветку
2 комментария
Евгений Серегин

90% классных эффектов вообще делаются на основе иллюзии и обмана зрения. Тем и интересна эта работа :).
Ну и на тему крыльев Нефалема. Делал их, когда это еще не было мейнстримом :)

Ответить
Развернуть ветку
Максим Ханукецкий
Автор

Будешь смеяться, но в процессе написания и твой ролик смотрел на быстрой перемотке =)

Ответить
Развернуть ветку
2 комментария
This is Zabavon!

Мне кажется я стал понимать, зачем старина Кармак трёхмерный огонь на факелы пихал в первом Quake, а во втором объёмные грибы для взрывов. Просто мужик хотел ускорить наступление эры 3D-ускорителей, хотя думаю он чётко понимал, что спрайтовые эффекты будут выглядеть презентабельнее.

Ответить
Развернуть ветку
Макс Зарипов

Огонь, а не статья.

Ответить
Развернуть ветку
perfect_genius

Спрайтовый?

Ответить
Развернуть ветку
Аккаунт удален

Комментарий недоступен

Ответить
Развернуть ветку
Стандартный Мурод

Лучше по ссылке выше в комментариях на хабре почитай, там поинтереснее рассказано

Ответить
Развернуть ветку
Юлия Перевозникова

Роскошный материал. Спасибо!

Ответить
Развернуть ветку
V Vern

Про упрощенные модели деревьев в Diablo 3 понятно. Но я так и не понял, почему на деревья не распространяются артефакты алиасинга?

Ответить
Развернуть ветку
Стандартный Мурод
Ответить
Развернуть ветку
Nicholas Lagunov

Экономия времени, сил и денег. В Диабло ты не будешь любоваться пейзажем, фарм не ждёт)

Ответить
Развернуть ветку
4 комментария
Gast Kami

Сейчас оптимизацией практически не занимаются. Отсюда и конские требования к железу у инди-шлака. Про ааа-проекты даже говорить не приходится

Ответить
Развернуть ветку
Партийный хот-дог

Комментарий недоступен

Ответить
Развернуть ветку
Неудачный Денис

Всё же студия студии рознь. Близзард стараются оптимизировать, чтобы их игру даже самое убожество тащило хотя бы на минималках. Это сильно расширяет аудиторию продаж.

Ответить
Развернуть ветку
1 комментарий
Юлия Перевозникова

Спасибо за материал. Очень круто.

Вот мне интересно, неужели честная 3д модель жрёт больше ресурсов, чем всякие эффекты прозрачности и кучи текстур? Ну правда, на 3,5 полигонов больше это критично? Если бы вот эта сфера магии в Дьябло 3 была честной моделью. Сколько себя помню на работе говорили по возможности альфу не юзать, а делать геометрией. Правда то для мобилок.

Ответить
Развернуть ветку
Евгений Серегин

Не всегда критерием бывает оптимизация. На примере той же сферы ХП или маны можно сказать, что на плоский объект проще применять все эти сдвиги текстур и масок. Не возникает перекосов. Да и часто UI элементы в силу требований движка должны являться 2д элементами. Так что нет смысла городить огород из полноценного 3д там, где это проще сделать в 2д с наименьшими проблемами и улучшенной оптимизацией.

Ответить
Развернуть ветку
Роман Лесной

Эффекты прозрачности и текстуры - это 2Д. Разумеется, это жрёт на порядок больше ресурсов.

Поэтому, к примеру, вместо детализованного рельефа кирпичей пользуются бампом и картами нормалей.

Ответить
Развернуть ветку
3 комментария

Комментарий удален модератором

Развернуть ветку
Неудачный Денис

Тут не все моделлеры-аниматоры с десятилетним стажем. Ты ведь тоже не расскажешь, какой алгоритм сортировки лучше и в каких ситуациях уместнее считать по монте-карло, а когда формулой Бернулли.

Ответить
Развернуть ветку
Олег Архипов

О, как раз вчера послушал выпуск kdi по техническим художникам, где как раз этот блог упоминается :)

Ответить
Развернуть ветку
Eight Bit
Сферы в WarCraft 3 сделаны обычными спрайтами

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

Ответить
Развернуть ветку
Andrey Radikov

спрайтовые вторые герои - лучшие! )

Ответить
Развернуть ветку
Слабый хичхакер
Если обратить внимание на растительность в мире Санктуария, то можно заметить, что к деревьям не применяются артефакты алиасинга. Они выглядят, словно нарисованы художником на холсте. Как Blizzard удалось добиться такого эффекта?

Только сегодня включил на макс алайсинг в новом сезоне и заметил это, думал что у меня что-то не так уже с версией или железом)

За упоминание W3 +
Вопрос лишь в том, получим ли мы такие же хитрости в следующей части и будет ли она когда нибудь ?
А вообще - очень крутые детали, про огонь и Лару особенно порадовало.

Ответить
Развернуть ветку
Roman Slobodyanyuk

Ребят, может подскажет кто, не хочу тему новую создавать: как вставить код сниппет в статью? (пробовал github gist — не работает)

Ответить
Развернуть ветку
Партийный хот-дог

Комментарий недоступен

Ответить
Развернуть ветку
артуркультур
Ответить
Развернуть ветку
Sasha Gladov

Таки за эти костыли на костылях я плачу?

Ответить
Развернуть ветку
Tim Shagal

Не плачьте

Ответить
Развернуть ветку
Alister

Да. Иначе бы платил долларов 200+ за игру.

Ответить
Развернуть ветку
1 комментарий
Аккаунт удален

Комментарий недоступен

Ответить
Развернуть ветку
Сергей Токарев

я в Diablo 3 играл, но не понял, почему ресурсный шар не был сделан просто анимированным спрайтом?

Кто скажет, зачем там все это моделирование, там какой-то функционал есть, которого нельзя добиться спрайтом?

Ответить
Развернуть ветку
Роман Лесной

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

Ответить
Развернуть ветку
2 комментария
Евгений Серегин

В таком видном месте спрайт будет очевидной халтурой. Эти сферы видны 100% времени и они должны быть идеальными. Спрайт никогда не даст визуального превосходства над 3д обманкой. Ибо проблемы с апскейлом при смене разрешения игры. Куча вариаций спрайта для разных ситуаций, если Вы имеете ввиду анимированную покадровую секвенцию спрайтов. Ну невозможно задать кривизну сферы на спрайте. Опять начинаются танцы с бубном, доп скриптами, плагинами, навороченными шейдерами и тд. В данном случае плоский меш с осферизованной разверткой - идеальный вариант. Сам часто где пользуюсь такими способом в эффектах. Плюс этот меш можно применять и на другие сферы (мана, ярость, спирит и тд). В то время, как спрайт надо заново перерисовывать. Короче, 3д просто оказалось банально эффективнее в этом случае.

Ответить
Развернуть ветку
Михаил Лапин

Я то все думал почему огонь себя так странно ведёт в Ларе

Ответить
Развернуть ветку
Аккаунт удален

Комментарий недоступен

Ответить
Развернуть ветку
Игорь Помялов

Давайте ещё!)

Ответить
Развернуть ветку
realavt

Довольно занятные сочетания трехмерных моделей и спрайтов были в Super Mario 64 (1996), где у ходячих бомб было спрайтовое "тело", но при этом трехмерные ноги, глаза и шапки. А также у гонки S.C.A.R.S. (1998), где у трехмерных автомобилей были спрайтовые колеса, отрендеренные с нескольких ракурсов.

Ответить
Развернуть ветку
тимур

в дум3 интерфейсы игры и на экранах абсолютно одинаковые. и сделаны на томже диалекте что и квейк3

Ответить
Развернуть ветку
Иван Чайка

Клево :)

Ответить
Развернуть ветку
Sam Newberry

Когда вышла локализованная версия Doom 3, некоторые офигевали - надо же, смотрите, даже все надписи на текстурах перерисованы на русский, это ж сколько труда вложено! Оказывается, как минимум с терминалами локализаторам много возиться не пришлось.

Ответить
Развернуть ветку
Сергей Юркин

я такой экстаз получил от надписей в Старкрафте)

Ответить
Развернуть ветку
1 комментарий
Читать все 123 комментария
null