Недавно мне попалось руководство по пиксель-арту от Juniper Dev, и вот ключевые моменты из него, от выбора программы до продвинутой покраски, сведённые в заметки. Делюсь с теми, кто тоже хочет начать.
Из программ рекомендую Aseprite: у него дружелюбный интерфейс, а анимация и тайлсеты в нём заточены под разработку игр. Если платить не хочется, бесплатной заменой послужат открытый LibreSprite или браузерный Piskel. Что касается цветов, поначалу не стоит загружаться теорией цвета: мне вполне хватало готовых палитр с Lospec, а в теорию можно вникать постепенно, когда набьёшь руку. Для каждого материала подготовьте как минимум три цвета (основной, тень и блик), и базовый объём уже получится.
Рисуя линии, не забывайте убирать лишние пиксели: с включённой опцией Pixel Perfect в Aseprite всё получается гораздо чище. В кривых делайте длины пиксельных отрезков симметричными (например, 1-2-3-2-1), и линии станут куда плавнее. При покраске берите для теней и бликов соседние цвета на цветовом круге, и картинка будет ярче; а ещё избегайте «подушечного затенения»: сначала определитесь с направлением источника света и освещайте всё единообразно. Дизеринг и сглаживание — два очень полезных приёма: первый создаёт фактуру переходов, второй делает края более гладкими.
Контур не обязательно делать чисто чёрным, попробуйте более тёмный оттенок цвета самого объекта. И напоследок совет разработчикам: не нагромождайте цвета, ведь больше трёх на один материал легко превращаются в кашу; почаще уменьшайте превью, чтобы убедиться, что и в маленьком размере всё остаётся чётким. А главное — получайте удовольствие от процесса: это важнее, чем зацикливаться на «идеальном результате».
Источник: 32comic
Pixelblog 62 посвящён пейзажным фонам, и в нём есть мысль, с которой я согласен: фоны не должны стоять в конце списка производственных приоритетов. Они задают обстановку и затягивают игрока в мир, но при этом должны работать на геймплей. В платформерах и шмапах их часто приходится приглушать, чтобы спрайты читались, а в пошаговых RPG фон может быть богатым и погружающим.
В этом уроке Раймонд Шлиттер сосредоточился на боевых сценах вымышленной пошаговой JRPG, вдохновлённой Dragon Quest и Phantasy Star 4, с местом внизу для героев, показанных со спины. Задача — добиться убедительной глубины, используя 16 цветов или меньше.
Он выбирает холст 192x144. Соотношение сторон 4:3, размер укладывается в распространённые разрешения 8- и 16-битных консолей и хорошо делится, если позже понадобится параллакс с пиксельно точной прокруткой. Работа начинается с сплошных горизонтальных полос, задающих линию горизонта, затем земля и небо делятся на всё больше полос. Его ключевая мысль: глубина в основном создаётся выбором цвета, по законам воздушной перспективы. Самый близкий план самый насыщенный и контрастный, а каждый удаляющийся план теряет насыщенность, светлеет и смещает оттенок к цвету неба. Под ясным голубым небом самая близкая трава самая тёплая, а дальние планы уходят в синеву.
После цветовых планов он добавляет два слоя гор, используя цвета из полос неба, и переходит к деталям. Трава складывается из множества коротких однопиксельных вертикальных штрихов, и ключ здесь — постоянство в группировке и масштабе. Каждый шаг он показывает отдельным изображением, так что можно идти в своём темпе. Полезное чтение, если палитры кажутся плоскими.
Источник: SLYNYRD
Попалась на Хабре длинная статья о том, как кубик Рубика стал художественным материалом, и в ней много интересного для тех, кто любит пиксель-арт. Автор несколько лет собирает мозаики из кубиков и объясняет, почему этот жанр так близок цифровой графике.
Главная мысль простая: цветная плитка на грани кубика по сути и есть пиксель. На одной грани девять квадратов, шесть цветов в палитре, а несколько кубиков вместе дают изображение с низким разрешением, похожее на экран старой ЭВМ или аркадного автомата. Совпало и по времени: расцвет 8-битных игр вроде Space Invaders, Pac-Man и Donkey Kong пришёлся на ту же рубикоманию начала 1980-х. Термин pixel art, как пишет автор, впервые употребили в 1982 году Адель Голдберг и Роберт Флегал из Xerox.
Дальше идёт история жанра. Самыми ранними опытами называют работы британца Фреда Холли середины 1980-х, потом программист Джейкоб Девенпорт в 1990-х документировал мозаики из нескольких десятков кубиков, включая первую двустороннюю. Настоящим прорывом стал французский стрит-артист Invader, который в 2004 году собрал из девяти кубиков своего космического захватчика и назвал направление Rubikcubism. Его «Мона Лиза» из 330 кубиков в 2020 году ушла с аукциона за 480 200 евро, а в 2022–2023 годах в брюссельском музее MIMA прошла выставка из более чем сотни его кубических работ.
Мне особенно понравилось, как автор описывает процесс: сначала макет в виде пиксельной схемы из шести цветов, потом, в более сложных работах, Photoshop для контроля цветов. Это тот же путь, что у любого пиксель-арта, только «пиксели» здесь — пластиковые кубики. Для тех, кто работает с ограниченной палитрой, хороший повод посмотреть на привычные приёмы под другим углом.
Источник: Хабр
Недавно я прочитал подробное руководство по программе Aseprite, в котором подробно описан процесс создания пиксельных игр. Я выделил наиболее полезные для себя моменты и записал их, особенно те настройки по умолчанию, которые "позволяют избежать ошибок".
Холст: Разрешение персонажей начинается с 32x32 пикселей, врагов, предметов и иконок – с 16x16 пикселей. Главного героя можно увеличить до 64x64 пикселей при необходимости. При редактировании можно установить масштаб по умолчанию на 800%, но в самой игре важно сохранять соотношение 1:1, не обманывайтесь увеличенным холстом в редакторе.
Палитра: Начните с палитры DB32, доступной на сайте Lospec. После определения основных цветов, расширьте палитру до 48-64 цветов, но старайтесь использовать не более 16 цветов в одном кадре. Палитра – это "набор доступных цветов", а не "набор цветов, которые нужно использовать". Для всего проекта лучше использовать одну основную палитру и не менять ее в процессе разработки, иначе стиль старых ресурсов может не совпадать с новыми.
Анимация: Частота кадров для анимации в состоянии покоя – 8 FPS, для атаки – 12 FPS, для специальных навыков – 24 FPS. В одном файле можно установить разную длительность для разных кадров с помощью параметра "Frame Duration".
Экспорт: Спрайты располагаются в строках на листе спрайтов, сопровождаются данными в формате JSON. Имя файла состоит из "имени персонажа_названия действия" и представляет собой пару PNG + JSON.
Наиболее распространенная ошибка при импорте в игровой движок – это неправильный выбор фильтра: используйте режим "Point", а не "Bilinear". Пиксельным изображениям не требуется сжатие текстур. В Unity можно использовать официальный импортер Aseprite для прямого импорта файлов .aseprite, что позволяет избежать ручного экспорта.
Еще одно предложение, с которым я полностью согласен: определите операции, которые вы выполняете более десяти раз в день, и напишите небольшой скрипт на Lua (около 20-30 строк), чтобы автоматизировать их. Добавляйте по одному скрипту каждую неделю. За несколько месяцев вы сэкономите гораздо больше времени, чем можете себе представить.
Вы можете начать подбор палитры здесь:
https://lospec.com/palette-list
Источник: Xmohe, "Коробка с инди-играми".
Один из весенних туториалов Pixelblog Раймонда Шлиттера посвящён теме, которая мне всегда казалась сложной: пошаговая игра о мехах в стиле Front Mission, нарисованная на изометрической сетке. Это учебная концепция, а не реальный проект, и автор ссылается на свои прошлые посты об изометрической проекции.
Мехи рисуются примерно в 32x32 пикселя, меньше обычных 64x64 и больше, поэтому детали приходится свести к очень немногим пикселям. Его метод: каждую часть начинать с простых геометрических фигур и сначала строить корпус. Торс должен выдаваться вперёд, как лоб танка, плечи массивные и стоят выше головы, а голова остаётся низкой и обтекаемой, с одним-двумя яркими пикселями под оптику. Ступни проектируются для устойчивости и заимствуют форму у когтей, клешней и копыт, потому что обычные человекоподобные стопы в этом стиле выглядят неуклюже. Акцентные полосы добавляются в самом конце и только там, где они усиливают форму.
Он набрасывает три типа юнитов: пехоту с округлыми формами, артиллерию с огромной пушкой, сросшейся с головой, и истребители с острыми треугольниками и ногами с обратным сгибом. К каждому дан короткий тактический комментарий.
Часть про окружение не менее полезна. Базовый тайл — куб 32x32, у верхнего ромба углы по 2 px, а соседние тайлы нужно накладывать в одном и том же порядке, чтобы текстуры стыковались без швов. Природные тайлы начинаются с земляного тайла, поверх которого кладутся разные текстуры травы. Вода примерно вдвое ниже обычного куба, а её анимация зацикливается на 16 кадрах: линейная текстура смещается вниз на 1 px за кадр, а блики чередуются.
Мне особенно нравится напоминание о том, что повторяющиеся тайлы должны выглядеть хорошо, когда их повторяют по всей карте, поэтому стоит самому проверить наложение слоёв.
Источник: SLYNYRD Pixelblog
Последний Pixelblog Раймонда Шлиттера на SLYNYRD посвящён 8-битным ниндзя-платформерам. Это хорошее чтение для тех, кому нравится видеть, как целый набор игровых ассетов строится вокруг одной идеи. Он открыто берёт за образец Ninja Gaiden и на протяжении всей работы использует палитру NES, хотя и не придерживается строго ограничений железа.
Сначала идёт персонаж игрока. Он начинает с простой болванки, чтобы анимации были готовы до того, как появятся какие-либо дизайнерские детали. Ярко-красный костюм выбран ради заметности, даже если это не самый незаметный вариант. Набор движений основан на Рю Хаябусе: быстрый бег, лазание по стенам, висение на потолке, перевёрнутый прыжок и воздушный удар. Мне понравилась логика, по которой персонаж останавливается при атаке на земле. Это вынуждает к точности в столкновениях, а не позволяет бесконечно жать удар на бегу.
Затем идут враги: вертолётная турель, которая водит пушкой на 180 градусов в пяти направлениях, паукообразный танк, цепляющийся за стены и потолки, и медленная кибергорилла, которая работает губкой для урона. Для гориллы он опирался на референсы ходьбы на костяшках, сначала набросал простые формы тела, чтобы поймать движение, и только потом добавил роботизированные детали. Объединение головы и корпуса в одну деталь придаёт ей намеренную неуклюжесть.
Часть про окружение оказалась самой полезной. Используются тайлы 16x16 в шести слоях, каждый из которых прокручивается с собственной скоростью для эффекта параллакса. Проекция «шкаф» задаёт линии глубины примерно под 67,5 градуса: на каждый пиксель вправо приходится два вверх, поэтому ступеньки получаются аккуратными. Результат показан на макете 320x180.
Ещё одна деталь: это первый Pixelblog, где один из мини-уроков, полная покадровая разбивка ниндзя, закрыт платной подпиской Patreon, а основной урок остаётся бесплатным. Ассеты и исходные файлы продаются отдельным пакетом. Мне бы очень хотелось увидеть, как кто-нибудь вставит эти спрайты в настоящий контроллер игрока.
Источник: SLYNYRD
На Хабре вышел перевод большой статьи Карла Свенссона о том, как электронно-лучевые трубки повлияли на пиксель-арт. Тема спорная, и мне понравилось, что автор не соглашается с простым объяснением «ЭЛТ всё размывали».
Он начинает с популярного видео в TikTok, где говорится, что старые художники учитывали размытие ЭЛТ, из-за которого грубые края пикселей казались мягче. Свенссон признаёт, что это отчасти правда, и согласен, что современный блочный пиксель-арт часто превращается в неточную ностальгию. Но он напоминает, что аспектов у старого железа гораздо больше. Сам он регулярно пользуется старыми ЭЛТ и поэтому отключает программные ЭЛТ-фильтры в эмуляторах: по его словам, ни один из них не передаёт особенности настоящего экрана верно. Фотография Commodore 64 на мониторе Commodore 1084S показывает, что неровные края пикселей видны и на ЭЛТ.
Дальше идёт сравнение двух игр на C64. Maniac Mansion (1987) работает в разрешении 160×200 и выглядит угловато, а Mayhem in Monsterland (1993) при той же фиксированной 16-цветной палитре использует дизеринг и сглаживание, чтобы имитировать большее разрешение и глубину цвета. Эти приёмы опираются на свойства ЭЛТ: лёгкую размытость, растровые строки и небольшое просачивание цветов.
Золотым веком пиксель-арта автор считает 16-битную эру: Amiga 500, SNES, Atari ST и Mega Drive. Amiga показывала 32 цвета из 4096, и графика в играх вроде Silkworm или Ruff'n'Tumble постепенно улучшалась. Ещё он разбирает трюки с цветом CGA и объясняет, что на экранах с мелким шагом точки (VGA) отдельные пиксели видны гораздо лучше.
Мне эта статья показалась хорошим напоминанием: прежде чем добавлять «ретро-размытие», стоит понять, для какого именно экрана рисовали оригинал.
Источник: Хабр
В Pixelblog 63 Раймонд Шлиттер переходит к горизонтальному шутеру и создаёт набор ассетов вокруг самолётов Второй мировой, сражающихся над природным пейзажем. После прошлых материалов о вертикальных шмапах это его первый опыт с горизонтальным жанром, где узоры пуль летят поперёк экрана, а не сверху вниз.
Он начинает с самолёта игрока, потому что тот задаёт стиль и разрешение для всего остального. Примерно 48x32 пикселя дают место для деталей, не делая анимацию слишком дорогой. Самолёт основан на P-51 Mustang. Интересно, что при вертикальном движении он анимирует крен, а не тангаж. Нос остаётся ровно, поэтому пули всегда летят прямо, а поворот при таком низком разрешении обычно даёт шумные скопления пикселей. Итог: крен держит спрайт чистым и хорошо выглядит.
Анимация использует пять ориентаций: нейтральный кадр, по два положения крена вверх и вниз и постоянно вращающийся винт. Он также задаёт дизайн-правило для ощущения управления: короткое нажатие показывает только первый градус крена, удержание даёт полный наклон, а отпускание возвращает через неглубокую позу в нейтраль. В жанре, где важна точная реакция, он советует не добавлять движению инерцию.
Рассмотрены и опции, маленькие модули, которые вращаются вокруг корабля. Помимо игровой роли, он считает, что они добавляют присутствия на экране и помогают чувствовать положение своего корабля, пока глаза следят за траекторией пуль.
Враги — немецкие самолёты и артиллерийская установка Hummel. Его процесс начинается с шаблона из нескольких блочных цветов, затем идут настоящие цвета и базовые детали, потом свет и мелкие детали, а контур добавляется последним. Замена палитры позволяет переиспользовать анимацию винта на разных самолётах, и он советует тратить дополнительные кадры только там, где это оправдано поведением. Практичный урок экономии.
Источник: SLYNYRD
Команда Aseprite объявила 22 июля 2026 года, что v1.3.18 стала новой стабильной версией. Она включает исправления ошибок и сбоев, а также новые возможности, появившиеся после v1.3.18-beta1; скачать её можно из вашего аккаунта на aseprite.org.
Главные изменения основного релиза — новое разделение тегов внутри групп на таймлайне и новая опция «размер листа — степень двойки» для экспорта спрайт-листов. Также исправлено копирование пользовательских данных (цвет и текст) тегов и срезов при дублировании спрайта и несколько сбоев, например при удалении вставленного выделения или скрытии слоя во время перемещения пикселей.
Последующие точечные релизы важны для тех, кто работает с тайлами. v1.3.18.4 исправил выравнивание «Привязки к сетке» для кистей больше одного пикселя и улучшил копирование и вставку тайлов между слоями тайлмапа. В более поздних сборках исправлен сбой при вставке тайлмапов и сбой после экспорта спрайт-листа, если у спрайта было выделение. Экспорт анимированных GIF теперь использует правильный заголовок 89a, а PNG в оттенках серого загружаются с серой палитрой.
Для скриптеров тоже есть новости: версия Lua API поднята до 41, добавлены Dialog:samerow{} и новые события спрайта до и после сохранения (save и beforesave).
Мне нравятся такие описания изменений, потому что они показывают, где в повседневной работе возникают трудности: сетка, тайлмапы, экспорт. Если вы откладывали обновление из-за ошибки копирования тайлов, эта версия выглядит тем, что стоит попробовать.
Когда начинаешь рисовать персонажей в пиксель-арте, рано или поздно встречается термин «спрайтшит» (sprite sheet). Делюсь вступительным разбором Keitaro из note: он шаг за шагом объясняет, как всё устроено, и мне показался полезным.
Спрайт — это двумерное изображение, которое выводится на экран игры. Персонажи, враги, предметы, пули и эффекты относятся к спрайтам, а спрайтшит — это набор таких изображений, собранный в одну большую картинку. Для анимации ходьбы показывают кадр с правой ногой впереди, затем кадр с ногами вместе, затем кадр с левой ногой впереди, быстро меняя их, чтобы возникло ощущение движения. То есть движение создаётся сменой неподвижных картинок, а не видео.
Игра не выводит большую картинку целиком. По координатам она вырезает только нужный кадр. Например, если каждый кадр 128×128 пикселей и восемь стоят подряд, область вывода смещается с 0–127 px на 128–255 px и так далее. В статье также приведён пример: по горизонтали идут 8 направлений, по вертикали — действия (ходьба, атака, получение урона, защита), то есть 8 направлений × 7 состояний, всего 56 кадров.
При практическом использовании, говорится в статье, важнее всего совмещать опорную точку во всех кадрах. Если ноги смещаются на несколько пикселей от кадра к кадру, персонаж во время анимации будто дрожит вверх и вниз. Прозрачный фон тоже обязателен.
Наконец, разобрано различие между спрайтшитом, то есть просто набором связанных картинок, и атласом спрайтов, который упаковывает несколько изображений в одну текстуру для эффективной отрисовки. Больше всего запомнился вывод: нарисовать картинки проще, чем привести их к виду, который игра сможет правильно использовать. Думаю, это пригодится и пиксель-артистам, особенно на этапе экспорта.
Источник: note (Keitaro)
В фоновых пиксель-артах камни — небольшая, но на удивление трудоёмкая задача. В пятничной подборке пиксель-новостей автор note おかか容疑者 рассказал о расширении для Aseprite «Rock Generator for Aseprite».
Расширение опубликовано на itch.io. Это инструмент исключительно для камней: он загружает камни как 3D-меши и позволяет использовать их как пиксель-арт. Уже на странице загрузки видно множество параметров, и автор статьи считает, что именно узкая специализация на камнях позволяет настраивать их так тонко.
Согласно статье, в комплекте 10 готовых форм, 21 готовая структура и 72 «look» (внешних вида). Можно создавать и камни, покрытые мхом, и заснеженные, так что для создания фонов инструмент выглядит удобным. Интерфейс поддерживает 27 языков, включая японский.
Инструмент платный: по состоянию на октябрь 2026 года он стоит от 4,99 доллара США (примерно 800 иен). Внизу страницы есть пробная версия, но, как написано в статье, она содержит только примеры изображений результата. Если хотите проверить её до покупки, имейте это в виду.
Модели камней и раньше можно было создать в Blender или другой программе и импортировать в Aseprite. Тем не менее возможность набросать камни прямо внутри Aseprite выглядит очень эффективной и может пригодиться, когда нужно сделать много фонов в пиксель-арте. Мне всегда трудно решить, как прорисовывать разные текстуры камня, поэтому новости о таких вспомогательных инструментах действительно радуют.
Источник: note (おかか容疑者)
Фестиваль пиксель-арта «Pixel Art Park 9 (PAP9)» состоится в воскресенье, 11 октября 2026 года, в Pacifico Yokohama. О участниках этого года рассказано в статье на note, которую написал господин Морита из игровой студии Ixeal из района Нерима.
Ixeal участвует как компания-спонсор. Она представит две совершенно новые оригинальные игры, разработанные специально для PAP9. В статье описана одна из них — «Magical Soup».
Суть игры в том, чтобы ловить «скрытые вкусы» и варить из них суп. Есть три вида скрытых вкусов — «обычный», «опасный» и «волшебный», и от их сочетания зависит, какой суп получится. Игрок также получает наклейку того же типа, что и приготовленный суп. Игра создана командой, которая делала «JUST Onigiri», экспонировавшуюся на прошлом PAP8.
Вторая игра и новые товары с пиксель-артом будут представлены в следующих статьях.
Это похоже на приятное мероприятие для любителей пиксель-арта: можно играть и держать в руках настоящие вещи. Увидеть, как пиксель-арт двигается внутри игры, и поговорить напрямую с авторами — редкая возможность. Если вы живёте рядом, стоит заглянуть.
