Пиксельное рисование: 11 программ для работы с пиксель-артом — Gamedev на DTF

27 уроков по созданию пиксельных иллюстраций

Серия уроков, которая поможет освоить принципы создания пиксельных иллюстраций, а также их дальнейшей анимации.

В уроках также нассмотрены несколько программ, которые наилучшим образом подходят для создания пиксельных иллюстраций и персонажей для анимации.

Pixel Game Art Animated Background Tutorial in Photoshop

Pixel Game Art Design in Photoshop: Character animation & background tutorial

How create Pixel Art For Games – Tutorial – 8Bit Graphic Design

Pixel art/ Adam’s Nightmare indie game/ Drawing process

Как рисовать Пиксель Арт в Фотошопе

Speed Pixel Art #2 – A Japanese Tree

My secret way of improving fast

Pixel Art Timelapse: Necromancer Cast Animation

3 PixelArt Techniques/Common Mistakes

How To Draw Isometric Pixel Art | Photoshop Tutorial

How to make City Building background tiles

How To Pixel Art Tutorial Part 1: What Programs?

How To Pixel Art Tutorial Part 2: Basic Heart

How To Pixel Art Tutorial Part 3: Dithering

How To Pixel Art Tutorial Part 4: Form

How To Pixel Art Tutorial Part 5: Outlines

How To Pixel Art Tutorial Part 6: Pixel People

How To Pixel Art Tutorial Part 7: Sword & Sworcery

How To Pixel Art Tutorial Part 8: Background

How To Pixel Art Tutorial Part 9: Colour & Depth

How To Pixel Art Tutorial Part 10: Tile Basics

How To Pixel Art Tutorial Part 11: Character Design

How To Pixel Art Tutorial Part 12: Animation Basics

How To Pixel Art Tutorial Part 13: Base Sprite for Animation

How To Pixel Art Tutorial Part 14: Setting Up Layers

How To Pixel Art Tutorial Part 15: Idle Animation

How To Pixel Art Tutorial Part 16: Walk Cycle

Нейросеть научили создавать пиксельную графику

Результат работы алгоритма

Chu Han et al. / SIGGRAPH Asia 2018

Китайские исследователи разработали алгоритм на базе сверточных нейросетей, способный создавать качественную пиксельную графику из обычных нарисованных изображений, а также восстанавливать сглаженное изображение из пиксельной графики. Разработчики применили метод обучения без учителя, благодаря чему им не пришлось вручную создавать для обучения пары обычных и пиксельных изображений. Посвященная алгоритму статья будет представлена на конференции SIGGRAPH Asia 2018.

Пиксельная графика, также известная как пиксель-арт, зародилась в 1970-х годах как способ воспроизвести реальные или вымышленные объекты на мониторах с низким разрешением. Несмотря на то, что на сегодняшний день разрешение распространенных мониторов составляет миллионы пикселей, и они способны отображать крайне реалистичную 3D-графику, пиксельная графика осталась достаточно популярной и используется, к примеру, во многих современных видеоиграх.

Обычно такую графику приходится создавать вручную на уровне отдельных пикселей. Если рисунок основан на реальном изображении, художнику необходимо не просто уменьшить его разрешение, а переработать, оставив глобальную структуру объекта и лишь важные детали. Из-за этого создание пиксельной графики требует много времени и усилий, и некоторые исследователи занимаются созданием алгоритмов, способных автоматизировать этот процесс.

Исследователи под руководством Тянь-Цзинь Вона (Tien-Tsin Wong) из Китайского университета Гонконга создали алгоритм, способный создавать качественную пиксельную графику, напоминающую работу настоящих художников. Алгоритм состоит из трех сверточных нейросетей и работает в двух направлениях. На входе он получает исходное изображение в высоком разрешении, обладающее большим количеством деталей. Это изображение подается на нейросеть GridNet, которая создает на его основе предварительный набор из трех изображений с несколькими уровнями пикселизации. Результат работы этой сети передается на сеть PixelNet, которая превращает этот набор изображений в три изображения, выполненных в стиле пиксельной графики.

 В конце работы алгоритма пиксельные изображения передаются на сеть DepixelNet, которая идентична PixelNet по строению, но выполняет обратную функцию — создает сглаженное изображение, напоминающее оригинал.

Схема работы алгоритма

Chu Han et al. / SIGGRAPH Asia 2018

Разработчики создали несколько функций потерь, связывающих разные подсети и позволяющих минимизировать различие структуры и цветов на изображениях, полученных на разных этапах работы алгоритма.

Сравнение исходного изображения и пиксельной графики, созданной разными методами. Последнее изображение получено в результате работы нового алгоритма

Chu Han et al. / SIGGRAPH Asia 2018

Одна из главных проблем при обучении алгоритма заключалась в сложности создания набора обучающих пар, состоящих из обычного и пиксельного изображений, поскольку рисование пиксельной графики требует много времени и усилий. Вместо этого исследователи создали два датасета, состоящие из 900 обычных нарисованных изображений и других 900 изображений в стиле пиксель-арт. Во время обучения алгоритм обучался в обоих направлениях — созданию пиксельной графики из обычных изображений и наоборот. В результате разработчикам удалось обучить алгоритм создавать из произвольного нарисованного изображения качественную пиксельную графику, которая по уровню прорисовки превосходит результаты работ других алгоритмов.

Примеры изображений из двух датасетов

Chu Han et al. / SIGGRAPH Asia 2018

Помимо рисования пиксельной графики нейросети преуспели и в создании реалистичных картин, выполненных в классических стилях. К примеру, они умеют превращать примитивные изображения в картины, напоминающие стиль известных художников и даже совмещать в одной сгенерированной картине сразу несколько стилей. Кроме того, некоторые из них после обучения на множестве реальных картин способны не просто превращать фотографии в картины, но и создавать оригинальные произведения искусства.

Григорий Копиев

Как начать делать пиксель арт #1 (RUS) | by Кирилл Евстигнеев

Руководство для Абсолютного Новичка

Это — маленькая статья о том, как начать делать пиксель арт, написанная для тех, кто ни разу не открывал какую-либо нужную для этого программу. Пока я опишу самую базу, как создать файл, определиться с его размером и количеством цветов.

Этот гайд был поддержан на моем Патреоне! Если вам нравится то, что я делаю, то порадуйте меня своей подпиской, пожалуйста 🙂 (ВНИМАНИЕ! Это Патреон ОРИГИНАЛЬНОГО автора статьи, а не переводчика.)

Перед тем, как начнем…

Перед тем, как с открытым сердцем ворваться в мир пиксель арта, помните: пиксель арт — это лишь очередная разновидность искусства, как та же гуашь, масло, карандаш, скульптура или близкая к ней мозаика. Чтобы делать хорошие работы в пиксель арте, вам необходимо уметь рисовать. По сути, я имею в виду изучение анатомии, перспективы, светотени, основ цвета и даже историю искусства, так как все вышеуказанное нужно для создания хороших пиксельных работ.

Инструменты

Вам не нужно что-то эдакое для того, чтобы работать в пиксель арте, достаточно даже мышки и какой-нибудь бесплатной программы. Я использую маленький планшет от Wacom, очень хорошую мышку и клавиатуру; моя любимая программа — Aseprite, но вместо нее вы можете использовать все, в чем вам будет удобнее.

Вот список программ, которые чаще всего используются для пиксель артинга:

• Aseprite: Классный профессиональный редактор с кучей полезных плюшек (платный)
  (Примечание переводчика: но всегда можно скомпилировать.)
• GraphicsGale: Классика, использующаяся во множестве игр. Немножечко запутанная, но все так же с кучей полезных плюх (бесплатная)
• Piskel: Пиксельный онлайн-редактор (само собой, бесплатный)
• Photoshop: Мощный редактор изображений, который, по сути, не приспособлен для пиксель арта, но вы можете его настроить нужным образом (платный)

Aseprite

На данный момент это моя самая любимая программа. Она очень мощная, до краев забита полезными инструментами и очень даже проста для использования. Я выбрал Aseprite как программу для этого руководства, но я уверен, что адаптировать все написанное далее под любую другую программу вам не составит особого труда. Также вы можете взять бесплатную пробную версию этой программы, но помните, что тогда ваши файлы сохраняться не будут (если вы просто практикуетесь — в этом нет никаких проблем).

Создаем Новый Файл

Просто нажмите на “New File…” на загрузочном экране или на File > New File, чтобы мы могли начать.

Создадим новый файл. 16 на 16 пикселей кажется очень маленьким разрешением, но я думаю, что это прекрасно подойдет для начала. Слишком большие разрешения отвлекут вас от того, на чем мы должны сфокусироваться сейчас: на понятии того, как пиксели взаимодействуют друг с другом.

Окошко “Новый спрайт” в Aseprite

Режим цвета можно оставить в RGBA, на данный момент он самый простой и наглядный. Некоторые художники любят работать в режиме палитры “indexed”, который позволяет использовать несколько особых плюшек, но вместе с ними идут и некоторые недостатки.

Фон должен быть прозрачным или белым, пока без разницы. Теперь убедитесь, что Advanced Options отключены (но позже можете вернуться к ним) и можно наконец-то приступать!

Давайте рисовать!

Здесь мы сразу видим множество панелей и менюшек, но не волнуйтесь, пока нам будет нужна лишь самая малая их часть. Главный инструмент — Карандаш, который всегда должен быть в один пиксель шириной, и с помощью которого мы и будем размещать пиксели в специальном поле. Нажмите на иконку инструмента или на английскую клавишу B, а затем на экран, чтобы разместить пиксель того цвета, который вы сейчас используете.

Рабочая зона в Aseprite

Слева вы можете увидеть палитру с парочкой установленных по умолчанию цветов. Давайте поменяем их на другие, более простые. Нажмите на третью иконку над палитрой (Pressets) и выберите ARQ4 (хорошую палитру под авторством художника Endesga), которую вы будете использовать для своего первого творения.

А теперь, используя только четыре цвета слева, постарайтесь нарисовать кружку.

Будьте вольны пользоваться моей работой как предметом вашего вдохновения. Если вы вдруг сделаете ошибку, нажмите alt+ЛКМ по пустой зоне вне вашего рисунка, тем самым подобрав прозрачный цвет, которым можно пользоваться как ластиком. Ну или вы можете использовать, собственно, сам инструмент “Ластик” (горячая клавиша на английскую E).

Вы, скорее всего, заметили, что рисование в таком низком разрешении здорово отличается от любого другого рисования. Все должно быть просчитано, и каждый пиксель имеет очень большой вес. Запомните это.

Также вы можете немного поэкспериментировать с другими кнопками на панели инструментов. Нужно заметить, что некоторые инструменты открывают еще несколько альтернативных инструментов, если на них нажать. Пока вам следует избегать инструмента “Блюр”, который добавляет кучу ненужных нам цветов.

Теперь давайте сделаем еще больше спрайтов! Попробуйте нарисовать череп, меч и лицо человека. Но в этот раз без примера моих работ. Если вы почувствовали, что работа не влезает в эти рамки размера, то не волнуйтесь — это нормально, попробуйте что-либо немного поменять или попробуйте сначала. Работа в таком низком разрешении очень сложная и иногда напоминает паззл. Вот еще одна статья, которую я написал, посвященная работе в низком разрешении: [link]

Если вы так хотите, то вот вам моя версия этих трех спрайтов. Пожалуйста, не нажимайте сюда до того, как вы закончите рисовать их сами. [skull, sword and human face].

Подобные упражнения всегда хороши. Если вы хотите продолжать практиковаться, то попробуйте сделать еще больше спрайтов в рамках такого низкого разрешения.

Сохраняем файл

Для сохранения файла нажмите Control+S (или File>Save As…), Выберите имя файлу и путь сохранения, а потом нажмите кнопку save.

Помните, что в триале Aseprite’а нельзя сохранять работы!

Окошко экспортировки файла в Aseprite

Вы можете заметить, что Aseprite поддерживает очень много форматов для сохранения файла, но я рекомендую всегда держать при себе .ase версию каждого файла, который вы создаете. Точно так же, как формат .psd в Photoshop. Во время экспорта файла в интернет или игры, вы можете нажать Control+Alt+Shif+S или File>Export.

Вот почему никогда не следует изменять размер работ не на круглые числа

В Aseprite есть о-о-очень хорошая функция “Resize”, меняющая размер спрайта в окошке экспорта. Оно изменяет ваш спрайт только на какую-нибудь круглую процентную величину. Если вы измените размер спрайта, например, на 107%, это разобьет большинство пикселей и исказит изображение, но если вы измените размер на 200%, то каждый пиксель будет в 2 пикселя шириной и выстой, что, несомненно, выглядит классно и точно.

Бо́льшие разрешения

Теперь, когда мы разобрались с основами типа сохранения нового файла и рисования в указанном размере, давайте попробуем порисовать в еще большем разрешении, 32 на 32 пикселя. Также мы будем использовать палитру немного пошире, попробуйте AAP-Micro12 (сделана художником AdigunPolack). В этот раз мы будем рисовать лопату.

В отличие от спрайта в разрешении 16х16, в нашей работе мы можем уместить еще и обводку, поэтому давайте с нее и начнем. Вот вам мой порядок выполнения работы:

