Генератор спрайт-листов
Объединяйте изображения в спрайт-листы с перетаскиванием для сортировки, сеткой, отступами, режимами масштаба. Экспорт в PNG/WebP/JPG с JSON-атласом для игровых движков и CSS.
Что такое спрайт-лист и зачем его использовать?
Спрайт-лист — это один файл изображения, содержащий несколько меньших картинок (спрайтов), расположенных в сетке. Использование спрайт-листов уменьшает HTTP-запросы, улучшает производительность загрузки страницы и делает рендеринг игр более эффективным.
Какие форматы изображений поддерживаются?
Вы можете загружать изображения PNG, JPG, GIF, SVG и WebP. Инструмент поддерживает пакетную загрузку и вставку из буфера обмена (Ctrl+V) для быстрого рабочего процесса.
Какие форматы экспорта доступны?
Экспортируйте спрайт-листы как PNG (с прозрачностью), WebP (современный формат с меньшим размером файла) или JPG (лучше для фотографий без прозрачности). Выбирайте в зависимости от требований вашей платформы.
Как изменить порядок изображений в спрайт-листе?
Перетащите миниатюры изображений, чтобы изменить их порядок в спрайт-листе. Вы также можете вставлять изображения напрямую из буфера обмена с помощью Ctrl+V.
Что такое данные JSON-атласа и какие движки их поддерживают?
Данные JSON-атласа содержат информацию о позиции, размере и кадре каждого спрайта. Они совместимы с популярными игровыми движками, такими как Phaser, PixiJS, Unity, Cocos2d и многими другими, для автоматического извлечения спрайтов.
Какие существуют режимы масштабирования?
Режим Вписать сохраняет пропорции. Заполнить покрывает ячейку и обрезает. Растянуть деформирует для заполнения.
Поддерживает ли инструмент прозрачность?
Да, PNG и WebP сохраняют прозрачность. Также можно задать цвет фона, что полезно для экспортов JPG, которые не поддерживают прозрачность.
Как отступы влияют на спрайт-лист?
Отступы добавляют пространство между отдельными спрайтами в листе, предотвращая визуальное просачивание при выборке текстур. Это особенно важно для игровых движков, использующих линейную фильтрацию.
Могу ли я использовать спрайт-листы для CSS?
Да, спрайт-листы отлично работают для CSS-спрайтов. Данные JSON-атласа могут использоваться для генерации правил CSS background-position, уменьшая HTTP-запросы и улучшая производительность загрузки страницы.
Каковы лучшие практики для размеров спрайт-листов?
Сохраняйте размеры как степени двойки (256x256, 512x512, 1024x1024) для оптимальной обработки текстур GPU. Большинство игровых движков предпочитают эти размеры для лучшей производительности.
Как спрайт-листы улучшают производительность игр?
Спрайт-листы уменьшают вызовы отрисовки, объединяя несколько спрайтов в одну текстуру. Это минимизирует изменения состояния GPU, снижает нагрузку на память и обеспечивает более эффективный рендеринг.
В чем разница между спрайт-листами и атласами текстур?
Спрайт-листы обычно организуют кадры в равномерной сетке, тогда как атласы текстур могут более эффективно упаковывать спрайты неправильной формы, используя алгоритмы, такие как bin packing.