Pixel-overs

Что же такое pixel-over? Значит берем какое-то изображение покймона, затем уменьшаем его до размеров будущего спрайта, а потом уже создаем пиксел за пикселом новое изображение, которое повторяет все светотени, и выглядит как спрайтовая версия картинки покймона (p.s. кроме того она меньше занимает места на жестком диске, даже без уменьшения геометрии!). Для наглядности автор статьи приводит два примера своих pixel-over'ов, которые можно смотреть (но руками не трогать, т.е. интереснее делать своих):

http://www.dragonflycave.com/images/scratchvulpix.png
http://www.dragonflycave.com/images/scratchhitmonchan.png

Для сравнения, посмотрите на эти рисунки Кена Сигимори, которые можно найти почти в любом покедексе (как вы можете видеть  Internet Explorer отображает картинки формата PNG вместо прозрачного фона делает его серым, за это неудобство автор статьи просит извинения)

http://www.dragonflycave.com/sugimorivulpix.png
http://www.dragonflycave.com/sugimorihitmonchan.png

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

Эти pixel-over'ы, сделанные автором статьи являются "pseudo-scratching" полуавторскими работами. Потому что lineart (очерчивающие линии) не ваши, а но вот сам спрайт технически ваш, и вам не нужно использовать части от других покймонов для создания спрайта. Другой вариант, когда вы сами придумываете lineart и делаете из него полноценный спрайт, поэтому технически получаете авторский спрайт. Этот вариант не рассматривается отдельно только по той причине что принцип его такой же как и у pixel-over'а.

Итак, надо, для начала, найти какое-либо изображение покймона с которым мы будем работать. Выбор автора опять же относится к рисункам Кена Сигимори, но вы можете использовать совершенно любые картинки: из Коллекционных Карточных Игр, или из Аниме Сериала, или ПокёМанги - это ваш выбор. А если у вас есть ваши собственные рисунки - это даже лучше всего остального! А вот автора использует изображение Сайтера (поразительно, опять выпал Сайтер!)

Первым делом, уменьшим изображение [смотрите скриншот]. Автор счел самым подходящим размером для его pixel-over'ов прямоугольники где-то 70-80 пиксел, хотя официальные спрайты вписываются в квадратики 64 на 64 пиксела. Сейчас вы наверное уже вспомнили главные запреты для спрайтеров "НЕ менять размер изображения потому что оно размажется..." это чистая правда, появятся всякие прозрачные пикселы и произойдет грандиозное разделение цветовой гаммы - каждый пиксел будет иметь свой уникальный цвет = ужас! В MS Paint все проще, там ничего не размазывается (да...) жмем CTRL+W или на главной панели Изображение/Растянуть наклонить... и собственно вводим значения в процентах как нам надо изменить размер, для уменьшения будут значения меньше 100%. А вот в Image Ready и Photo Shop надо также на главной панели найти Image / Image Size... появляется окно первые две строчки показывают размер вашего изображения Width - ширина Height - высота (в пикселах или дюймах - inch) выбирать вам. Самая нижняя строчка - всплывающее окно - в нем выбираем тип изменения изображения, так вот по умолчанию стоит Becubic (он то все и размазывает), а вот если поставить Nearest Inabihour, то это самый лучший для спрайтера тип уменьшения изображения. Это тип дробления пиксел в пропорциях. Ведь при увеличении в два или в три раза, разделение на пикслелы сохраняются, только, пиксел, какбы, становится больше. А вот если надо увеличить изображение на пару десятков пиксел, или на 15% для этого и используется Nearest Inabihour), он растягивает строки пикселов, а если надо уменьшить на те же 15%, то он выкинет строки, какие сам пожелает.

И когда мы уменьшили изображение до нужного нам размера, берем черный(141414) карандаш и начинаем воссоздавать lineart, в MS Painte вы это будете делать на изображении, а в программах, поддерживающих разделение слоев, в новом слое. На картинке ниже показаны основные ошибки и их исправленные варианты, которые вы можете допустить очерчивая lineart:

http://crossroad2.narod.ru/pokemon/spriting/guide/smooth.gif http://crossroad2.narod.ru/pokemon/spriting/guide/smooth2.gif

Если это не входит в ваши планы, то вам лучше придерживаться вариантов представленных справа и выделенных галочкой. Главной ошибкой является ведение карандашом не отрываясь от кнопки мыши, это неприемлемо для спрайтинга, одним нажатием кнопки должен появляться один пиксел (если дело не касается строго вертикальных и горизонтальных линий).
Также вы можете столкнуться с псевдо очерчивающими линиями, на изображении следующем ниже они показаны красным цветом. Суть их в том, что эти очерчивающие линии состоят из одного пиксела. А если объект состоит из трех пиксел или даже линии в одну пиеселу, и тогда получается что самого объекта, которого они очерчивают, не видно. Поэтому, псевдо очерчивающие линии проводятся цветом на одну ступень светлее положенного.
Так, вот и закончен lineart нашего будущего спрайта, теперь можете удалить уменьшенный вариант исходной картинки (полезно сохранить где-нибудь копию, как образец для наложения светотени!). Итак результат lineart'a:

http://crossroad2.narod.ru/pokemon/spriting/guide/pixelover_01.gif

Время раскраски! Беру темный цвет (shade color) и крашу каждую часть сайтера в ее темный цвет. Опять же если вы предпочитаете начинать с какого-либо другого оттенка - это ваше право, например я начинаю с основного цвета (base color). И после манипуляции окраски спрайт выглядит...

http://crossroad2.narod.ru/pokemon/spriting/guide/pixelover_02.gif

Освежите в памяти раздел спрайтинга под названием revamp, и сейчас самое время наложить недостающие оттенки всех цветов спрайта. В данном случае присутствует shade color остальсь наложить base color (спрайт слева) и lighthing color(спрайт справа) - делаем. Чтож уже лучше:

http://crossroad2.narod.ru/pokemon/spriting/guide/pixelover_03.gif  и  http://crossroad2.narod.ru/pokemon/spriting/guide/pixelover_04.gif

Но это еще не все, еще есть три оттенка для очерчивающих линий очерчивающий светлый (outline highlighting), очерчивающий основной (outline base) и очерчивающий темный (outline shadow). И как вы помните из раздела revamp'a это операция требует ювелирной точности и сосредоточенного внимания. Но в конечном итоге мы получаем вот такую красотисчу):

http://crossroad2.narod.ru/pokemon/spriting/guide/pixelover_05.gif ====]:::::::> http://crossroad2.narod.ru/pokemon/spriting/guide/scratchscyther.png

А еще преобразование картинок в спрайты очень полезно для поиска новых форм и мотивов

http://crossroad2.narod.ru/pokemon/spriting/guide/pixelover_06.gif

Продолжение слудеут...

Отредактировано onk-mork (30-08-2009 22:45:12)