Шаг 1: Линии

Шаг 1

Такой принцип работы мы называем pixel-perfect (дословно вплоть до пикселя), он отличается тем, что линия лишь в 1 пиксель шириной и соединяется с другими пикселями по диагонали. Когда мы делаем подобные линии, мы стараемся избегать нежелательных пикселей и углов, например:

В Aseprite есть очень удобная функция в настройках кисти, которая позволяет делать описанный выше процесс автоматически: выбрав инструмент кисть, нажмите на кнопку Pixel-perfect. Только не забудьте выключить это после работы с обводкой, так как в таком случае она будет вас раздражать.

Алгоритм Pixel-Perfect в Aseprite

Шаг 2: Основные цвета

Шаг 2

Самое большое преимущество маленькой палитры в том, что у вас не будет слишком много вариантов выбора цветов, которые частенько сбивают с толку. Вот почему работать в больших палитрах гораздо сложнее, ибо всегда есть вероятность того, что выбранный вами цвет не имеет гораздо более подходящей альтернативы. Представляйте, что ваша работа — это паззл, экспериментируйте даже со странными и непонятными комбинациями цветов, пока вы не поймете, что нашли тот самый “идеальный цвет” для каждой зоны спрайта.

Шаг 3: Светотень

Шаг 3

Используйте свою палитру так, чтобы оформить светотень самым оригинальным образом. Так как вы работаете с узкой палитрой, у вас само собой не будет всех цветов радуги с кучей вариантов их яркости, поэтому вам придется импровизировать.

Импровизируем с цветами для света и теней

Например, слева вы видите работу, которую я нарисовал с помощью точно такой же палитры, как у вас — AAP-Mini12. Когда я рисовал этого зеленого мужчинку, у меня не было ни одного ярко-зеленого в палитре, поэтому я решил использовать ближайший цвет, доступный мне, которым оказался желтый. То же самое произошло и с тенью, я выбрал синий, потому что это был самый подходящий темный цвет. Но что если мы сделаем немного по-другому? Ведь ничего не мешает мне использовать синий вместо самого яркого и красный вместо самого темного, правда? Ну, не совсем:

Инвертированная светотень

Эффект получился довольно-таки крутым, но почему-то не покидает ощущение того, что что-то не так. Обычно холодные цвета должны быть тенью, а яркие — светом, иначе работа будет выглядеть странно. Это правило не железное, конечно, и вы можете найти массу исключений, но если вы не очень уверены в этом, то и не надо.

Шаг 4: Сглаживание и финальные штрихи

Шаг 4, финальный

В этой части работы вы должны сделать пиксели не такими “острыми”. Ручное сглаживание — сложная тема, и нам несомненно потребуется отдельная статья лишь для одного ее обсуждения, но говоря кратко, вы используете полутоны для имитации “полупикселей” и более мягких углов. Но пока даже не зацикливайтесь на этом, сейчас вашей задачей является сделать ваш спрайт максимально разборчивым.

Еще на этом этапе неплохо бы поискать “сиротские пиксели” (англ. Orphan PIxels). Это такие пиксели, которые не относятся ни к группе других пикселей, ни к части сглаживания, как на планете слева:

Убираем одиночные пиксели

Видите эти маленькие однопиксельные островки? Это сиротские пиксели, и как вы можете заметить, планета выглядит гораздо лучше, когда мы соединяем их с группой соседних пикселей того же цвета.

А что же по поводу звезд в этом примере? Ну, они тут для того, чтобы показать, что сиротские пиксели не всегда плохие, и эти звезды читаются именно так, как должны, создавая нужный нам шум и оттеняя фон.

Я хочу донести до вас, что не надо бездумно стирать сиротские пиксели, надо посмотреть и спросить себя: а нужно ли этому пикселю вообще быть одиночным?

А что теперь?

А теперь вам нужно экспериментировать с количеством цветов в палитре и разрешением! Но делайте это постепенно, начните, к примеру, с 48 на 48 пикселей и 16 цветов в палитре. Если вы действительно только начали, я настоятельно рекомендую вам избегать анимаций и для начала привыкнуть к статичным изображениям.

Я выбрал еще немного гайдов по пиксель артингу, которые мне нравятся. Если вы хотите развиваться еще больше, то я рекомендую к прочтению следующее:

Также я делаю немного других туториалов по разным аспектам пиксель арта и гейм дизайна, вы можете найти их здесь:

Часть 2 уже доступна тут!

(Примечание переводчика: Ну что же, вот мои руки и дошли до первой части этого замечательного гайда. Прямо сейчас я занимаюсь переводом второй части, а пока хочу поблагодарить вас за уделение внимания моему переводу. Творческих успехов вам, удачи!)

Программа для рисования пиксель арта. Pixel Art Studio, редактор пиксельной графики

Содержание статьи:

Казалось, что пиксельная графика уже давно себя изжила. Появилось множество новых форматов (куда более качественных). Но оказалось, что пиксельная графика все еще жива. Она до сих пор используется в играх, мемах, различных программах. Пиксельная графика потихоньку становится новым видом искусства, которое имеет право на жизнь только в Интернете. Но это не делает ее хоть сколько-нибудь специфической. Для осуществления своих художественных амбиций придется сначала выбрать подходящее программное обеспечение. Есть отличный вариант. «Пиксель арт Студио» — бесплатная программа для рисования пиксель арта. Она поможет воплотить в жизнь самые смелые проекты. Мы рассмотрим все основные ее опции, но сначала разберемся, что означает словосочетание «пиксель арт».

Вам будет интересно:Как исправить ошибку «Не удалось установить BlueStacks»?

Что такое пиксель арт?

Создание пиксель арта подразумевает рисование сложных графических объектов из простых фигур. Полноценная картина создается из маленьких квадратиков (пикселей), которые раскрашиваются вручную и придают изображению нужный цвет, объем и форму. Ранее именно так создавались иконки для запуска приложений (ярлыки). Некоторые из них создаются так и по сей день. В настоящее время Pixel Art используется в самых разных областях. Его используют в 2D играх, простейших мультфильмах, мемах в Интернете и в некоторых программах. Что довольно странно. Однако стоит признать, что выглядит пиксель арт довольно забавно.

Для работы в таком стиле сойдет любой графический редактор. Даже пресловутый «Фотошоп». Но гораздо проще использовать специализированное приложение, которое создано как раз для того, чтобы работать именно с такой графикой. Такой программой является бесплатный продукт под названием Pixel Art Studio. Есть версии под «Виндовс» и «Мак ОС». Соответствующие версии можно найти в магазине «Виндовс» и в AppStore. А теперь разберем преимущества и недостатки приложения.

Преимущества программного продукта

Итак, «Пиксель Арт Студио» — это программа для рисования пиксель арта для ПК. Она обладает внушительным списком преимуществ.

• Утилита совершенно бесплатна. Ее может скачать и установить любой.
• Программа имеет максимально простой и интуитивно понятный интерфейс (хоть и без русского языка). С ней разберется даже новичок.
• Продукт не обладает огромным количеством инструментов, как более продвинутые редакторы. Это позволяет не заблудиться в инструментах и настройках.
• Программа поддерживает работу со слоями. Как и любой качественный графический редактор.
• Утилита работает очень быстро даже на старых и слабых машинах (хоть и оптимизирована под «Виндовс 10»). Такое редко бывает.
• Разобраться в принципе работы основных инструментов не составит никакого труда. По большей части, это простые геометрические фигуры и линии.
• Программа для рисования пиксель арта имеет в своем активе весьма богатый справочный материал с кучей уроков. Вот только весь текст на английском языке. Но в этом ничего страшного нет. Переводчик от «Гугл» быстро и качественно растолкует, что там написано.

Вам будет интересно:Как в BlueStacks поменять язык интерфейса и клавиатуры

Недостатки программы

Как и положено рядовому приложению, Pixel Art Studio имеет и набор недостатков. Их, конечно, меньше, чем преимуществ, но они есть.

• Программа отличается довольно скудным набором функций и инструментов: пару линий, несколько фигур, палитра красок, полотно с пикселями и несколько инструментов для правки. Вот и все.
• Этот редактор пиксельной графики не позволяет создавать высококачественный контент. Максимальное качество изображения искусственно ограничено.
• В этой программе нет возможности создавать анимированный пиксель арт. А это для игр, мультфильмов и мемов очень важно. Конек приложения — статические пиксельные изображения. На большее программный продукт не способен. Зато он совершенно бесплатен.

Почему не использовать «Фотошоп»?

Дело в том, что графический редактор от Adobe — весьма навороченный продукт. Для того чтобы успешно в нем работать нужно долго учиться. А в случае с пиксель артом и вовсе все сложно. Придется перелопатить гору литературы на тему «Как рисовать пиксель арт в Фотошопе». Этот редактор хорош для тех, кто уже привык к нему. А новички просто потеряются в обилии инструментов и функций. Хотя надо отдать ему должное: продукт отлично выполняет свою работу и может сделать с изображением практически все. Также в «Фотошопе» есть опции анимации, что подходит для создания мультфильмов в стиле «пиксель арт». В общем, использовать «Фотошоп» для рисования стильных картинок в пикселях можно. Но только в том случае, если вы готовы потратить кучу времени на обучение. Не стоит забывать и о том, что «Фотошоп» — платный продукт. И подписка стоит очень дорого.

Положительные отзывы о приложении

Вернемся к нашей программе для рисования пиксель арта. Что говорят пользователи о «Пиксель Арт Студио»? Стоит отметить, что мнения разделились. Некоторые юзеры утверждают, что это мощный и удобный инструмент для создания шедевров. Хвалят простоту использования и наличие всех основных инструментов. Также юзерам нравится интуитивно понятный интерфейс и оформление программы, выполненное в минималистичном стиле. Утилита прекрасно вписывается в стандартный интерфейс «Виндовс 10». К тому же, пользователи отмечают очень высокую скорость работы программного продукта. Pixel Art Studio действительно работает быстрее, чем более навороченные графические редакторы. А владельцы относительно старых ПК утверждают, что данное приложение ведет себя прекрасно даже на их древних машинах. В общем, с оптимизацией у программы все прекрасно.

Отрицательные отзывы о Pixel Art Studio

Все положительные отзывы оставлены теми, кто только начал погружаться в увлекательный мир компьютерной графики. Отрицательные же комментарии принадлежат тем, кому нет ничего проще, как рисовать пиксель арт в «Фотошопе». Эти товарищи заявляют, что «Пиксель Арт Сутдио» — бесполезное приложение для тех, кто хочет рисовать по клеточкам. Профессионалы утверждают, что в этом программе нет абсолютно ничего, за что стоило бы его хвалить: скудный набор инструментов, нет никаких дополнительных функций, нет возможности анимировать объекты. Также многие отмечают в корне неправильный механизм работы со слоями. Как бы то ни было, данный программный продукт рассчитан отнюдь не на профессионалов, а на новичков. Так что на отзывы «специалистов» можно не обращать внимания.

Заключение

Итак, подведем итоги. Pixel Art Studio — это отличное приложение для создания пиксельной графики, рассчитанное на новичков. Оно имеет понятный и не перегруженный различными ненужными элементами интерфейс и минимальный набор инструментов для создания простых изображений. В тоже время данный продукт никак не подойдет профессионалам, так как не сможет удовлетворить их потребности своим функционалом. В любом случае рисовать пиксель арт в этой программе гораздо проще, чем в пресловутом «Фотошопе». Если требуется продукт для того, чтобы начать, то лучше, чем Pixel Art Studio нет ничего.

Источник

как рисовать пиксель арт, программы для пиксель арта, идеи для пиксель артов.

Пиксельная графика представляет собой формат цифрового мастерства, который позволяет создавать в растровых редакторах анимацию для компьютерных игр и мобильных приложений. Преимуществом этого направления считается простота использования. Потому как, создать двухмерное цифровое изображение можно даже в стандартном графическом редакторе.

История

Пиксель арт — это техника создания иллюстрации из наименьших элементов изображения — пикселей. И зародилась она в 1970-х годах. А пик популярности направление приобрело в начале 1990-х. Тогда начали выпускаться видеоигры для приставок 2 и 3 поколений. Развитие 3D-графики на время вытеснило пиксельное рисование. Однако с развитием мобильных приложений и игр графическая живопись обретает второе дыхание.

Основные правила пиксель арта

Самым важным элементом растровой графики является штриховой рисунок, а точнее, его контуры. Основное правило — отрезки из пикселей не должны образовывать прямых углов. А линии по ходу рисования должны смещаться в одну или другую сторону не менее чем на пиксель.

Линии

Рисунки в пиксель арте создаются с помощью прямых и изогнутых линий. Правильным построением отрезка считается техника, при которой пиксели касаются друг друга только одним углом. И чем меньше ровных отрезков, тем качественнее иллюстрация.

Прямые линии

Для прорисовки прямых линий используют следующие правила:

• каждый следующий пиксель смещается на одну позицию относительно предыдущей точки;
• рисуются ровные отрезки из 2, 3 или 4 пикселей, а потом делают сдвиг.

Линии, нарисованные по последней технике, считаются наиболее красивыми и правильными. Остальные правила смещения также приемлемы и не нарушают технику пиксель арта.

