Virtown - Город Вашей мечты

Содержание

Создание персонажа
Анимация для понимающих
Как делать страйпы?

Создание персонажа

Надеюсь вы уже установили требуемый растровый редактор и готовы "внимать и усваивать"?

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

Я мог бы, тут, рассказать массу историй о создании каждого из этой славной компании, однако у меня сейчас другая задача, поэтому не будем отвлекаться. Как видно из картинок наши "герои" одеты в одежду и обувь, а через какое то время у всех появится возможность носить дополнительные предметы (например шляпы, бороды для мальчиков, и косметику для девочек). Выбор над чем поработать достаточно богатый.

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

Как вы видите тут есть отдельные элементы - тело, голова, обувь, штаны, плащ, прическа, мало того, все это еще и в двух вариантах - спереди и сзади, и количество кадров на "страйпе" равно количеству (этих кадров 8

кадров режима "ходьба" + 2 кадра на положения "стоит" и "сидит", итого на данный момент 10 кадров. Первым идет положение "стоит", следом начинаются карды "идет". 10-ый кадр положение "сидит".
Вы должны, так же, знать, то что на картинках нарисовано белым, на самом деле является тем самым (+ один) прозрачным цветом.
Программная часть Виртауна, получая такие картинки делает из них, при создании героя игроком, этакий бутерброд. И прозрачный цвет позволяет видеть сквозь наложенные друг на друга слои те изображения что находятся ниже. Это означает что создание любой одежки невозможно в отрыве от анимации самого героя и всех оставшихся предметов одежды. Конечно не исключены варианты когда верхняя одежда закрывает большую часть тех предметов что находятся ниже, например - плащ обязательно частью или полностью закроет штаны и футболку, но даже в таком случае в "плаще" есть прозрачные места для того чтобы были видны кисти рук. Порядок наложения "страйпов" друг на друга на сегодняшний момент выглядит так.

Количество таких наложений в принципе неограниченно, но из-за ограниченного размера опорного спрайта 32х64 все таки имеет конечное число, больше площади опорного спрайта нарисовать все равно не выйдет

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

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

Перейдем к собственно созданию обуви. Посмотрите на эту увеличенную картинку.

Видите эти смешные 20 пикселей? Это и есть дефолтовые тапочки в которых бегает большинство "Будд" по Виртауну после своего первого появления, если конечно игрок не решит побегать босиком

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

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

Автор: Bers.

Анимация для понимающих

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

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

Начнем с обозрения, необходимого для анимации, инструментария в Graphics Gale (GG). Трепетно надеюсь, что вы знаете как просто нарисовать статичную картинку в этом редакторе, что такое слои и чем рисовать, поэтому перейду сразу к окну Frame (Кадры).

Frame (Кадры).
В каждом кадре имеются свои слои, т.е. свой уникальный набор. К примеру, в анимации у вас есть не меняющаяся часть изображения (голова) это не значит что она должна быть только на первом кадре, это изображение (или слой с изображением) должно присутствовать во всех кадрах.
У окна Frame есть меню работы с кадрами, необходимо нажать на черную стрелочку (как и в Layer) и увидите выпадающие меню. Кадры можно добавлять (как же без этого), дублировать, удалять, копировать, вырезать, вставлять слева от текущего или справа. Есть еще некоторые тонкости в кадрах такие, как тайминг, прозрачность но об этом в другой раз, в предоставленных вам файлах эти параметры будут настроены, вплоть до количества кадров, поэтому во избежание проблем не изменяйте их без надобности.

Preview (Предпросмотр).
Отдельного внимания заслуживает окно Preview (Предпросмотр). В нем, с учетом тайминга кадров, проигрывается анимация, т.е. здесь вы увидите свой нарисованный костюм, персонаж в действии.
! Если окно стало серым и не показывает анимацию, то стоит сохранить файл и перезагрузить программу. Это глюк присутствующей в этой версии GG.

Ресурсы.
Для каждого персонажа предоставлен базовый файл *.gal. Ниже также показано содержимое этих файлов в виде анимированных гифов, которые вам не нужны. Нужны лишь файлы *.gal, находящиеся в архиве.

http://Bers40k.cjb.net/Pixel-faq/base_anim_persons_v1_2.rar

Для примера скачайте и посмотрите как нарисовано платье.

http://Bers40k.cjb.net/Pixel-faq/example_anim_dress.rar

Работа с базовыми ресурсами.
Важные моменты:
1. Начать рисовать следует с создания нового слоя для одежды (волос, обуви), не рисуйте на базовом изображении!
2. При создании нового слоя автоматически на нем включается альфа-канал (кнопочка с буквой "а") - его нужно выключить.

3. Новый слои должен иметь уникальное имя, которое должно повторяться на каждом кадре. Если слои на кадрах имеют одинаковые имена мы можем оперировать ими одновременно, а именно скрывать и показывать с помощью функции Reverse visibility в выпадающем меню окна Layer (Слой).
Пример. Есть платье – на первом кадре создаем слой с именем dress и рисуем на нем. Затем, на втором кадре создаем слой с тем же именем и рисуем изображение для анимации платья. Либо просто копируем слой, (простым перетаскиванием из окна слоев на нужный кадр) из первого кадра во второй и изменяем его изображение.
4. Для каждой вещи должен быть отдельный слой.

Готовый результат.
Когда анимация закончена и вы довольны результатом, то для утверждения и обсуждения вашей работы выкладывать на форум нужно анимированный gif. В лицензионной GG это делается достаточно просто.
1. Сохраните текущий файл
2. Изначально вы работаете в почти неограниченной цветовой палитре. но для формата гиф необходимо 256 цветов. Нажимаем All Frames (Все кадры) – Color Depth (Глубина цвета) – Меняем Format (Формат) из 24 bpp (Full Color) на 8bpp (256 colors). Нажимаем OK и увидим как наша палитра преобразуется в 256 цветов, а именно покажет те цвета которые используются в этом файле.
3. Нажимам File (Файл) – Save as (Сохранить как). В типе файла (расширение файла) указываем gif.

К сожалению в бесплатной версии возможности сохранять анимированный гиф нет. Поэтому для его создания использовать придется дедовский метод. А именно:
В GG копируем каждый кадр (Edit – Copy display image) и по очереди вставляем в Adobe Image Ready (надеюсь у большинства есть эта программа). Если необходимо пояснение как это делать в Image Ready, скажите об этом и мы постараемся описать это в последующих главах.

Автор: Mangust.

Как делать страйпы?

Предлагаем скачать и запустить по этому вопросу видеоурок, в котором за минуту все объясняется:
http://Bers40k.cjb.net/Pixel-faq/lesson-1.exe

Для тех, кто любит почитать:
1. Открыть.
Чтобы сделать страйп нужно прежде всего открыть файл с анимацией в программе Graphics Gale.

2. Изменить палитру.
Затем нужно изменить глубину цвета на 256 цветов. Меню All frames (Все кадры) - Color depth (Глубина цвета) – переключить в положение 8bpp (256 colors). Нажать кнопку «ОК».

Вы увидите как в вашей палитре уменьшится количество цветов. Там появятся те цвета которые вы используете в своем рисунке. Теперь максимальное количество цветов – 256.

Вы в любой момент, после создания страйпа, можете вернуть глубину цвета в исходное положение 24bpp (full color).

3.Сделать экспорт.
Далее меню File – Export. Вам откроется окно экспорта, которое должно выглядеть таким образом:

Если оно выглядит по другому, то настройте его следующим образом:
В поле Type (Тип) – Combined File (Комбинированный файл)
В поле Columns (Колонки) – 1
Напротив Frame Properties(Свойства кадра) – галочки нет.
Нажать кнопку «ОК».

4. Сохранение.
Вам предложат сохранить ваш страйп. Выберите нужную папку.

В поле File name (имя файла) – укажите нужное имя файла с расширением (*****.gif).
В первый раз обязательно припишите к имени файла «.gif». Вполне возможно, что без этого в первый раз сохранения страйпа, файл запишется без расширения и вы не сможете его открыть.
В поле Save as type (тип файла) – выберите из списка GIF.
Если у вас нелицензионная GG, вполне возможно, что формата GIF не будет в списке, поэтому на форум разрешается выкладывать страйп в формате Gale (*.gal).
Нажмите кнопку «Save» (Сохранить).

5. Результат.
Готовый страйп, предположим из 5 кадров, должен выглядеть вот так:

Автор: Mangust.