Автор: Евгений Булатов «Vendigo»

Опубликовано: 25.01.2011

Изменено: 25.01.2011

Постоянная ссылка

Комментарии [7]

Создание скринсейвера Matrix с помощью Magic Particles


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



Страницы: 1 2 3

ОГЛАВЛЕНИЕ


I. Падающий код матрицы
II. Подробное описание изготовления эффекта
III. Создание скринсейвера
IV. Анимированные буквы MATRIX
V. Таблица цифр
VI. Изображение из символов матрицы
Эпилог
Файлы к статье

Фотоблог автора статьи



Редактор частиц – замечательная игрушка для дизайнера. Можно часами ковыряться с системой, получая различные красивые штуки. Главное, чтобы про это не прознало начальство, иначе вам будет трудно обосновать повышение заработной платы за то, что вы целыми днями играете.

Но делать спецэффекты просто так - скучно. Желательно их куда-то применить. Конечно, если вы работаете в геймдеве, или занимаетесь видео дизайном, то знаете куда их применить. Но всякая работа надоедает, даже творческая. И однажды меня посетила мысль сделать свой собственный скринсейвер в стиле Матрицы.

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

Magic Particles (Dev) изначально создан для реализации эффектов в других приложениях. А с выходом версии Magic Particles 3D , создание заставки стало доступно прямо в редакторе! Все что мне оставалось так это создать этот эффект.

Скринсейвер Matrix созданный с помощью Magic Particles
Скринсейвер Matrix созданный с помощью Magic Particles



Часть I. Падающий код матрицы


Создание текстур


Символы кода матрицы - это японские иероглифы и арабские цифры. Так как у меня не было японских шрифтов, то я взял артбук аниме "Ghost In The Shell" (поскольку сами братья Вачовские вдохновлялись этим аниме при создании Матрицы, то мне показалось это символичным).

Артбук аниме Ghost In The Shell
Артбук аниме "Ghost In The Shell"


В Photoshop я вырезал из него подходящие иероглифы и сделал из них текстуры, так же я использовал цифры от 0 до 9.

Всего получилось 18 текстур 32х32 пкс. Я сделал символы белыми, т.к. цвет удобнее подбирать в Magic Particles. Альфа канал тут не понадобился.

Скринсейвер Matrix - Текстуры



Движение частиц


Создать падающие строчки меняющихся символов в Magic Particles очень просто. Для этого нужно заставить двигаться частицы строго вниз и назначить на них текстуры "символов". В поле "скорость смены текстуры" вводим число отличное от 0 и символы начинают меняться.

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

Скринсейвер Matrix - Движение частиц



Эмиттер


В "Матрице" строчки не накладываются друг на друга, а падают строгими рядами. В Magic Particles нет эмиттера который бы излучал частицы нужным образом. Но там есть тип эмиттера – картинка. Этот эмиттер использует изображение как маску – там, где пиксели черные, излучение не происходит, там где белые – излучаются частицы.

В Photoshop я создал изображение шириной 1280, высотой 1 пкс и на черном фоне нарисовал белые точки на расстоянии 15 пкс друг от друга (каждый 16 пиксель белый).

Скринсейвер Matrix - Эмиттер


Загрузив это изображение в эмиттер типа картинка я получил то, что нужно.

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

Скринсейвер Matrix - Эффект падающего кода



Часть II. Подробное описание изготовления эффекта


Все исходные материалы, текстуры и маски для эмиттеров, вы можете найти в материалах к уроку. Там же находится файл Матрица_12.ptc, в котором можно посмотреть все эффекты которые описанные в этом уроке. Так же, там лежит сама заставка Matrix_Vendigo.scr.

Итак, запускаем Magic Particles и создаём в нём эмиттер, и внутри тип частиц.

Скринсейвер Matrix - Создаём эмиттер и тип частиц


Перетаскиваем все нарисованные символы на окно просмотра текстур частицы.

Скринсейвер Matrix - Вкладка Текстура