Изогнутые линии

Кривые линии предполагают наличие изломов, закруглений и поворотов. Главное правило — соблюдать характер смешения, который предполагает постепенное и равномерное смещение точек и отрезков. Линии должны плавно спускаться и подниматься, грубые изломы недопустимы.

Концептуализация

Чтобы создать хорошее пиксельное изображение, сначала нужно визуализировать объект мысленно или перенести на листок бумаги. Так будет легче перевести картинку в пиксели и не упустить мелкие детали.

Темы для размышления

Перед прорисовкой иллюстрации определитесь со следующими моментами:

1. В какой среде будет использоваться спрайт. Это, возможно, игра для ПК или мобильного телефона, или простое изображение для сайта.
2. В какой палитре оформить рисунок. Если соблюдение гаммы из-за соответствия системным требованиям не особо учитывается, то сочетаемость, точность цветов и соблюдение стиля достаточно важны. Игровой персонаж или объект должен гармонично вписываться в среду и не выделяться среди прочих объектов.

Контур

Контур создается 2 способами. Первый заключается в зарисовке от руки. При этом на панели выбирается кисть, карандаш или сходный инструмент, и выводятся целые линии. Потом уже готовый рисунок подправляют и доводят до совершенства. Вторая техника представляет собой прорисовку каждого отдельного пикселя. Чаще для создания контура выбирают черный цвет. Потому что он делает объект выразительнее и четче.

Шаг первый: черновой контур

Черновой контур создается с помощью инструментов рисования и мышки (планшета). Спрайт должен максимально точно отображать конечную задумку автора. Дальнейшая работа поможет лишь слегка подправить заготовку, а не полностью изменить ее.

Шаг второй: отполируйте контур

Эскиз увеличивают в 6-8 раз так, чтобы было видно пиксельную сетку. Теперь первичный контур нужно подчистить и удалить гуляющие точки. К ним относят зазубрины и слишком толстые линии. А идеальная толщина заготовки не должна превышать 1 пиксель. На этом этапе нужно убрать все лишнее и добавить недостающие мелкие детали. Важно помнить, что даже размер крупных объектов в пикселинге редко выходит за рамки 200х200 px.

Цвет

Черно-белый пиксель арт не пользуется большой популярностью. Поэтому после прорисовки эскиза перед автором появляется простая раскраска, которую необходимо заполнить цветом. Процедура выполняется кистью или заливкой, реже карандашом и по пикселям. Подобрать палитру самостоятельно сложно, особенно если делаешь рисунок в первый раз. Специалисты по пикселингу рекомендуют обратиться к базовым концепциям подбора цвета.

Цветовая модель HSB

Цветовая модель является базовой для большинства графических редакторов и обозначает «цвет, насыщенность, яркость». С ее помощью можно получить тысячи различных оттенков. Смысл заключается в том, что интенсивность и яркость цвета можно настроить от 1 до 100%. Таким образом, можно получить сотни вариантов красного или синего цвета. Согласно данной модели каждый оттенок имеет числовое обозначение.

Выбирая цвета

При выборе цветовой гаммы следует помнить следующие негласные правила:

1. Более тусклые оттенки дают реалистичную картинку. Слишком яркие и кислотные цвета подойдут для воссоздания мультяшной среды.
2. Чтобы правильно подобрать палитру, она зрительно представляется в виде колеса. Сочетаемость цветов прямо пропорциональна их удаленности друг от друга. Наиболее гармонично будут сочетаться оттенки, которые находятся рядом и наоборот.
3. Рекомендуется выбрать несколько основных цветов и строить на них иллюстрацию. Если использовать много цветовых вариантов, рисунок получится нечетким и отталкивающим.

Нанесение цветов

После того как выбрана основная цветовая гамма, можно приступать к раскраске элементов. Наносить цвета гораздо проще, чем прорисовывать контур. Для этого необходимо выделить нужную область и залить ее. Например, если пользоваться фотошопом, то выбрать область можно инструментом «палочка». А затем кликнуть по «заливке», определиться с нужным оттенком на палитре и щелкнуть по выделенной области. Далее подправить рисунок можно попиксельно в увеличенном режиме.

Шейдинг

Понятие «шейдинг» пришло из английского языка, что в переводе на русский означает наложение теней. Ведь если сделать пиксель арт без прорисовки теней, то спрайт получится плоским и нереалистичным.

Шаг первый: выбираем источник света

На первом этапе определитесь с источниками освещения и, соответственно, затемнения. Если на иллюстрации присутствуют лампы, солнце, факелы или костер, то учитывайте, какое влияние они окажут на объекты вокруг. В играх для компьютера часто используется большое светило. И это позволяет показать только переднюю и верхнюю стороны спрайта, а остальное спрятать в тени. Нередко за свет отвечают факелы. Тогда тени накладываются не только на двигающийся объект, но и интерьерные элементы.

Шаг второй: непосредственно шейдинг

После выбора типа освещения приступайте к затемнению участков рисунка. Начинают с наиболее отдаленных от источника мест. Это может быть задняя часть объекта, складки на одежде и изгибах тела и мускулатуры, нижняя часть лица и рук, тени от головных уборов и т.д. Другими словами, тени накладываются на все элементы спрайта, которым нужно придать дополнительный объем.

Шаг третий: мягкие тени

Для того чтобы затемненные участки смотрелись реалистичнее, создается своеобразный переход от светлых участков к темным. Делают это с помощью мягких теней. Инструмент позволяет сгладить неровности и сделать объект более естественным и легким для восприятия.

Шаг четвертый: освещенные места

На последнем этапе следует слегка высветлить места, куда попадают прямые лучи света. При этом важно соблюдать главное правило — теней и полутеней должно быть больше, чем хайлайтов.

Несколько полезных правил

Для создания грамотного шейдинга нужно следовать правилам:

1. Не следует использовать слишком много оттенков для затемнения или осветления спрайта. Многие ошибочно полагают, что это придаст рисунку реалистичность, а на деле получается наоборот. Достаточно выбрать 2 темных и 2 светлых оттенка.
2. Для создания теней не используют градиент. Он неправильно отражает переход от света к темноте и плохо смотрится на иллюстрации.
3. Мягкий шейдинг нельзя использовать рядом с контуром, это сместит источник освещения и сделает объект более плоским.
4. Близкие цвета добавляют размытости рисунку. Если у автора нет такой цели, для затемненных участков выбирают оттенок на несколько тонов темнее.

Дизеринг

Дизерингом называют еще одну технику получения теней и полутеней без использования дополнительных оттенков. В компьютерную графику методика сохранения цветов пришла из простой живописи, где художники заштриховывали затемненные участки. Данный способ позволяет получить среднее значение из 2 основных цветов.

Простой пример

Наиболее простой пример получается в черно-белом варианте, где в черном квадрате в шахматном порядке рисуют белые пиксели. Это один из нескольких способов смешивания цветов.

Продвинутый пример

Берутся несколько смежных цветов, например, от насыщенного до бледного красного. Теперь нужно визуально разделить цветовую линию на равные части и отбросить первую и последнюю части. В оставшуюся полосу нужно в шахматном порядке (или по другому узору) добавлять смежные цвета.

Применение

Лучшим примером использования дизеринга в компьютерной графике являются игры компании Sega. Большинство современных мобильных приложений отказались от данной методики. Но в случае необходимости техника позволяет рисовать пиксель арт объекты в стиле ретро.

Выборочное контурирование

Селаут, или выборочное контурирование является подвидом шейдинга и заключается в проработке контура. На данном этапе контур элементов спрайта прорисовывают не в черном цвете, а максимально приближенном к основному. Например, если у объекта синяя шапка, то контур будет на несколько оттенков темнее. Благодаря этому персонажи легче воспринимаются и вписываются в окружающую среду.

Техника 1: сглаживание изгибов

Методика сглаживания кривых линий заключается в нанесении ряда пикселей более светлого оттенка в местах, где есть изломы. Направление вспомогательной линии должно совпадать с маршрутом основного отрезка.

Техника 2: округление неровностей

Вторая техника выполняется аналогично первой, только дополнительные пикселы добавляются по кругу, что позволяет избавиться от неестественных заостренных конечностей.

Техника 3: затирание окончаний линий

Осветление окончаний линий дает возможность смягчить переход между элементами. Чаще всего способ применяется для отображения изгибов тела, одежды и создания полутеней.

Применение

Не рекомендуется затирать внешние контурные линии, иначе объект будет окружаться некоторым сиянием, которое вряд ли соответствует ожиданиям автора. Спрайт будет сильно выделяться на любом фоновом изображении.

Почему нужно делать это вручную

Ручная работа отнимает больше времени, чем применение фильтров. Однако ни один инструмент не даст такого же качества, как личная корректировка изображения. Встроенные возможности программ не способны учитывать погрешности, они лишь прорабатывают участок по заданным параметрам.

Отделка

Последним, но не менее важным моментом является окончательная дорисовка объекта. Окиньте свою работу взглядом и определите элементы, которые требуют доработки. На этом этапе учитываются все мельчайшие элементы и штрихи.

Программы для пиксель арта

Программы для создания пиксель артов представлены в виде компьютерных и мобильных графических редакторов. Все они имеют свои сильные и слабые стороны. Каждый начинающий художник пикселинга самостоятельно выбирает подходящую платформу для работы.

Adobe

Линейка продуктов от Adobe представлена множеством различных пакетов ПО для компьютера, интернета и сторонних гаджетов. Программы доступны в ознакомительных версиях, но для полноценной работы необходимо приобрести лицензию.

Adobe Photoshop

Adobe Photoshop является самым популярным продуктом компании, который используют по всему миру для создания и редактирования объектов. Фотошоп оснащен множеством инструментов, которые помогут довести до совершенства любое изображение. Если нет возможности нарисовать спрайт самостоятельно, можно загрузить в пиксельный конвертер готовое изображение, а затем подкорректировать его в фотошопе.

Microsoft

В стандартное программное обеспечение для компьютеров под управлением Windows входит графический редактор Paint, который тоже позволяет работать с пиксель артом. Инструмент имеет меньше возможностей, в сравнении с аналогами, но в нем все равно можно подкорректировать готовые иллюстрации или создать новые несложные спрайты.

Браузеры

Практически каждый существующий браузер позволяет установить плагин, который будет конвертировать изображения в произведения пиксельного искусства. Однако такие объекты требуют более детальной доработки и корректировки в специализированных программах. А также существует множество различных онлайн-программ, которые помогут нарисовать спрайт.

Мессенджеры

С развитием социальных сетей и различных мессенджеров стали популярными стикеры и гифы. Это небольшие изображения с надписями и анимацией. Все они созданы по технике пикселинга. С недавних пор разработчики приложений предоставили пользователям возможность создать собственные мини пиксель арт объекты и поделиться ими с друзьями.

PyxelEdit

Программа создана для художников пиксель арта и не перенасыщена бесполезными функциями. Каждый пользователь может настроить панель инструментов под себя. Цветовая палитра оснащена всеми необходимыми цветами и оттенками. ПО распространяется за отдельную плату. Но каждый клиент имеет возможность опробовать программу перед покупкой.

PixelFormer

По внешнему виду программа похожа на ранние версии фотошопа и оснащена облегченной панелью инструментов. В ней нет ничего лишнего — только все самое необходимое для пикселинга. Графический редактор интуитивно понятен в управлении и распространяется бесплатно.

GraphicsGale

Данный софт, помимо стандартных инструментов для пиксель арта, оснащен функцией анимирования картинок. Опция имеет ряд погрешностей, но несмотря на это, пригодна для работы.

Charamaker

Графический редактор позволяет рисовать отдельных персонажей и предметы, которые будут использоваться в других программах для создания иллюстраций. Создать полноценную картину здесь не получится. К тому же интерфейс программы менее удобный, чем у аналогов.

Pro Motion NG

Один из лучших редакторов для пикселинга. ПО оснащено «отзывчивым» интерфейсом, который выполняет все пожелания художника. Софт позволяет создать анимированную иллюстрацию с нуля без лишних затрат времени на поиски нужного инструмента. Программа распространяется на платной основе, но имеет пробную версию для ознакомления.

Aseprite

Aseprite считается лучшим приложением для создания пиксельных GIF-анимаций. К преимуществам относятся удобный интерфейс, отсутствие бесполезных вспомогательных опций, функция анимирования работает без сбоев. Для переключения рабочих инструментов можно применять горячие клавиши. Предоставляется в тестовом режиме с приобретением дальнейшей подписки.

Gimp

Бесплатный инструмент от Adobe, который позволяет рисовать пиксельные изображения. Обладает достаточным количеством опций, но нет анимации.

Остальное

Прочее ПО имеет сходный функционал и интерфейс. Однако не все программы оснащены функцией создания гифов.

Советы для начинающих пиксель артистов

Чтобы достичь совершенства, необходимо практиковаться. Не нужно сразу же браться за сложные объекты, начинайте с малого. Постарайтесь скопировать чужие работы, которые нравятся. А также следует помнить, что планшет и стилос для рисования гораздо удобнее компьютерной мыши.

PikoPixel / Рисование и редактирование изображений в стиле пиксель-арт (pixel-art images)

