На эффектах у маленьких команд заканчивается время: искра от удара, лечение, подбор монеты, облачко пыли — и каждому нужна своя анимация. Каждый эффект здесь — это небольшая программа, поэтому он рендерится в настоящем пиксельном разрешении без размытия, а вы можете сменить сид ради вариации, цветовую рампу ради новой стихии (синий огонь, зелёный яд) и частоту кадров под свою игру. Эффекты взяты из pixelfx, библиотеки под лицензией MIT, поэтому экспорт можно использовать в коммерческих играх.
Как пользоваться инструментом «Генератор пиксельных VFX»
- Листайте категории (огонь, взрывы, вода, лёд, молнии, удары, магия, UI, подбор предметов и другие) или ищите по названию. Миниатюры рендерятся по мере прокрутки.
- Кликните по эффекту, чтобы отрендерить его. Превью проигрывается с выбранной частотой кадров.
- Бросьте сид, чтобы получить вариацию с тем же таймингом, и выберите цветовую рампу для перекраски.
- Отразите или поверните эффект, обрежьте пустой холст и масштабируйте в 1×–4×.
- Экспортируйте PNG-лист с данными для Aseprite, Phaser, Godot или CSS, GIF или ZIP со всем сразу и отдельными кадрами.
Что вы получаете
- Прозрачный PNG спрайт-лист только с эффектом, в настоящем пиксельном размере.
- Данные кадров в виде Aseprite JSON, Phaser/TexturePacker JSON, Godot 4 SpriteFrames, CSS или настроек Unity.
- GIF и ZIP со всеми форматами и отдельными кадрами.
С какими движками работает
- Разовые эффекты (удары, взрывы) должны проигрываться один раз и удаляться; циклические (огонь, ауры) — зацикливаться. На странице указано, к какому типу относится каждый эффект.
- Свечение, похожее на аддитивное, уже «впечено» в цвета эффектов, поэтому они работают с обычным режимом смешивания по альфе в любом движке.
Советы из практики геймдева
- Рендерьте с частотой кадров вашей игры. 12–15 fps подходит для большинства пиксельных анимаций и сохраняет листы маленькими.
- Используйте одну рампу для семейства эффектов (все ледяные навыки, все ядовитые), чтобы игрок запомнил цвет.
- Поворачивайте снаряды и разрезы шагами по 90° здесь, а не в движке, чтобы пиксели оставались на сетке.
- Обрезайте холст, но учитывайте, что точка привязки эффекта сдвигается вместе с обрезкой. Размещайте его в движке по центру снизу или по центру.
Сценарии использования
- Искры от ударов, разрезы, взрывы и облачка смерти для экшен-игр.
- Эффекты заклинаний для навыков в RPG с цветовыми вариантами для каждой стихии.
- Подбор предметов, россыпи монет, повышение уровня и UI-украшения.
- Циклы погоды и атмосферы: дождь, снег, светлячки, падающие листья.
Вопросы и ответы
Можно использовать эти эффекты в коммерческой игре?
Да. Эффекты взяты из pixelfx, выпущенной под лицензией MIT. Сделанный здесь экспорт можно использовать в коммерческих проектах. Если вы распространяете сам код эффектов, сохраните уведомление о лицензии.
Сколько всего эффектов?
244 в 21 категории: приёмы, огонь, взрывы, вода, лёд, молнии, sci-fi, ближний бой, удары, снаряды, появление и смерть, тайная магия, свет, тьма, статусы, природа, погода, UI, подбор предметов, переходы и живность.
Что делает сид?
Эффекты с частицами используют сид генератора случайных чисел. Один и тот же сид всегда даёт одну и ту же анимацию, другой сид — вариацию с тем же таймингом и стилем.
Почему некоторые эффекты нельзя перекрасить?
Несколько эффектов используют фиксированные цвета, которые являются частью их дизайна. Экспортируйте их и перекрасьте в «Замене палитры».
Что-нибудь рендерится на сервере?
Нет. Эффекты рендерятся в браузере, а лист собирается на вашем устройстве.
Можно получить эффект, которого нет в списке?
ИИ-генератор на этом сайте умеет рисовать собственные спрайты и анимации по промпту и экспортирует в те же форматы листов.