Анимация пиксель-арта онлайн
Оживляйте спрайты покадрово: калька (onion skin), переставляемая раскадровка, общие фоновые слои и экспорт в GIF или спрайт-лист в один клик.
Turn Pictures Into Pixel Art
Создавайте пиксель-арт из своих картинок за секунды. Редактируйте каждый пиксель, анимируйте и скачивайте результат.
🔒 Ваши картинки никогда не покидают устройство. Всё работает в вашем браузере.
Sakura
Сделано в PixiMelon · Загрузите. Пикселизируйте. Редактируйте. Анимируйте. Скачайте.
Превратите картинку в пиксель-арт
Загрузите картинку и создайте пиксель-арт за секунды.
Перетащите картинку сюда
или
PNG · JPG · WEBP · SVG · PDF · AI — можно также вставить картинку (Ctrl/⌘ + V)
Создайте новый пиксель-арт
Выберите размер холста, чтобы начать рисовать.
Анимация пиксель-арта
Выберите размер холста, чтобы начать анимацию.
Превратите видео в пиксель-арт
Загрузите видео и создайте пиксельную анимацию за секунды. Всё работает на вашем устройстве.
Перетащите видео сюда
MP4 · WebM · MOV — обрабатывается локально, никогда не загружается на сервер
Обработка кадра 1 / 1
Цикл анимации — шаг за шагом
- Выберите размер холста — пресеты или любой свой Ш × В, точно как в редакторе.
- Нарисуйте кадр 1 во встроенном редакторе (те же инструменты, слои и палитра).
- Добавляйте кадры через + Кадр или Дублируйте текущий и меняйте только то, что движется.
- Задайте скорость ползунком FPS (1–24) и нажмите «Играть». Цикл идёт непрерывно со счётчиком кадров.
- Экспортируйте GIF, спрайт-лист или текущий кадр как PNG/SVG/PDF.
Кадры и раскадровка
Кадры живут в пронумерованной раскадровке под холстом: клик — переход, кнопки ◀ ▶ — порядок, клавиши ← → — шаг. Удаление убирает текущий кадр (последний вместо этого очищается), а Очистка стирает незаблокированные слои текущего кадра. Дублирование перед правкой — самый быстрый способ сохранить движение цельным.
Калька (onion skin) и тайминг
Калька (onion skin) показывает предыдущий кадр красным, а следующий — синим за вашим рисунком, с ползунком «Призрак» для силы — стандартный способ оценить дуги и интервалы. Тайминг задаётся в кадрах в секунду: 4–6 FPS читаются как ретро-рывки, 8–12 FPS — золотая середина для большинства циклов спрайтов, а полные 24 FPS подходят плавным эффектам. Приёмы подробно разобраны в руководстве о том, как анимировать пиксель-арт.
Фоны, которые не мерцают
Нажмите 🔗 на любом слое, чтобы сделать его общим для всех кадров — обычно это фон или тень на земле. Общие слои хранятся один раз и автоматически подкладываются под каждый кадр, поэтому статичные части никогда не дрожат. Обычные слои остаются покадровыми для всего, что движется.
От статичной картинки — к анимации
В обоих редакторах есть кнопка «Анимировать пиксель-арт», которая отправляет текущую сборку в аниматор (вместе с холстом) и переносит имя проекта. Начните цикл ходьбы в редакторе или сконвертируйте картинку, затем анимируйте — задуманная цепочка такова: конвертация → редактирование → анимация → экспорт.
Экспорт: GIF против спрайт-листа
- GIF — крутится бесконечно, сохраняет прозрачность и рендерит длинную сторону от 512 пкс, чтобы маленькие спрайты оставались чёткими при публикации.
- Спрайт-лист — один PNG со всеми кадрами бок о бок, готовый для игровых движков.
- Отдельный кадр — текущий кадр экспортируется точно как арт из редактора: PNG в родном размере (1×), векторный SVG или векторный PDF.
Частые вопросы
Сколько кадров можно сделать?
Фиксированного лимита кадров нет — только память устройства. Короткие циклы в 2–8 кадров закрывают покой, ходьбу и моргание; эффектам может понадобиться больше.
Какой FPS выбрать?
Начните с 8 FPS. Опуститесь до 4–6 для хлёсткого ретро-движения, поднимитесь к 12 для плавных циклов. Сначала смотрите предпросмотр — тайминг важнее числа кадров.
Что такое калька (onion skin)?
Полупрозрачный показ соседних кадров: предыдущий — красным, следующий — синим. Видно, насколько далеко каждый пиксель проходит между кадрами, поэтому движение остаётся цельным.
Как зафиксировать фон?
Включите 🔗 на фоновом слое, чтобы сделать его общим для всех кадров. Он автоматически рисуется под каждым кадром, и его не нужно перерисовывать.
Экспортировать в GIF или в спрайт-лист?
GIF — для публикации, предпросмотра и стикеров: он крутится и сохраняет прозрачность. Спрайт-лист — для игр и движков, которые сами нарезают кадры.
Как посмотреть предпросмотр анимации?
Нажмите «Играть»: цикл идёт непрерывно со счётчиком кадров, пока вы настраиваете ползунок FPS ниже.
Можно ли использовать один рисунок в нескольких кадрах?
Да — дублируйте кадр и меняйте только то, что движется. Малые смещения между кадрами читаются как плавное движение.
Почему моё движение выглядит неверно?
Прошагайте кадры стрелками и следите за одним опорным пикселем с включённой калькой (onion skin): ровные интервалы означают ровную скорость, сгущения — замедление.