PikoPixel — растровый графический редактор, GNUstep (свободная реализация OpenStep) приложение для рисования и редактирования изображений в стиле пиксель-арт (pixel-art images).

Пиксельная графика — форма цифровой живописи, создаваемая с помощью растровых графических редакторов. Изображения, в пиксельной графике, редактируются на уровне пикселей (точек), а разрешение изображений настолько мало, что чётко видны отдельные пиксели.

Из за особенностей пиксельной графики PikoPixel содержит лишь набор простейших инструментов из имеющихся в полноценных графических редакторов. Редактор пост в использовании и не требует специальных знаний, пиксельные изображения можно рисовать «с нуля» и редактировать готовые (например иконок).

Функционал PikoPixel распределён по меню и модулям, в которых расположены самые востребованные в процессе рисования инструменты. Помимо основного окна (настраиваемого холста) можно запустить модуль инструментов рисования (карандаш, ластик, заливка и пр), модуль выбора цвета, модуль слоёв и предварительного просмотра.

Пиксельную графику обычно сохраняют в форматах «без потерь«, для того чтобы каждый пиксель изображения сохранить без потери точности. PikoPixel поддерживает линейное (гамма правильное) смешивание цветов, позволяет сохранять незаконченное изображение в собственном формате PIKO (*.piko), сохраняющего изображение и открытые инструменты.

PikoPixel позволяет экспортировать изображения в графические форматы PNG, TIFF, GIF, JPEG и BMP, можно экспортировать одно изображение с разным масштабом, например если для проекта требуется одно изображение в разных размерах (например иконки).

PikoPixel поддерживает неограниченное количество операций повтора/возврата внесённых изменений (Undo/Redo), для управления используется мышь и/или клавиатурные сочетания (частично настраиваемы), имеется модуль с «Советами«.

Лицензия: GNU Affero General Public License (AGPL v3)

Домашняя страница

Pixel art в GIMP для начинающих

Это адаптация урока по созданию pixel art в Фотошопе. Статья оставлена практически в первозданном виде. Публикация и адаптация согласованы с автором, но с аккаунта на этом сайте он вряд ли ответит.

1. История пиксель арта (очень коротко)

Юрий Гусев, он же Fool.

Pixel art (пишется без дефиса) или пиксельная графика — направление цифрового искусства, которое заключается в создании изображений на уровне пикселя (т. е. минимальной логической единицы, из которой состоит изображение). Далеко не все растровые картинки являются пиксель артом, хотя все они и состоят из пикселей. Почему? Потому что в конечном счёте понятие pixel art вмещает в себя не столько результат, сколько процесс создания иллюстрации. Пиксель за пикселем, и только так. Если вы возьмёте цифровое фото, сильно его уменьшите (так, чтобы пиксели стали видны) и заявите что нарисовали его с нуля — это будет настоящий подлог. Хотя наверняка найдутся наивные простаки, которые вас похвалят за кропотливый труд.

Это — не pixel art. Хотя изображение цифровое, создано с помощью компьютера и состоит из пикселей — оно НЕ рисовалось на уровне точек. К сожалению, практически недоказуемо, потому что автор всегда может заявить обратное. Вот почему на конкурсах по пиксельной графике обычно одно из условий -предоставить иллюстрацию на разных этапах работы (WIP — work in progress).

Сейчас неизвестно, когда точно зародилась эта техника, корни теряются где-то в начале 1970-х. Однако приём составления изображений из малых элементов восходит к куда более древним формам искусства, таким как мозаика, вышивание крестиком, ковроплетение и бисероплетение. Само же словосочетание «pixel art» как определение пиксельной графики впервые было использовано в статье Адель Голдберг и Роберта Флегала в журнале Communications of the ACM (декабрь 1982-го).

Разновидность пиксель арта — т. н. line art. Неизвестный автор.

Наиболее широкое прикладное применение pixel art получил в компьютерных играх, что неудивительно — он позволял создавать изображения, нетребовательные к ресурсам и выглядящие при этом по-настоящему красиво (при этом отнимающие у художника немало времени и требовавшие определённых навыков, а потому подразумевающие хорошую оплату труда). Расцветом, наивысшей точкой в развитии официально называют видеоигры на приставках 2-го и 3-го поколения (начало 1990-х). Дальнейший прогресс технологий, появление сперва 8-битного цвета, а затем и True Color, развитие трёхмерной графики — всё это со временем оттеснило pixel art на второй и третий планы, а потом и вовсе стало казаться, что пиксельной графике пришёл конец.

Наивысшая точка развития pixel art’а в видеоиграх. Хотя официально апогей приписывают 2-му и 3-му поколениям, на мой взгляд он пришёлся несколько позже. Именно на приставках 4-го поколения (Sega MD, SNES, TurboGrafx-16 и Neo Geo) вышли игры с самой красивой и безупречной по технике пиксельной графикой. Это несмотря на то, что технология наступала на пятки и повсеместно предпринимались попытки ввести в игры full motion video, а также спрайты, созданные на основе фотографий, видеоматериалов и заранее визуализированных 3D-моделей.

Как ни странно, но именно господин Научно-технический прогресс, задвинувший в середине 90-х пиксельную графику на последние позиции, и вернул её позже в игру — явив миру мобильные устройства в виде сотовых телефонов и КПК. Ведь каким бы полезным ни был новомодный дивайс, мы-то с вами знаем — если на нём нельзя хотя бы разложить пасьянс, грош ему цена. Ну а там где есть экран с невысоким разрешением, там и pixel art. Как говорится, добро пожаловать назад.

У дизайнеров из «eBoy» было трудное детство, они провели его в восточной Германии и были начисто лишены возможности наслаждаться изящными искусствами. Потому не научились рисовать ничего кроме пиксельной графики. Но главная их заслуга — они убедили рекламодателей, что pixel art это модно и круто. Если по мнению дизайнеров из «eBoy» ГДРовские игрушки и одежда были некрасивыми — интересно, что бы они сказали про советские?

Разумеется, свою роль в возвращении пиксельной графики сыграли различные ретроградно настроенные элементы, любящие поностальжировать над старыми-добрыми играми детства, приговаривая при этом: «Эх, теперь такого не делают»; эстеты, способные оценить красоту пиксель арта, и инди-разработчики, не воспринимающие современные графические красоты (а иногда, правда редко, элементарно не умеющие их реализовать в собственных проектах), оттого и ваяющие pixel art. Но давайте всё-таки не будем сбрасывать со счетов сугубо коммерческие проекты — приложения для мобильных устройств, рекламу и web-дизайн.

Еще одна заметная фигура — голландец Хэнк Ниебург, начавший карьеру пиксельного художника аж в 1989-м. В конце 90-х был вынужден зарабатывать на жизнь вебдизайном и едва сводил концы с концами, но с 2000-го снова рисует pixel art, теперь уже для мобильных игр.

Так что сейчас pixel art, что называется, широко распространён в узких кругах и заработал себе своеобразный статус искусства «не для всех». И это несмотря на то, что для простого обывателя он предельно доступен, ведь чтобы работать в этой технике, достаточно иметь под рукой компьютер и простейший графический редактор! (умение рисовать, между прочим, тоже не помешает) Хватит слов, ближе к делу!

Pixel dolls, развлечение для взрослых девочек, ненаигравшихся в куклы. Кроме шуток, это тоже pixel art, и работы некоторых авторов вызывают восхищение как среди фанатов пиксельной графики, так и среди ценителей прекрасного. pixparadise.net

2. Графический редактор

Что нужно для создания пиксель арта? Как сказал выше, достаточно компьютера и любого графического редактора, способного работать на уровне пикселей. Рисовать можно где угодно, хоть на Game Boy, хоть на Nintendo DS, хоть в Microsoft Paint (другое дело, что рисовать в последнем крайне неудобно). Есть великое множество растровых редакторов, многие из них бесплатны и достаточно функциональны, так что с программным обеспечением каждый может определится самостоятельно.

Microsoft Paint — оружие последнего шанса, когда рисовать уже совсем негде. Это «круги», во всяком случае Paint считает именно так. Особенно примечателен уродец в центре, который даже не симметричен.

GIMP прекрасно подходит для создания пиксель арта, для этого есть инструмент «Карандаш», в котором можно использовать и динамику рисования, а заливать цветом можно при помощи инструмента «Заливка». Если запереть альфа-канал слоя, то можно заливать одним цветом несвязанные области на всём слое просто перетаскивая цвет из палитры на холст.

Итак, вам нужен любой графический редактор, позволяющий рисовать инструментом в один квадратный пиксель (пиксели бывают и неквадратные, например круглые, но они нас в данный момент не интересуют). Если ваш редактор поддерживает какой-никакой набор цветов — отлично. Если также позволяет сохранять файлы — просто замечательно. Хорошо бы еще умел работать со слоями, поскольку работая над достаточно сложной картинкой, удобнее разложить её элементы по разным слоям, но по большому счёт это вопрос привычки и удобства.

Тоже своего рода пиксель арт, картина составлена из… кубиков Рубика! 1330 кубиков, размер полотна 116×107 см, автор Джон Куигли (John Quigley).

Начнём? Вы наверное ждёте списка каких-то секретных приёмов, рекомендаций, которые научат вас рисовать pixel art? А правда в том, что ничего такого по большому счёту нет. Единственный способ научиться рисовать пиксельную графику — это рисовать самому, пробовать, пытаться, не бояться и экспериментировать. Не стесняйтесь повторять чужие работы, не бойтесь показаться неоригинальным (просто не выдавайте чужое за своё, хе-хе). Внимательно и вдумчиво анализируйте работы мастеров (не мои) и рисуйте, рисуйте, рисуйте. Несколько полезных ссылок вас ждёт в конце статьи.

3. Общие принципы пиксель арта

И всё же существует несколько общих принципов, знать которые не помешает. Их действительно немного, я называю их «принципами», а не законами, потому что они носят скорее рекомендательный характер. В конце-концов, если у вас получится нарисовать гениальную пиксельную картинку в обход всех правил — кому до них дело?

Самым основной принцип можно сформулировать так: минимальной единицей изображения является пиксель, и по возможности все элементы композиции должны быть соразмерны ему. Расшифрую: всё, что вы нарисуете, состоит из пикселей, и пиксель должен читаться во всём. Это не значит, что в рисунке вообще не может быть элементов, к примеру, 2×2 пикселя, или 3×3. Но строить изображение всё же предпочтительно из отдельных пикселей.

Для наглядности приведу несколько примеров с типичными ошибками и вариантами их исправления:

За исключением ладоней у человечка, которые вроде как являются авторской задумкой, все элементы, в которых толщина линии превысила 1 пиксель, нужно исправить.

Ноги у человечка лучше выглядеть не стали, это верно, к ногам еще вернёмся. В качестве примера «из жизни» приведу онлайновый паззл Zoo keeper:

http://pc.kiteretsu.jp/games/zka/zka.htm

Почему художник решил сделать обводку в два пикселя, в то время как сами элементы нарисованы попиксельно? Возможно, хотел отделить тайлы от фона. А прочую внутриигровую графику рисовал с той же жирной обводкой, чтобы сохранить единую стилистику, плюс такая явная обводка придаёт изображению некую выразительность. Тем не менее — что называется, не наш метод.

Кадр из игры Duct. Казалось бы, всё в порядке, но толщина обводки и прочих элементов рисунка всюду колеблется между 1-м и 2-мя пикселями.

Из этого принципа можно вывести простое правило: обводка и вообще все линии рисунка должны быть толщиной в один пиксель (за редким исключением).

То самое исключение, Jimmy Two Shoes. Здесь пиксельная графика стремится повторить стиль оригинального мультфильма, на персонажах которого основана игра, и в котором все персонажи имеют чётковыраженную обводку.

Я вовсе не утверждаю, что это неправильно. Но это всё же не очень красиво. А чтобы было красиво, запомним еще одно правило: рисовать без изломов, скруглять плавно. Есть такое понятие как изломы — фрагменты, выбивающиеся из общего порядка, они придают линиям неровный, зазубренный вид (в англоговорящей среде пиксельных художников их называют jaggies):

Изломы лишают рисунок естественной плавности и красоты. И если фрагменты 3, 4 и 5 очевидны и исправляются легко, с прочими дело обстоит сложнее — там нарушена длина одного-единственного кусочка в цепи, казалось бы мелочь, но мелочь заметная. Чтобы научиться видеть такие места и избегать их, требуется небольшая практика. Излом 1 выбивается из линии, потому что это единичный пиксель — в то время как на участке, где он затесался, линия состоит из сегментов по 2 пикселя.

Чтобы избавиться от него, я смягчил вход кривой в изгиб, удлинив верхний сегмент до 3-х пикселей, и перерисовал всю линию сегментами по 2 пикселя. Изломы 2 и 6 идентичны друг другу — это уже фрагменты длиной 2 пикселя на участках, построенных единичными пикселями.

Избежать подобных изломов при рисовании поможет элементарный набор примеров наклонных прямых, который можно встретить практически в каждом руководстве по пиксельной графике (моё не исключение):