Чтобы частицы появлялись вдоль верхней кромки экрана, нужно вновь перейти к эмиттеру, и в верхнем графике выбрать его тип картинка. Загружаем в него нашу маску – черную линию с белыми точками (я сделал ее длинной 1280 пкс, потому что такова ширина моего монитора. Если у вас монитор шире, сделайте больше). Остальные параметры в эмиттере менять не нужно. Синяя линяя (угол поворота) должна быть на 0, зелёная (масштаб) - на 100.

Скринсейвер Matrix - Настройка эмиттера


Справа внизу, находится панель шкалы времени. Щелкните по слову "Положение" и передвиньте маркер вверх экрана так, чтобы координаты стали (0, -525). Чтобы скрыть маркер, просто щелкните по любому месту сцены, чтобы скрыть форму эмиттера нажмите F9. На этом с эмиттером всё. Можно переименовать его во что-нибудь осмысленное и перейти к частицам.


Настройка частиц


Частицы которые "выпадают" из эмиттера я назвал "Первый символ".

Скринсейвер Matrix - Настройка частиц


Движение частиц я задал не скоростью, а весом - это удобно, так как частицы двигаются вертикально вниз.
Так же используются параметры: Жизнь, Количество, Размер.
Не используются: Скорость, Угловая скорость, Вращение.


Настройка графиков


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

Продолжительность жизни: от 1.8 до 8
Таким образом, одни цепочки достигают нижнего края экрана, другие останавливаются раньше.

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

Скринсейвер Matrix - Настройка графиков


Частицы излучаются от 0.15 до 0.2 и затем спадают снова до 0.15.

Размер частицы: 20 %
Скорость частицы: 0 %
Вес частицы: 133

Я изменил диапазон весов частицы от -150 до +150 для этого щелкните синие цифры на вертикальной оси графика и введите новые значения.

Остальные графики я не использовал, оставив базовые значения.


Настройки текстуры


Скорость смены текстур: 8

Цвет:

Скринсейвер Matrix - Задание цвета


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

Затем создаём вложенный тип частиц.


Тип частиц "Символы"


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

Я включил серый фон чтобы лучше видеть падающий код, и подбирал параметр Излучаемое количество частиц, относительно скорости родительской частицы. В итоге я остановился на значении 0.22 в графике Излучаемое количество частиц (при Весе 133 для частицы "Первый символ").

Чтобы эффект был не таким быстрым в параметрах эмиттера (панель справа-внизу), я уменьшил Коэффициент темпа в с 1 до 0.65 . Продолжительность эффекта наоборот поднял с 10 до 60 секунд. Также включил Интерполяцию и поднял ограничение количества частиц до 15 000.

Скринсейвер Matrix - Настройка выпадения символов


Выглядело это вот так:

Скринсейвер Matrix - Код на сером фоне


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

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

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

Всё остальное в этом типе частиц очень просто.

Продолжительность жизни: 45

Цвет:

Скринсейвер Matrix - Задаём цвет


Цвет плавно переходит в черный, так что строчки постепенно исчезают. Параметр Интенсивность выключен, частицы не прозрачны. Размер частиц такой же, как в родительских частицах.

Скорость смены текстур: 8

В матрице, некоторые строчки кода падали быстрее, чем остальные. Чтобы это реализовать, я скопировал частицу "Первый символ" (Кнопка Х2 на панели инструментов или Ctrl + D) и отрегулировал параметры Вес для "Первого символа" и Излучаемое количество частиц для вложенного типа частиц. Настройте эти параметры самостоятельно. Количество быстрых частиц я сделал примерно в 3 раза меньше чем основных, а их скорость в два раза выше.

Скринсейвер Matrix - Параметры частиц


После того как настройки были закончены, я вернул черный цвет фона Ctrl + B. Скрыл нижнюю панель Ctrl + T. Сдвинул области дерева эмиттеров и графиков, максимально влево. Убрал через меню панель кнопок. И оценил свою работу во весь экран. Мне понравилось.

Скринсейвер Matrix - Готовый код



Страницы: 1 2 3