Как делать простые анимации строительства в стратегических играх

в 18:08, , рубрики: game development, анимация строительства, изометрия, никто не читает теги, Работа с анимацией и 3D-графикой, стратегические игры

Во многих типах игр, не только стратегических, у вас есть участок земли, и на нём нужно что-то строить. Знакомая схема, не правда ли?

image

Как только вы перетаскиваете постройку из «магазина» на участок, она некоторое время строится. Обычно в это время там видна одна картинка, похожая на стройплощадку. Чтобы сэкономить память и бюджет, во многих играх нарисовано три таких «стройплощадки», под разные здания: маленькая, средняя и большая. Как только строительство закончено, стройплощадка превращается в готовое здание.

Но что, если вы хотите более тонкие анимации, чтобы было видно, как здание постепенно растёт к небу?

Сейчас большинство аксонометрических[1] зданий — картинки, предварительно отрендеренные из 3D. Если, например, нам нужны 5 кадров анимации, значит, надо смоделировать пять стадий готовности, а затем отрендерить. Да, таким способом затратно.

Наша компания сделала для клиента около 40 таких пятикадровых анимаций. Мы поступили проще, потратив несколько дней на всё. Затраты совсем небольшие, и качество не страдает. Давайте посмотрим, как это у нас получилось.

Шаг первый. Делаем стройматериалы.

Сначала надо сделать в 3D много разных стройматериалов — самых разных, какие можно придумать. Стены, колонны, балки, плиты — как на этой картинке.

image

Эти стройматериалы надо отрендерить в 2D-картинку. Нечего и говорить: их надо рендерить с тем же углом камеры и освещением, что и готовые здания.

Всё должно быть в двух экземплярах — по осям нашей аксонометрической карты.

image

А теперь соберём все стройматериалы в один большой PSD, по предмету на слой.

Шаг второй. Делаем анимацию.

Допустим, нам нужно построить небольшую гостиницу. Для начала рендерим гостиницу обычным образом.

image

Дальнейшую работу ведём в Photoshop’е. Нам нужна анимация на 5 кадров. Значит, на каждом кадре стираем часть здания в соответствии со степенью готовности.

Как делать простые анимации строительства в стратегических играх - 5

То, что мы стёрли, заполняем стройматериалами, полученными на первом шаге.

Как делать простые анимации строительства в стратегических играх - 6

Расставляйте стройматериалы в соответствии с устройством здания, чтобы смотрелось правдоподобно. Например, если строится кинотеатр, в середине надо сделать большой зал.

Как делать простые анимации строительства в стратегических играх - 7

Первый кадр — это просто план на земле. Последний — собственно здание. Готово!

image

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

image

Знаю, получилось немного мультяшно, но это же для игр, верно?

image


[1] В оригинале «изометрических». Но мы-то видим не изометрию, а нечто другое — поэтому пишу «аксонометрия».

Автор: Mercury13

Источник

* - обязательные к заполнению поля


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js