Как видите, прямая линия составляется из отрезков одинаковой длины, смещаемых по мере её прорисовки на один пиксель — только таким образом достигается эффект линейности. Наиболее распространённые способы построения с длиной отрезка 1, 2 и 4 пикселя (встречаются и другие, но представленных вариантов должно хватить для реализации практически любой художественной задумки). Из этих трёх самым популярным можно уверенно назвать длину отрезка в 2 пикселя: рисуем отрезок, сдвигаем перо на 1 пиксель, рисуем еще один отрезок, сдвигаем перо на 1 пиксель, рисуем еще отрезок:

Несложно, верно? Нужна лишь привычка. Умение рисовать наклонные прямые с шагом в 2 пикселя поможет в изометрии.

Вообще прямые линии это здорово — но только до тех пор, пока не встанет задача нарисовать что-нибудь нерукотворное. Тут нам понадобятся кривые, и много самых разных кривых. И берём на вооружение простое правило закругления кривых линий: длина элементов кривой должна уменьшаться/увеличиваться постепенно.

Выделенные красным участки нарушают плавность скругления, потому что их длина резко выбивается из длины соседних фрагментов.

Выход из прямой на скругление ведётся плавно, я обозначил длину каждого сегмента: 5 пикселей, 3, 2, 2, 1, 1, снова 2 (уже вертикально), 3, 5 и далее. Не обязательно ваш случай будет использовать такую же последовательность, здесь всё зависит от плавности, которая требуется. Еще пример скругления:

Опять же, избегаем изломов, которые так портят картинку. Если есть желание проверить усвоенный материал, здесь у меня нарисованный неизвестным автором skin для Winamp’а, заготовка:

На рисунке есть и грубые ошибки, и просто неудачных скругления, и изломы встречаются — попробуйте исправить картинку на основе того, что уже знаете. На этом с линиями у меня всё, предлагаю немного порисовать.

И пусть вас не смущает простота примеров, научиться рисовать можно только рисуя — даже такие простейшие вещи. Те же eBoy составляют свои огромные красивые картины из мелких деталей, многие из которых нарисованы отдельно друг от друга.

4. Практикуемся в рисовании

4.1. Рисуем склянку с живой водой

1. Форма объекта, пока можно не использовать цвет.

2. Красная жидкость.

3. Меняем цвет стекла на голубой, добавляем затенённые участки внутри пузырька и светлый участок на предполагаемой поверхности жидкости.

4. Добавляем белые блики на пузырьке, и тень шириной 1 пиксель тёмно-красного цвета на приграничных к стенкам пузырька областях жидкости. Смотрится вроде неплохо, а?

5. Аналогично рисуем склянку с синей жидкостью — здесь тот же цвет стекла, плюс три оттенка синего для жидкости.

4.2. Рисуем арбуз

1. Нарисуем круг и полукруг — это будут арбуз и вырезанная долька.

2. Обозначим вырез на самом арбузе, а на дольке — границу между корочкой и мякотью.

3. Заливка. Цвета из палитры, средний оттенок зелёного — цвет корки, средний красный — цвет мякоти.

4. Обозначим переходный участок от корки к мякоти.

5. Светлые полосы на арбузе (наконец-то он похож сам на себя). И конечно — семечки! Если скрестить арбуз с тараканами, будут расползаться сами.

6. Доводим до ума. Бледно-розовый цвет используем для обозначения бликов над семечками в разрезе, и, выкладывая пиксели в шахматном порядке, добиваемся от вырезанной дольки некоего подобия объёма (метод называется dithering, о нём позже). Тёмный красный оттенок используем, чтобы обозначить затенённые места в разрезе арбуза, и тёмно-зелёный (опять же пиксели в шахматном порядке) — чтобы придать объём самому арбузу.

5. Dithering (смешивание цветов)

Дизеринг, или смешивание — техника перемешивания определённо упорядоченным (не всегда) образом пикселей в двух граничащих областях разного цвета. Самый простой, распространённый и эффективный способ — чередовать пиксели в шахматном порядке:

Приём появился на свет благодаря (или скорее вопреки) техническим ограничениям — на платформах с ограниченными палитрами дизеринг позволял, замешивая пиксели двух разных цветов, получить третий, отсутствующий в палитре:

Наложение на участок красного цвета синих пикселей в шахматном порядке создаёт иллюзию фиолетового цвета.

Но и позже, когда количество цветов перестало быть проблемой, дизеринг можно было видеть в видеоиграх в роли тени (чтобы не нагружать железо полупрозрачностью, художники часто обозначали тень участком чёрных пикселей, расположенных в шахматном порядке и накладывавшихся на фон).

Game Boy, 4 цвета (чёрный, белый и два оттенка серого). Настоящий вызов художнику!

Сейчас, в эпоху безграничных технических возможностей, многие говорят что необходимость в дизеринге отпала сама собой. Однако грамотное его использование может придать вашим работам характерный ретро-стиль, узнаваемый всеми любителями старых видеоигр. Лично я люблю использовать dithering. Не очень хорошо им владею, тем не менее, люблю.

Еще два варианта дизеринга:

Расширенная версия базового дизеринга, с заводом отдельных пикселей смешиваемых цветов.

Продвинутая версия, позволяет получить наиболее плавный переход от одного цвета к другому (путём кропотливого отрисовывания).

Что нужно знать про дизеринг, чтобы уметь им пользоваться. Минимальная ширина зоны смешивания должна быть не меньше 2-х пикселей (те самые шашечки). Больше — можно. Меньше лучше не делать.

Ниже пример неудачного дизеринга. Несмотря на то, что подобную технику можно часто встретить на спрайтах из видеоигр, нужно отдавать себе отчёт в том, что телевизионный экран существенно сглаживал изображение, и такая гребёнка, да еще в движении, глазом не фиксировалась:

Ну, хватит теории. Предлагаю еще немного попрактиковаться.

6. Более сложные примеры

6.1. Рисуем меч

Такой несерьёзный меч для несерьёзного проекта:

1. Форма. Здесь всё просто.

2. Начинаем распределять цвет. Я изменил изначально чёрный на цвет тёмной стали (хочется верить, что похожий) и залил меч серым.

3. Придаём форму за счёт светотени и дополнительной расцветки (обратите внимание — я кое-где повторно изменил цвет обводки, сделав его еще светлее). Условимся, что свет на меч падает слева-сверху, из-за плеча наблюдающего, поэтому блики (наиболее светлые участки освещённых поверхностей) располагаются на выступающих элементах слева, тени — справа и снизу.

4. Доводим наш миниатюрный шедевр до совершенства. Усиливаем эффект объёма на яблоке и сферических элементах крестовины (левый и правый «шарики»), на обмотке рукояти. Обратите внимание на длинную полосу, идущую по лезвию — дол (некоторые называют его кровотоком, полагая, что он служит для стекания крови проткнутого врага). Название здесь неважно, суть в том, что это жёлоб и центральная его часть освещена меньше всего, в то время как края наоборот. Справа от дола, чтобы усилить эффект глубины, я обозначил чёткий блик (никогда нелишне хорошенько изучить объект, который вы собираетесь изобразить — не для того чтобы сыпать терминами, а чтобы иметь чёткое представление об устройстве и особенностях конструкции). Вроде получился довольно симпатичный меч, а?

5. Я не стал останавливаться на достигнутом и сильно состарил наше оружие, вообразив, как мог бы выглядеть клинок, пролежи он сотню лет в подземелье. Цвета заменены более тёмными (соседними из той же палитры), я ввёл больше чёрного (на предыдущем рисунке лишь три действительно чёрных точки, одна на стыке дола с крестовиной усиливала эффект глубины тени, две другие подчёркивали обмотку рукояти). Выбоины и сколы на лезвии, крестовина и яблоко серьёзно повреждены (наверняка в жестокой сечи), обмотка рукояти порвана. В общем, перед нами настоящая древность. Придумаем достойную легенду и поставим на видном месте, как семейную реликвию.

6.2. Робот

Один из самых распространённых способов рисования «с нуля» — изобразить черновой вариант (не попиксельно, а традиционно, рисуя либо мышью, либо на планшете), а после почистить его, исправить (при необходимости) и довести до ума. Также часто художники рисуют на основе своих бумажных черновиков, карандашных рисунков, набросков и прочих «почеркушек» — сканируют их и обрисовывают попиксельно. Дело привычки. Я обычно начинаю с чернового наброска:

Теперь чистка, стираю лишние пиксели и дорисовываю недостающие:

Закругление согласно простому правилу плавности, все прямые линейные. Добавляю ноги:

На самом деле рисовать полноценные конечности, честно говоря, поленился. Хотелось поскорее закончить урок, плюс массивный робот на тонких ножках — по-моему достаточно забавно. Помимо того, что ноги нарисованы обыкновенными прямыми (что здорово сэкономило мне время), я не стал придавать им объём — это не цилиндры, а пока что обычные плоские прямоугольники. Объёма добьюсь позже, с помощью теней и бликов. Кстати, еще одна хитрость, на которую пошёл сознательно — бедро левой ноги построено в точности как голень правой, и наоборот, так что фактически, вместо того чтобы нарисовать четыре цилиндра, я схитрил и нарисовал два наклонных прямоугольника.

Дополнительный элемент в виде панели на груди и трёх… лампочек? Не знаю, пока не решил. Но понял, что хочу сделать торс робота телескопическим, как раскладной стаканчик, поэтому пришлось слегка откорректировать линию изгиба, добавив небольшие но заметные зазоры на стыке сегментов. Теперь заливка!

Основной цвет, плюс я заменил цвет обводки с чёрного на тёмно-синий. Смотрится по-прежнему пустовато, но это ничего, исправлю тенями. Условлюсь, что источник света где-то за сверху за моим левым плечом, следовательно, тени лягут в основном справа и снизу. Сначала грудь, как самый крупный элемент:

Тень накладываю в 2 этапа, сперва самую тёмную, участком шириной максимум 3-4 пикселя (т. е. от линии обводки вглубь объекта, в данном случае, тень занимает область шириной 3, самое большое 4 пикселя. Это не закономерность, цифры запоминать не нужно, для другого предмета с другим освещением, другим материалом и другим настроением тень наверняка ляжет иначе). Далее более светлая тень, так же как и основная плавно сходящая на нет. Обратите внимание, на закруглённых участках груди тень кое-где лежит совсем небольшими фрагментами, по одному пикселю — это также придаст рисунку больше плавности.

Особое внимание обращаю на грудную панель: теневые участки толщиной в 1 пиксель, на освещённой кромке появляется чёткий блик, для которого использую самый светлый цвет из палитры.

Также приглядитесь к глазам, у них уже есть блики, основной цвет и тень. Кладу тень по всему роботу:

Теперь блики на поверхностях, которые должны отразить свет от источника прямо в глаза наблюдателю (художнику):

Хм, совсем другое дело. Даже прямоугольники-ножки выглядят как цилиндры! Я решил, что три кружка на груди могучего робота будут ракетницами, закрытыми люками, так что это по сути небольшие углубления; тень от левой кромки и блик по правой (и нижней).

Здесь сложно давать какие-либо советы, кроме одного — учитесь рисовать, изучайте тени, теорию света. Двигаемся дальше, дизеринг:

Выбираем любую границу между двумя цветами и выкладываем пиксели этих цветов в шахматном порядке. Самые светлые пятна я оставил без дизеринга, что подчёркивает резкость блика. Также дизеринга нет на ногах — слишком миниатюрные элементы, его там просто негде выкладывать. Теперь финальный штрих, заклёпки, обозначающие зубы, и игривая антенна:

Если внимательно рассмотреть заклёпки-зубы, видно, что это всего лишь фрагменты 2 на 2 пикселя, верхний левый окрашен в цвет бликов, два соседних с ним — цвет светлой тени, и правый нижний — цвет основной тени. Просто, да? При этом даже несмотря на то, что в некоторых местах пиксели заклёпок совпадают с цветом соседних точек, при отдалении (уменьшении масштаба рисунка до 100 или 200%) сохраняется полное впечатление того, что это выделяющиеся объекты. Еще в палитре появился дополнительный близкий к чёрному оттенок — я решил с его помощью сделать темнее суставы на ногах, и замешать в шахматном порядке пиксели в суставы на руках. Чистый чёрный я попробовал, тень получалась неестественной, а дизеринг с самым тёмным оттенком дал нужный эффект.

Ну и самый последний штрих, мне кажется, левая рука расположена не очень удачно — вырезаю её и сдвигаю вниз и влево. Вот так, кажется, самое то:

WIP, тот самый Work in Progress:

Собственно, на этом всё. Ну а напоследок несколько полезных ссылок:

Сделай сам: пиксельная живопись | Остроумие и свисток

На днях, редактируя некоторые из моих исландских фотографий, я случайно уменьшил размер фотографии до 15 пикселей в ширину вместо 1500 пикселей, и мне понравилось то, что я увидел. Всего несколько цветовых блоков смогли сохранить настроение фотографии, даже если детали были полностью потеряны. Прежде чем я осознал это, я начал брать свои акварели. Этот проект прост, но, если вы ненавидите скуку, можете пропустить его. Я тяготею к трудоемким, монотонным задачам (особенно когда они дают прекрасный конечный результат), поэтому мне очень понравился процесс.

