Рубрика развивается при поддержке
Gamedev
Artyom Kaleev
6894

Как использовать частицы в пиксель-арте — советы новичкам Материал редакции

Опыт разработчиков Monster Sanctuary.

В закладки
Аудио

В играх частицы появились уже в эпоху 3D — на восьми- и шестнадцатибитных консолях разработчики их почти не рисовали. Зато после бума популярности инди-игр их можно всё чаще встретить в разных проектах: благодаря им графика выглядит приятнее и красочнее.

Разработчики партийной RPG с элементами метроидвании Monster Sanctuary в своём блоге на Imgur опубликовали полезные советы для начинающих художников о том, как лучше использовать частицы в пиксель-арте. Все примеры основаны на инструментарии Unity Engine, однако их можно применить и во многих других движках.

Не используйте размытие и градиент для частиц

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

Скорее всего, это связано с тем, что в Unity стандартная текстура для частицы — это размытый круг. Использовать его в пиксель-арте нет смысла.

Разработчики советуют брать в качестве основы другие текстуры — более «острые».

Отключите сглаживание

Убедитесь, что в настройках рендерера текстур для частиц отключено сглаживание — из-за него они будут выглядеть размытыми при масштабировании. В Unity за это отвечает настройка Filter Mode — следует выбрать опцию Point.

Используйте меньше оттенков цветов

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

В качестве примера разработчики предлагают использовать наложение слоёв с разными цветами.

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

Рендерите игру в низком разрешении

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

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

Разработчики отметили, что это скорее стилистическое решение — так можно и не делать. Главное — не масштабировать частицы слишком сильно, иначе это будет выбиваться из общего стиля.

Используйте короткий жизненный цикл для частиц

Чтобы частицы не успели надоесть игроку, стоит сделать так, чтобы они существовали меньше, а появлялись чаще. В Monster Sanctuary частицы «живут» около секунды.

Задайте динамику частицам

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

Один из хороших приёмов — это замедление скорости отображения некоторых частиц. К примеру, взрыв или всплеск — поначалу они кажутся быстрыми, но к концу жизненного цикла замедляется.

Добиться этого в Unity можно с помощью настройки Limit Velocity over Lifetime. Главное не задавать для минимальной скорости ноль — пусть к концу «жизни» частица будет ещё немного двигаться.

Используйте модуль sub-emmiters, чтобы создавать кластеры из частиц

Благодаря sub-emmiters некоторые частицы — например, дым — выглядят более органично и естественно. Вместо того, чтобы напрямую назначать места появления частиц, используется модуль, испускающий sub-emmiters, которые в свою очередь создают сами частицы.

Используйте движущиеся испускатели частиц

Так можно добиться крутых эффектов — например, при создании фаерболлов.

Также в Unity и многих других редакторах частиц есть возможность настроить их поведение так, чтобы они двигались по определённому заданному пути — к примеру, по параболе.

Находите нетипичное для частиц применение

Так, в Monster Sanctuary частицы придают уникальный вид некоторым мобам.

Minecraft — это моя жизнь
{ "author_name": "Artyom Kaleev", "author_type": "editor", "tags": ["\u043e\u0441\u043d\u043e\u0432\u044b","\u043e\u043f\u044b\u0442","\u0430\u0440\u0442"], "comments": 11, "likes": 123, "favorites": 313, "is_advertisement": false, "subsite_label": "gamedev", "id": 60735, "is_wide": false, "is_ugc": false, "date": "Thu, 25 Jul 2019 13:17:55 +0300", "is_special": false }
Разработка игр для PC, консолей
и мобильных платформ
Я готов!
0
11 комментариев
Популярные
По порядку
Написать комментарий...
8

Большое спасибо. Хоть я не фанат пиксель-арта, но мне очень даже понравилась графика в вашей игре.

Ответить
3

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

Ответить
0

Pixel perfect погуглите

Ответить
0

Спасибо

Ответить
0

всю игру зарендерили в самом низком разрешении

А можно узнать, как это сделать в юнити?

Ответить
1

Через Package Manager(или откуда-то из интернета) качаешь 2D Pixel Perfect. Раньше надо было свои бубны с рендер текстуркой делать.

Ответить
0

О, а эта игра у меня в "желаемом".

Ответить
0

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

Ответить
0

В идеале сама пуля является частицей

Ответить
0

как вы это себе представляете?

Ответить
0

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

Ответить

Прямой эфир

{ "jsPath": "/static/build/dtf.ru/specials/DeliveryCheats/js/all.min.js?v=05.02.2020", "cssPath": "/static/build/dtf.ru/specials/DeliveryCheats/styles/all.min.css?v=05.02.2020", "fontsPath": "https://fonts.googleapis.com/css?family=Roboto+Mono:400,700,700i&subset=cyrillic" }