Анимируйте пиксель-арт покадрово: нарисуйте позу, добавьте кадр — «луковая кожа» покажет предыдущую позу под ним. Проверьте цикл на скорости от 1 до 30 fps, для ходьбы попробуйте 8–12 fps и экспортируйте анимированный GIF или спрайт-лист.
Как пользоваться
- Нажмите кнопку размера и выберите холст от 8×8 до 128×128 пикселей или начните рисовать прямо на примере.
- Выберите инструмент и цвет и рисуйте. С включённым зеркалом каждый штрих повторяется на другой стороне.
- Слои помогают разделить контур и цвет, кадры нужны для анимации. «Пуск» показывает анимацию в превью.
- В разделе «Экспорт» скачайте PNG в масштабе от 1× до 32×, спрайт-лист или анимированный GIF.
- Рисунок автоматически сохраняется в этом браузере и не покидает ваше устройство. Сохраните файл проекта (.json), чтобы оставить копию или продолжить на другом устройстве.
- Правый клик рисует дополнительным цветом, Alt+клик берёт цвет. Shift+клик карандашом проводит прямую от последней точки, а заливкой перекрашивает все пиксели этого цвета на слое.
- У каждого кадра своя копия всех слоёв. Калька показывает предыдущий кадр и бледнее следующий, чтобы движение было плавным.
- При экспорте края пикселей остаются чёткими в любом масштабе. GIF сохраняет прозрачность, если не включён белый фон.
- Импорт усредняет каждый блок картинки и сводит её к 4–64 цветам или к текущей палитре. Выберите «Текущий слой», чтобы обвести поверх.
- На сенсорном экране рисуйте одним пальцем, двумя пальцами масштабируйте и двигайте холст.
Выбор размера холста
16 × 16 — классический размер для иконок, предметов и маленьких персонажей; 32 × 32 оставляет место для лиц и деталей и часто используется для игровых героев; 64 × 64 подходит для портретов и сцен покрупнее. Маленький холст заставляет упрощать формы — отличная тренировка.
Пиксель-арт рисуют маленьким, а показывают большим. Для соцсетей экспортируйте в 8× или 16×: спрайт 32 × 32 при 16× превращается в чёткий PNG 512 × 512, ведь каждый пиксель копируется блоком без размытия.
Слои, кадры и луковая кожа
Контур держите на одном слое, а цвет и тени — на другом: так можно перекрашивать, не перерисовывая линии. В анимации у каждого кадра своя копия всех слоёв. «Луковая кожа» показывает предыдущий кадр полупрозрачным, а следующий ещё бледнее, чтобы движение совпадало. Воспроизведение показывает цикл со скоростью от 1 до 30 кадров в секунду; для цикла ходьбы обычно берут 8–12 fps.
Сочетания клавиш и советы
Правый клик рисует дополнительным цветом, Alt+клик берёт цвет пипеткой, Shift+клик карандашом проводит прямую от последней точки. Shift+клик заливкой перекрашивает все пиксели этого цвета на слое — удобно для смены палитры. Сохраните проект в .json, чтобы иметь резервную копию или продолжить на другом устройстве.
Частые вопросы
Какой размер лучше для пиксель-арта?
Новички чаще всего начинают с 16 × 16 или 32 × 32. Первый держит формы простыми, во втором есть место для мимики и теней. Для детальных сцен берите 64 × 64 и больше.
Как экспортировать пиксель-арт без размытия?
Экспортируйте PNG с масштабом 8× или 16×. Каждый пиксель увеличивается сплошным квадратом, и края остаются резкими при любом размере.
Можно ли сделать анимированный GIF?
Да. Добавьте кадры, нарисуйте каждую позу, проверьте цикл воспроизведением и задайте скорость, затем экспортируйте GIF. Прозрачность сохраняется, если не включать белый фон.
Как сделать спрайт-лист для игры?
Нарисуйте кадры анимации, выберите спрайт-лист в экспорте и расположите кадры в ряд или сеткой. Лист сохраняет точные размеры в пикселях для игровых движков.
Сохраняется ли мой рисунок?
Да, автоматически в этом браузере. Чтобы сделать копию или перейти на другое устройство, скачайте проект файлом .json и откройте его там.
Можно ли превратить фото в пиксель-арт?
Да. Импорт усредняет каждый блок изображения и сокращает число цветов до 4–64 или до текущей палитры, после чего результат можно доработать вручную.