Вам понадобится:

цифровая фотография
программное обеспечение для редактирования фотографий
базовые математические навыки
линейка
карандаш
акварельная бумага
квадратный наконечник акварельной кисти
акварели

Как:

Сначала откройте фотографию, с которой хотите работать, в Photoshop (или в другой программе для редактирования фотографий).Измените размер изображения примерно до 10–20 пикселей в ширину и увеличивайте масштаб, пока не увидите отдельные пиксели. Поиграйте с разной шириной, чтобы увидеть, что вам больше всего нравится. Чем больше ваше изображение, тем больше деталей будет в вашей картине, и тем больше у вас будет времени на рисование. Для меня ширина 12 пикселей была золотым пятном, которое дало мне желаемое количество деталей, не пугая меня. Возможно, вам придется поэкспериментировать с несколькими фотографиями, прежде чем вы найдете ту, которая будет интересно смотреться в упрощенном виде в пикселях.

Здесь вам понадобятся ваши математические навыки. Завершив работу над изображением, с помощью линейки и карандаша нарисуйте сетку на бумаге. В сетке должно быть столько прямоугольников, сколько пикселей на вашей фотографии, но она все равно должна уместиться на вашем листе бумаги. Моя сетка в итоге состояла из квадратов 0,75 дюйма.

Возьмите краски и кисть. Держите под рукой свою пиксельную эталонную фотографию и раскрасьте каждый квадрат сетки в цвет соответствующего пикселя. В этом проекте прекрасно поработали акварели.Я мог легко смешивать и настраивать цвета, и эффект от сбора краски по краям каждой коробки был великолепен. Лучше всего раскрасить все остальные коробки, дать им высохнуть, а затем вернуться и покрасить те, которые вы пропустили, чтобы акварели не перетекли друг в друга. Не беспокойтесь о том, чтобы идеально оставаться в линиях или смешивать точные цвета. Несовершенства — вот что придаст вашей работе глубины.

После нескольких часов рисования квадратов ваши глаза могут начать пересекаться, но не останавливайтесь! Оно того стоит, когда у вас получится аккуратная картина.

Как вы думаете? Вы собираетесь сделать свой собственный? Мне очень нравится, как это получилось. Думаю, мне придется пойти по магазинам рамок.

Пиксель-арт: 31 ретро-пример

Пиксельное искусство — это тип цифрового искусства, который восходит к ранним дням компьютерной графики, когда на экране было только ограниченное количество пикселей, и поэтому любые созданные вами визуальные эффекты выглядели довольно грубо и блочно. Однако то, что когда-то было отрицательным, теперь стало положительным, поскольку поколение, ностальгирующее по графике игр 1980-х и 1990-х годов, возвращает этот стиль к жизни новыми и интересными способами.

Здесь мы собрали некоторые из лучших пиксель-артов. Они варьируются от откровенных дани любимым видеоиграм до использования подхода пиксельной графики для создания чего-то оригинального и нового. Как и в случае с Lego Art, кажется, что у творцов бесконечное количество способов заново изобрести дисциплину и привнести в нее свой уникальный взгляд.

Хотите создать свой собственный пиксель-арт? Тогда не нужно тратиться на дорогие инструменты. Просто ознакомьтесь с нашей подборкой лучших бесплатных программ для графического дизайна.А если вы хотите сделать из этого карьеру, ознакомьтесь с нашим руководством о том, как проникнуть в пиксельное искусство.

01. Рыцари Сидонии. Автор Йохан Аронсон.

Культовый японский комикс и анимация вдохновили на создание этого классного пиксельного искусства. (Изображение предоставлено Йоханом Аронсоном)

Арт-директор студии в игровой студии Mojang, Йохан Аронсон хорошо известен своим миром -классная 2D пиксельная графика. Это привлекательное произведение искусства отдает дань уважения рыцарям Сидонии, новаторской серии манги о космической опере, созданной Цутому Нихей, которая породила аниме-сериал, который привлек внимание поклонников в сообществе разработчиков игр.

02. Пейзаж от Jubilee

Этот потрясающий пейзаж был вдохновлен Studio Ghibli (Изображение предоставлено: Jubilee)

Jubilee — один из наших любимых художников по пикселям прямо сейчас, за то, что сумел объединить пиксельную графику с живописным подходом и создать работы, которые кажется одновременно знакомым и свежо оригинальным. Вдохновленный анимацией Studio Ghibli, этот пейзаж полон волшебных надежд.

03. Храм в джунглях Рихарда Шмидбауэра

Как и многие создатели пиксельной графики, видеоигры оказали большое влияние на Шмидбауэра (Изображение предоставлено Ричардом Шмидбауэром)

Художник-фрилансер из Германии, Ричард Шмидбауэр разработал чистый пиксельный стиль. искусство, которое опирается на ограничения среды для создания красивых импрессионистических произведений.Эта вызывающая воспоминания сцена в Храме в джунглях с явным влиянием компьютерных игр является отличным примером его подхода.

04. Пиксельные горы Китая. Автор: Матей Ян.

Ян говорит, что в его пиксельной графике искусство на первом месте, пиксели на втором месте (Изображение предоставлено: Матей Ян)

Матей Ян начал рисовать в цифровом виде на своем компьютере ZX Spectrum в 1990-х годах. и теперь редактирует блог, посвященный пиксельной графике, под названием Retronator. Его собственные работы варьируются от изображений, наполненных остроумными отсылками к поп-культуре, до детализированных пейзажей, которые доводят среду до предела, таких как эти восхитительные пиксельные горы Китая.

05. The Witness by Pixel Джефф

The Witness основан на сериале Netflix «Любовь, смерть и роботы»

Пиксель Джефф — профессиональный пиксельный художник из Тайваня, чье портфолио разнообразное и яркое, от городских пейзажей до принцесс Диснея. The Witness — это дань уважения сериалу Netflix «Любовь, смерть и роботы» в стиле пиксель-арта, в котором чувствуется динамичная видеоигра, в которую нам не терпится поиграть!

06. Корпорации Кензе Ви Хон Минг

Пиксельное искусство в его самой атмосферной и сложной форме

Внештатный иллюстратор из Сингапура Кенз Ви Хон Мин имеет впечатляющее портфолио работ на своей странице на Behance.Вдохновленный искусством Ромена Тристрама, его искусство сосредоточено в разных местах по всему миру.

07. Pixel Art TV от Густаво Визельнера

Новое представление о странных вещах в пиксельной форме

Густаво Визельнер — израильский художник-пиксельщик, и в его сериале Pixel Art TV запечатлены ключевые сцены классических телешоу, сопровождаемые цитатами из диалогов. Очаровательный сериал охватывает целый ряд жанров, от современных шоу, таких как Игра престолов, Во все тяжкие и Очень странные дела, до старых фаворитов, таких как «Друзья» и «Свежий принц Бель-Эйр».

08. Emotive Pixels от Prateek Vatash

Дизайн Vatash выводит пиксельную графику в новое измерение

Этот прекрасный геометрический дизайн является частью текущего проекта индийского графического дизайнера Prateek Vatash. Здесь Vatash выводит пиксельную графику на новое измерение, переходя от плоских пикселей к одноцветным кубам, сохраняя при этом ощущение ретро.

09. Pixel Britain by Holiday Cottages

Восемь типично британских сцен получили ретро-макияж в этой коллекции 16-битных пиксельных изображений для рекламы дачных домов.co.uk. В наборе изображены локации по всей Великобритании, от Белых скал Дувра до Гленфиннианского виадука, как если бы их прогрызла и выплюнула Atari.

10. Pixelomics

Душан Чежек — чешский художник-пиксельщик, за плечами которого несколько суперпопулярных 8-битных пиксельных проектов. Приведенный выше GIF взят из его коллекции супергероев Pixelomics, и довольно удивительно, сколько пикселей ему нужно, чтобы сделать его персонажей мгновенно узнаваемыми.

11. Темная сторона, Роман Гонзо

Противостояние злодеев из «Звездных войн», которое мы все хотели бы видеть в пиксельной форме

Украинский аниматор Роман Гонзо заработал репутацию создателя превосходного пиксельного искусства, который он создает используя Photoshop на своем Wacom.На этом изображении запечатлены стилизованные версии злодеев из «Звездных войн» Дарта Мола, Джанго Фетта и Дарта Вейдера.

12. Street Fashion Fighter от Joojaebum

Street Fashion Fighter сочетает знаменитую моду с аркадной перфорацией

Южнокорейский дизайнер Джуджэбом впервые привлек наше внимание великолепным взглядом на классическую аркадную игру Street Fighter 2. В своих последующих проектах Street Fashion Fighter, художник представил главных героев игры образцом современных знаменитостей, включая Дрейка, Канье Уэста и Фаррелла Уильямса.

13. Введение в пиксельное искусство от Мишко

Глючный психоделический поворот в пиксельном искусстве

Неван Дойл, также известный как Мишко, видеооператор, графический дизайнер и фотограф из Орегона, специализирующийся на привлекательных абстрактных рисунках со случайными прикосновение крутого глюка. Его Intro to Pixel Art смешивает пиксельные техники с глюками, гранджем и визуальной обратной связью для получения потрясающего эффекта.

14. Science Kombat, Диего Санчес

Диего Санчес — бразильский иллюстратор из Сан-Паулу, который хорошо разбирается в пиксельной графике.Нам особенно нравятся эти анимации, которые он создал для Science Kombat, браузерной игры жанра beat-em-up для журнала Superinteressante. В нем участвуют восемь игровых ученых, включая Альберта Эйнштейна, Чарльза Дарвина, Мари Кюри и сэра Исаака Ньютона, каждый из которых имеет свои собственные базовые и специальные атаки.

15. Моана, Pixel Jeff

Нам так нравится работа Pixel Jeff, что мы не можем ограничиться одной записью в этом списке. Итак, вот его красочный взгляд на «Моану» Диснея, красиво переосмысленную как видеоигру, которую мы хотели бы иметь возможность на самом деле планировать.Прокрутите его сообщение в блоге, и вы увидите другие забавные варианты блокбастеров.

16. Bopping Pixels, Ян Диксон

Вы когда-нибудь задумывались, как бы выглядели ваши любимые персонажи, если бы они были уменьшены до пикселей и подпрыгивали вверх и вниз? Неудивительно, ведь пиксельный иллюстратор и создатель GIF Айвен Диксон обратил свое внимание на всех, от принца Джеффри до Олова Тина в своем странно завораживающем проекте Bopping Pixels.

17. «Звездные войны», Густаво Визельнер

«Звездные войны. Эпизод IV: Новая надежда» в пиксельной графике

Еще одна замечательная работа Густаво Визельнера, это одна из его многочисленных дань уважения далекой-далекой галактике.Мнения по поводу некоторых приквелов и сиквелов могут расходиться, но каждый фанат «Звездных войн» может заглянуть за эту сцену из оригинального фильма 1977 года, поскольку Оби-Ван обучает Люка и Чуи и C-3PO игре в голографические шахматы.

18. Pixel Dailies от Бена Портера

В рамках этого годичного проекта были созданы One 365 пиксель-арта.

Разработчик игр Бен Портер настолько любит пиксельное искусство, что он основал Pixel Dailies, онлайн-клуб пиксельной графики. Каждый день он твитнул какую-то тему, и другие участвовали в создании иллюстраций на эту тему.Он поддерживал это в течение целого года, и результаты все еще можно увидеть в специальной учетной записи Twitter.

19. Bugroid от Nasc

Полу-ошибка, полу-андроид, все мило

Веб-разработчик Nasc специализируется на разработке Flash и Android, а в свободное время создает пиксельную графику. Нам нравится этот проект Bugroid, который превращает популярных героев мультфильмов в милых созданий пиксельной графики, которые наполовину ошибочны, наполовину Android: всех, от Симпсонов до Заботливых медведей.

20. Night by Waneella

Художник фона Waneella создает пиксельные визуальные пейзажи с возможностями, вдохновленными фантазией.Под названием «Ночь» изображенная выше сцена с тонкой анимацией типична для ее работ и демонстрирует ее способность комбинировать, казалось бы, базовый цвет, квадраты и движение для создания оригинальных и динамичных миров.

21. Pixel Pour Келло Гоеллер

Работа Геллера переносит искусство пикселя в реальный мир

В своем проекте Pixel Pour визуальный художник из Портленда Келло Геллер взяла концепцию пикселя и умело переработала ее. реальный мир. Ее плавные пиксели были установлены по всему городу, предлагая горожанам игровой визуальный и воображаемый контекст, объединяющий оба мира.

22. Fine Pixel Art от Джона О’Хирна

Визуальный художник Джон О’Хирн работает с крошечными элементами для создания впечатляющих работ в натуральную величину, используя потенциал цвета, элементов и иллюзий. Его видео Fine Pixel Art, показанное выше, является прекрасным примером его творческого гения.

23. Стив Джобс, Metin Seven

Работа Seven сочетает пиксельную графику с трехмерными элементами

Работа Metin Seven сочетает в себе дизайн и пиксельную графику с трехмерными элементами, обеспечивая динамичный и детальный результат.Это изображение переосмысления Стива Джобса — удивительно привлекательный пример того, на что он способен.

24. Коврик от Cristian Zuzunaga

Cristian Zuzunaga новаторски играет с пикселями

Cristian Zuzunaga предлагает оригинальный взгляд на пиксели, сочетая их с модой, текстильным дизайном и мебелью. Его прекрасное использование цвета и узора с квадратами в этом стильном ковре выводит пиксельную графику в новом освежающем направлении.

25. Фреска Talk to Me в MoMA

MoMA устраняет разрыв между дизайном и коммуникацией с помощью пиксельной графики

Еще в 2011 году MoMA использовала простые квадратные комбинации для создания ярких и интересных рисунков фрески на основе объектов с выставки Talk Мне.Благодаря иконкам, созданным ЮИн Чо и Сэмюэлем Шерманом, в этом дизайне есть динамичное ощущение, которое действительно вдохновило посетителей увидеть главное событие.

26. Значок мыши от Бена Фино-Радина

Бен Фино-Радин показывает, как пиксели могут вдохновлять и стимулировать различные области дизайна

Это произведение дизайна в натуральную величину, вышитое вручную художником из Нью-Йорка Беном Фино- Radin является частью коллекции, которая исследует идеи размера и формы с помощью значков мыши в натуральную величину.

27.Кецалькоатль, Марио Сифуэнтес

Марио Сифуэнтес использует пиксельную графику для создания собственной интерпретации доиспанского бога

Мексиканский дизайнер Марио Сифуэнтес создал эту интересную и красивую интерпретацию Кецалькоатля, доиспанского бога. Вдохновленный визуальным стилем видеоигр 1990-х годов, эта игра использует упрощенные элементы и создает нечто довольно сложное и волшебное.

28. Берлинский плакат от Eboy

Типичная работа Eboy, крестных отцов пиксельной графики

Сложные иллюстрации австралийского художника Пола Робертсона включают в себя все, от детских, семейных работ до некоторых действительно NSFW.Будь то конфетно-красочный, как на рисунке выше, или причудливый, мрачный и тревожный, все, к чему он прикасается, кажется золотым пиксельным искусством.

29. Pixel Art Land, Гэри Лакен

Пиксель-арт Гэри Лаккена вдохновлен видеоиграми и не только.

Британский энтузиаст и художник видеоигр Гэри Джей Лакен находится под влиянием японских игрушек, старых 2D-видеоигр и поп-культуры. Его блог Army of Trolls полон его запоминающихся и волшебных работ в стиле пиксель-арт.

30. CGA Faces от Свена Рутнера

Свен Рутнер оттачивает свой фокус с помощью ограниченной цветовой палитры

Базирующийся в Германии независимый художник-пиксельщик Свен Рутнер получил международное признание за свои пиксельные работы.Он известен тем, что использует ограниченные цветовые палитры, похожие на предложения ранних домашних компьютеров, таких как ZX Spectrum. Это конкретное изделие было создано с использованием всего 16 цветов.

31. Робинзон Нердо, Тим Уэсоли

Пиксельные персонажи Тима Уэсоли красиво самобытны

Тим Уэсоли — ведущий разработчик 3D-модели компании Qubicle. Когда он не работает над своим программным обеспечением, он тратит время на создание пиксельной графики, такой как этот крутой персонаж Робинзона Нердо. Иллюстрация обманчиво сложна; вы обнаружите, что замечаете что-то новое каждый раз, когда смотрите на него.

Части этой статьи изначально были опубликованы в журнале ImagineFX ; подпишитесь здесь .

Статьи по теме:

Научитесь рисовать пикселями

Один из многих навыков, которые я приобрел за время творческой деятельности, — это пиксельная живопись, искусство рисования спрайтов видеоигр акриловой краской на холсте. Недавно я снова начал увлекаться этим как хобби и подумал, что поделюсь некоторыми советами о том, как начать — на случай, если кто-то захочет нарисовать своего любимого персонажа из старой школы видеоигры!

Тема сегодняшнего урока: Shyguy!

Вам понадобится:

• Холст
• Карандаш
• Линейка (желательно линейка)
• Две щетки (малая и большая)
• Емкость для воды (например, стакан, который вам больше не нужен)
• Палитра для смешивания красок (как тарелка, о которой вы больше не заботитесь)

Теперь вы выбираете сюжет для вашей картины! Я выбрал Shyguy из Super Mario Bros.2 , хотя действительно можно было выбрать кого угодно. Я настоятельно рекомендую вам не быть чрезмерно амбициозным в первый раз. Выберите простой 8-битный символ. Персонажи из Super Mario Bros. или Legend of Zelda — действительно хорошие стартовые площадки, чтобы увидеть, подходит ли это вам.

Скриншот из Super Mario Bros. 2, показывающий нужный нам спрайт Shyguy.

После того, как я выбрал спрайт, я хотел бы открыть какой-нибудь редактор изображений (например, Photoshop или просто простую программу, например, Preview на моем Mac), чтобы я мог видеть изображение достаточно большим, чтобы почувствовать пиксели.Как только это будет сделано, просто посчитайте ширину и высоту вашего объекта в пикселях. Как только у вас появятся эти числа, измерьте размер холста. Я измеряю холст в сантиметрах, так как их легче перевести на небольшой холст. Shyguy имеет высоту и ширину 16 пикселей, а мой холст — 20 см в ширину и 25 см в высоту.

Чтобы облегчить себе задачу, я решил нарисовать картину, в которой пиксель будет квадратным сантиметром. Когда у вас есть план, самое время приступить к работе над холстом!

Первый и самый однообразный шаг — СЕТКИ!

Первый шаг на холсте — разметить пиксельную игровую площадку.Отметьте область, которую вы будете рисовать в первую очередь. Сначала я дал себе коробку размером 16 квадратных сантиметров, а затем измерил и разложил каждую сантиметровую линию. Сделайте это для осей x и y, и теперь у вас есть готовая сетка.

Теперь, когда у вас есть сетка, пора все разметить!

После того, как сетка создана, следующим шагом будет разметка области рисования. Для сложных фигур я люблю присваивать цветам номера, но это простая четырехцветная фигура (черный, белый, красный и синий для фона).Я пометил, где пойдет черный цвет, знаком X. Я смог определить, где оттуда пойдут остальные три цвета. У меня также все еще есть мой компьютер, и я сохраняю исходное изображение увеличенным в качестве справки на протяжении всего процесса на случай, если я когда-нибудь забуду, что куда идет.

Как только вы будете удовлетворены своим боевым планом, самое интересное — рисовать!

Не бойтесь облажаться. Вы всегда можете просто закрасить его позже.

По одному цвету, рисуйте в областях, которые вы уже отметили.Ненавижу это говорить, но эта часть просто превращается в гигантскую «раскраску по номерам». Если вы впервые играете с акриловыми красками, не волнуйтесь, если вы случайно переступите через линии. После высыхания вы можете просто закрасить его снова, и это не будет проблемой.

Сделайте все сплошным слоем перед нанесением двойной основы, чтобы нанести второй слой. Некоторые краски (особенно белые) достаточно светлые, и вы все еще можете видеть линии сетки под ними. Просто продолжайте накапливать его, пока не будете удовлетворены.

Создайте фоновую границу.

Когда вы будете готовы к работе с фоном, создайте рамку выбранного цвета фона вокруг вашего персонажа, чтобы ваши более дикие крупные мазки не мешали вашей тяжелой работе.

Пора раскрыть большую кисть!

Единственный совет от моего школьного учителя рисования, который мне запомнился, был: «Всегда используйте кисть настолько большой, насколько это вообще возможно». Это сократит время, когда вам нужно нарисовать большую часть фона. По этой причине я рекомендую использовать кисть большего размера при работе с фоном или просто большие области того же цвета.

Просто продолжайте рисовать, пока он не станет похож на ваш объект.

Мне нравится оставлять черный слой напоследок. Лично мне возможность рисовать другими цветами помогает быть более осторожным. Черному потребуется минимум дополнительных слоев, так как он очень темный. Просто продолжайте добавлять слои, пока не будете удовлетворены, и, , вуаля, , у вас будет первая картина в пикселях!

Ниже приведено ускоренное видео всего процесса, через который я прошел, чтобы создать Shuguy:

Спасибо за чтение! Если вы делаете свою картину, просьба давать ссылку на картинку в комментариях! Я бы с удовольствием это увидел! Кроме того, если вы хотите увидеть больше подобных уроков, дайте мне знать об этом в комментариях!

Если вы хотите видеть больше от меня, у меня также есть Patreon для всех моих пиксельных картин.

Понравилось? Найдите секунду, чтобы поддержать GeekDad и GeekMom на Patreon!

Связанные

Что такое пиксель-арт и как оно ожило?

Еще в студенческие годы у меня был замечательный профессор искусств. Когда пришло время заняться темой пикселей искусства , как одного из тех движений, которые, возможно, не были мейнстримом, но, тем не менее, были интересны, первое, что она сказала, было «О, пиксельная графика? Вышивка счетными нитками встречается с пуантилизмом в виртуальной реальности компьютера.«И правда в том, что лучшего описания этого и быть не может. Пиксель-арт как форма создания большой картины из мелких деталей зародился в , 1970-х, , когда компьютеры и цифровое искусство начали приобретать актуальность и, как вы можете догадаться, основывались на пикселях. Для тех, кто знаком с этим термином, но не знаком с его графическими характеристиками, пиксель похож на клетку в живом организме — это самая основная структурная единица цифрового изображения (отсюда и название: изображение + элемент = пиксель).С появлением современных технологий, сложных вычислений и трехмерной графики пиксельное искусство потеряло свое повсеместное присутствие, в основном в области консолей и игр , но, вопреки распространенному мнению, не исчезло. Прежде чем мы остановимся на его сегодняшнем статусе, давайте вернемся во времени, чтобы вернуться к захватывающей эволюции пиксельного искусства через его крупнейшего представителя — видеоигры.

Видео-статья о курсе и инструментах пиксельной графики

Расцвет игр в стиле пиксель-арт

Вот как это произошло: во времена первых программ игры не могли отображать более детальную графику, поэтому у кого-то была довольно сложная задача — сделать визуальную анимацию, сделанную исключительно и полностью из маленьких цветных блоков.Этот человек должен был быть очень креативным, но также оставаться в рамках технических ограничений, потому что в то время память компьютера была довольно низкой , , можно было использовать только определенное количество цветов, и это недавно созданное изображение пикселя никогда не было означает оставить экранный дисплей. Но они сделали это, добившись наибольшего успеха с видеоиграми и оставив след в звуках дизайне и музыке видео . По мере того, как качество программного обеспечения со временем улучшалось, и появлялись новые консоли с поддержкой 3D, такие как Sony PlayStation и Nintendo 64, пиксельная графика снизилась, а затем возродилась 8-битных значений.Внезапно снова стать квадратным стало модно, и многие задавались вопросом — а как же так?

2D — это новый 3D

Игры с пиксельной графикой вернулись, потому что, как многие согласны, вызывает ностальгию . Но не только. Это простота, минимализм, легкость пикселей, которые так манят, а также то, как они напоминают нам о нашем детстве . Два экземпляра стали неразделимы, практически не могли существовать друг без друга. Кроме того, игры с пиксельной графикой так же просты, как и играть.Хотя видеоигры действительно сыграли важнейшую роль в превращении пиксельной графики в надлежащую форму искусства, она была не единственной.

Фрагмент из популярной видеоигры Джейсона Рорера «Пассаж», выпущенной в 2007 г.

Неровные иллюстрации — Пиксорамы eBoy

Хотя никогда не ожидалось, что пиксельная графика выйдет за рамки ее виртуального, киберпреобразования, заключенного внутри экрана компьютера, это произошло во имя создания физических произведений искусства. Пиксель-арт затронул разные сферы жизни, поскольку креативщики создали постеры с пиксельной графикой, обложки журналов, обложки музыкальных альбомов, обои для рабочего стола, картины, пиксельную видеорекламу и даже пиксельные татуировки.Пиксель за пикселем они родились благодаря этой уникальной форме самовыражения, черпая вдохновение в поп-культуре, новостях, дизайне и т. Д.

Самая известная группа разработчиков пикселей — это, безусловно, eBoy , также известная как «Крестные отцы пикселя», состоящая из Кая Вермера, Штеффена Зауэртейга и Свенда Смиталя и основанная в 1997 году. Эти ребята известны своими сложными иллюстрациями. Pixoramas , городские и пейзажи пикселированы, конечно, специально.На сегодняшний день они сделали пиксорамы таких мест, как Токио, Париж, Нью-Йорк, Рио, Берлин и Лондон, и в настоящее время запускают один для Сан-Франциско. Их трехмерные изометрические изображения, обожаемые целой армией графических дизайнеров по всему миру, можно найти на плакатах, рубашках, сувенирах и в галереях, а также в кампаниях крупнейших мировых брендов, таких как Adidas, Honda, MTV, Vh2, Coca-Cola. . EBoy представила пиксель-арт как форму для печати, потому что многие часы потратили на его создание в программном обеспечении.

Постер в стиле пиксель-арт, сделанный eBoy, анонсирует Adobe Air. Издалека это выглядит как обычная иллюстрация, но если вы увеличите масштаб, вы увидите все пиксели и все удивительные детали. Вы также можете найти обезьяну? Откройте изображение в новой вкладке для получения полного разрешения

Pixel Perfect — новое поколение пиксельных художников

Этот пиксель-арт обладает значительной визуальной силой и большим уважением в мире искусства показывает ряд других имен, чья любимая геометрическая форма — квадрат.Поскольку, как мы установили, пиксельному искусству удалось покинуть компьютерный дисплей и стать частью реального мира, существует множество способов их взаимодействия, и во многих случаях задействованы и другие формы искусства, как вы можете видеть из изображения в нашем слайдере. Подумайте о захватчике или космическом захватчике, чьи городские интервенции связаны с плиточными работами по всему миру. Он также известен тем, что использовал кубик Рубика в своих кубических усилиях (насколько это удобно). NASC — французский веб-специалист, который часто создает пиксельное искусство известных изображений из поп-культуры.Келли Гоеллер вынесла свое искусство на улицу, где она создает пиксельные потоки воды. Джон О’Хирн использует маленькие цветные шарики, обрабатываемые с помощью компьютерной программы и изобретенной им машины, чтобы размещать элементы в нужных местах. Бен Фино-Радин — это тот, у кого, должно быть, был мой профессор искусств, когда он делает вышитые кусочки пиксельной графики. Шедевры становятся пиксельными благодаря видению Джебома Джу, в то время как целый список креативщиков следует идее eBoy для создания целого пиксельного мира — среди них Пол Робертсон, Армия троллей, Bugpixel, Род Хант, Дениз Уилтон.И, конечно же, не будем забывать о тех, кто вручную раскрашивает или рисует пиксель-арт.

В общем, пиксельная графика — это весело! Судя по всему, он не выйдет из моды в ближайшее время, так что вы можете просто расслабиться и наслаждаться им — может быть, даже сыграйте в Super Mario Bros на праздновании! Или, что еще лучше, научитесь создавать их самостоятельно!

Показанное изображение: Джу Джебом — Винсент Вильгельм Ван Гог

Сделай сам Pixel Wall Art

, автор: Gwen 2 марта

The Bold Abode является участником программы Amazon Services LLC Associates, партнерской рекламной программы, разработанной для предоставления сайтам средств зарабатывать рекламные сборы за счет рекламы и ссылок на Amazon.com.

Прочтите мое полное раскрытие здесь.

Ну да ладно.

С чего мне начать? Похоже, я давно не планировал этот проект. Я все откладывал и откладывал. Что-то случилось со мной на прошлой неделе, и я понял, что все переосмысливаю!

Даже мои проекты DIY.

Итак, я просто решил заняться делами, не задействуя свой мозг. ОК. Я действительно использовал свой мозг, но я навсегда отключаю его слишком много мыслящую часть.

Следовательно, это мой любимый проект DIY Wall Art с тех пор, как я начал заниматься искусством для стен.

Как сделать собственное искусство пиксельной стены своими руками

Сначала выберите изображение.

Я выбрала это веселое и красочное изображение сердца, потому что знала, что хочу много-много цветов!

Затем создайте пиксельное изображение.

Вот хороший урок, как создать треугольное пиксельное изображение в фотошопе:

После того, как я пикселировал свое изображение, я просто обрезал его по размеру холста. Я использовал Photoshop, чтобы создать холст точного размера, а затем разделил его, чтобы я мог ориентироваться в рисовании.

Создайте сетку на холсте

Потом я занялся живописью. Не совсем так. Мне пришлось разложить свой холст сеткой, чтобы я знал, где рисовать!

Это был огромный 36 ″ x 48 ″, который я купил в местном магазине ремесел. Я думаю, что заплатил около 13 долларов после того, как все было сказано и сделано!

Потом все замерил. Моя сетка была 3 на 1,5 дюйма.

Затем я нарисовал свои линии длинным куском обрезков дерева.

Начать покраску

Я использовал множество красок DecoArt Americana Mult-Surface Satin, но мне все равно пришлось смешивать, перемешивать и перемешивать краску, чтобы получить различные вариации оттенков. Вот что действительно заставляет эту работу работать.

Вот с чего я начал. Просто в углу, рисуя по одному треугольнику за раз.

Я нарисовал…

И покрашено…

И покрашено…

На покраску у меня ушло около 3 дней.Мальчики были дома, потому что Старик Винтер навалился на нас, поэтому я думаю, что это заняло у меня больше времени, чем если бы они были в школе.

Было много-много перерывов на перекус. Закуски для них… не для меня. Перекрестите мое пиксельное сердце!

Дополнительные советы

• Не беспокойтесь о сверхточности, просто рисуйте.
• Смешайте цвета как можно лучше, но не увлекайтесь попытками заставить их точно соответствовать фотографии.
• Не беспокойтесь о том, чтобы мыть кисть между каждым треугольником.Я обнаружил, что если бы я рисовал один и тот же цвет другим оттенком, было бы легче просто взять немного белого или что-то еще и смешать его прямо на моей бумажной тарелке.
• Делайте перерывы … есть у вас голодные манчкины или нет!

Я сделал ее очень простой рамкой. Это самый простой и легкий способ обрамить картину на холсте своими руками.

Если у вас есть доска и рейка, этот пост покажет вам, как повесить на нее искусство. Это проще, чем вы думаете!

Я серьезно гу-у-у-у, мои смелые!

Это действительно заставляет мой офис чувствовать себя намного более собранным.

Если вы хотите увидеть больше обновлений моего офиса, таких как моя Золотая стена Sharpie, восстановившая винтажный свет, а также мои DIY Color Cord Light Pendant and Bulletin Board, Shazam Art и Tissue Paper Tassels, просто посетите мою галерею Office.

Что вы думаете о моем Pixel Art?

Поделитесь этим постом!

• Pinterest 4,7 тыс.
• Facebook
• Твиттер

Рисуем пиксель-арт с помощью машинного обучения | Автор: Ygor Rebouças Serpa

В этой второй партии есть спрайты, которые мы вручную выбрали для включения в набор для проверки, поскольку они значительно отличаются от большинства других.Несмотря на этот факт, затененные спрайты по-прежнему почти идентичны своим аналогам, нарисованным людьми. Что касается цветных изображений, то качество не сильно ухудшилось, как в случае с Сарой. Однако до идеала все еще далеко.

Учитывая эти результаты, можно сказать, что увеличение размера набора данных значительно улучшает затенение, но не области. Поскольку Люси — наш лучший сценарий, можно с уверенностью предположить, что нам нужна другая формулировка проблемы / архитектура для решения проблемы спрайтов регионов.

Чтобы более объективно оценить качество сгенерированного контента, мы вычислили оценки MSE, MAE и SSIM для обоих наборов данных.

Как видно из таблицы, серые спрайты имеют лучшее среднее (μ) и дисперсию (σ²), чем цветные спрайты по всем трем показателям. Кроме того, разница между квартилем 75% и максимальными наблюдаемыми значениями огромна, что указывает на сильно искаженное распределение.

Кроме того, результаты Люси неизменно лучше, чем у Сары, имея гораздо меньшую дисперсию и значительно меньший перекос.

Оценка SSIM варьируется от 0 (совершенно не похоже) до 1 (идентично) и измеряет воспринимаемое сходство двух изображений. В то время как MSE и MAE являются чисто математическими понятиями, оценка SSIM пытается больше коррелировать с человеческим восприятием. В таблице серые спрайты имеют около одного балла, что указывает на то, что они почти идентичны среднему наблюдателю, что не относится к цветным спрайтам.

В качестве третьей и последней оценки мы попросили команду дизайнеров прокомментировать 207 сгенерированных спрайтов для персонажа Сары.Их отзывы были в основном положительными, они хвалили качество закрашивания спрайтов и отказывались от цветных. В итоге они сделали четыре комментария:

1. Почти половина затененных спрайтов полезны и могут быть улучшены за 20-30 минут. Цветные спрайты непригодны для использования.
2. Алгоритм не согласован в рамках одной анимации, что может свести на нет полезность спрайтов.
3. Некоторые позы дают ужасные результаты даже для затенения спрайтов.
4. При квантовании цветов до используемых тонов 6 и 42 появляется нежелательный шум.

На следующих рисунках показаны точки 2, 3 и 4.

Несогласованное освещение тела в восьмикадровой анимации Позы, которые слишком отличаются от используемых при обучении, дают плохие результаты. При квантовании до 6 и 42 тонов появляется некоторый шум . Это хорошо видно по контурам.

В этой работе мы оценили использование современных генеративных моделей для решения проблемы генерации пиксельного искусства. А именно, мы использовали модифицированную архитектуру Pix2Pix, добившись умеренного успеха.Более подробно, спрайты затенения были признаны полезными художественной командой, а цветные спрайты были отброшены как бесполезные.

Для принятых затененных спрайтов команда оговорила, что в среднем на доведение каждого до совершенства потребуется от 20 до 30 минут, что на 10–30 минут меньше, чем требуется, чтобы нарисовать один с нуля. По самым скромным подсчетам, каждый полезный спрайт сэкономит 10 минут труда, что примерно на 15% повысит производительность.

Несмотря на большее количество цветов, спрайты регионов не занимают столько времени, как затенение спрайтов для команды дизайнеров.Как объяснил ведущий художник, регионы в анимации более предсказуемы и могут быть легко скопированы из одного спрайта в другой. Таким образом, их отсутствие — не большая проблема.

С технической точки зрения эта работа демонстрирует, что текущие модели могут быть эффективно использованы в качестве помощников для творческих задач. В других работах были сделаны аналогичные выводы в области аниме, которая состоит в основном из плоских и широких поверхностей и имеет меньше ограничений, чем пиксельная графика. Более того, модель Pix2Pix была задумана для реальных изображений, но работала для данных пиксельной графики и аниме, что свидетельствует об ее универсальности.

Наша текущая система основана на попиксельной регрессии, как и модель Pix2Pix. Однако наши проблемы могут быть сформулированы как попиксельная классификация, опираясь на литературу по сегментации изображений. Это может значительно улучшить наши результаты.

Иногда упрощение задачи может сделать ее более разрешимой. Спрайты регионов имеют в общей сложности 42 цвета, но только около дюжины появляется на каждом спрайте и занимает значительную его часть. Уменьшение размера проблемы до более избирательного набора оттенков может облегчить работу нашего генератора.

Pix2Pix выпущен в 2017 году. С тех пор в литературе GAN было сделано несколько улучшений, включая улучшенные функции потерь, механизмы внимания и улучшенные формулировки. Использование более современных методов может значительно улучшить полученные результаты.

Ссылки на U-Net и Pix2Pix

О. Роннебергер, П. Фишер и Т. Брокс, «U-net: сверточные сети для сегментации биомедицинских изображений», 2016 г.

П. Изола, Ж.-Й. Чжу, Т. Чжоу и А. А. Эфрос, «Преобразование изображения в изображение с помощью условных состязательных сетей», 2017 г.

Pixel Art — раскраска по номерам в App Store

Мне очень нравится это приложение.Раскрашивать картинки очень расслабляюще и почти по-дзенски. И мне нравится, что есть так много картинок на выбор и всегда добавляются новые. НО . . . реклама довольно раздражает. В основном потому, что их так много. Я получаю 1 каждый раз, когда открываю изображение, независимо от того, помечено оно как «Премиум» или нет (серьезно, в чем разница между ними?), И 1 каждый раз, когда я заканчиваю. Плюс каждый раз, когда я просто хочу вернуться в главное меню, а затем, когда я случайно нажимаю кнопку «Готово» в середине раскраски, что слишком легко сделать.Так что, если я делаю кучу простых подряд, я смотрю только рекламу за рекламой. Я понимаю, что вам нужно зарабатывать деньги, но было бы здорово, если бы минимальное время между объявлениями. И если бы у вас была однократная плата за избавление от рекламы, я бы оплатил ее в мгновение ока. Я отказываюсь платить ежемесячную подписку на любое приложение.

Но моя самая большая жалоба сейчас связана с последним обновлением. Почему вы изменили внешний вид пикселей и чисел? Мне это совсем не нравится! Мне не хватает темных, толстых линий между ячейками и кое-что о том, как сейчас применяются цвета.Это больше не приносит такого удовлетворения. Пожалуйста, пожалуйста, пожалуйста, дайте нам хотя бы вариант меню, который позволяет нам выбирать, какой вид мы хотим. Кроме того, было бы здорово, если бы он не раскрашивал ячейки, в которые я случайно попал по ошибке. Меня это почему-то отвлекает и беспокоит.

В целом, хорошее приложение, которое было бы здорово после нескольких обновлений.

Привет! Благодарим вас за то, что вы поделились этим с нами. Мы понимаем вас и знаем, что вы чувствуете. Но, как вы знаете, наше приложение полностью бесплатное.И нам нужно поддерживать приложение, оптимизировать его для пользователей и улучшать. Вот почему существует реклама. Если вы хотите играть без рекламы, вы всегда можете оформить подписку.
В последней версии мы улучшили дизайн. Пожалуйста, обновите приложение.
Если у вас есть другие вопросы, дайте нам знать, и мы будем рады помочь!

.