Космический текст

Метеорит

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

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

И так начнем!

Шаг 1

Создаем новый документ и заливаем его черным или темно-серым цветом.

Шаг 2

Создаем новый слой “Облака“, используя инструмент Lasso Tool (L) выделяем область подобно той что на рисунке внизу. Кстати, не знаю, что это ошибка автора урока или мой какой-то недочет, но чтобы получить такую же плавную область и соответсвенно добиться нужно еффекта облака, мне пришлось еще немного растушевать выделенную область Select > Modify > Feather(Alt+Ctrl+D).

Далее устанавливаем цвет заднего фона серым 50% и основной темно серый. Следуем в Filter > Render > Clouds и создаем темные облака. Для корректировки уровней, то бишь для придания нашим облакам более реалистичного темного вида играемся с ползунками в Images > Adjustments > Levels. Тут я уже все делал на глаз, предлагаю и вам. Получилось вот это:

Шаг 2

Шаг 3

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

Шаг 3

Шаг 4

Собственно в этом шаге переходим к созданию текста, для этого нам понадобится Adobe Illustrator и шрифт Times New Roman. Пригодится так же и  Effect > 3D > Extrude and Bevel для придания нашему тексту-метеориту объема. Не знаю почему, но автор урока многое что упустил при описании действий, например цвет текста должен быть серым, так же в настройках эффекта трехмерности, нужно еще зайти в расширенные настройки, дабы с помощью настроек света сделать придать тексту нужный эффект. После моих извращений, методом тыка вышел вот такой текст, готовый к вставке:

Шаг 4

Шаг 5

Как написано - копипастим 3D текст в Photoshop. А не тут то было, у меня напрочь отказался, пришлось через экспорт, что впринципе в итоге привело к тому результату, что нужно. Но интересно, как это у автора получилось скопипастить. Знал бы буржуйский, задал бы ему вопрос.

И так ступаем дальше, концентрируем внимание и располагаем текст где посчитаете нужным, после чего добавляем немного шума, то бишь Noise (Filter > Noise > Add Noise).

Теперь “немного” изменим стиль слоя. Я например, всегда считал это эффектами, но оказывается это стиль слоя. Короче, не слушаем мои бредни и клацаем два раза на слое с текстом, и открывшемся окне Layer Style вводим все значения, как на скриншотах внизу. Не забываем еще добавить и градиентное перекрытие (Gradient Overlay) в том же окне.

Шаг 5

Шаг 6

Делаем дубликат слоя с текстом и применяем Motion Blur (Filter > Blur > Motion Blur). При этом устанавливаем значения для угла размытия -53. Изменяем режим перекрытия слоя на Linear Dodge (Add). И как полагается настоящему десигнеру делаем папку и складываем туда эти два слоя с текстом. В итоге наша супер картинка выглядит примерно так:

Шаг 6

Шаг 7

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

Шаг 7

Шаг 8 Создаем огонь

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

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

И теперь нашей задачей является добавить огненное зрелище, которое обычно мы наблюдаем, когда с “неба падают звезды!”

Создаем новый слой “Огонь” и с помощью инструмента выделения в виде эллипса Elliptical Marquee Tool (M) создаем выделение вокруг последней буквы текста. Выбираем цвет светло-серый для основного и черный для заднего фона. Создаем облако как в шаге 2, с помощью всё тех же Levels делаем облако максимально контрастным. И в Hue/Saturation, в той же вкладке меню, изменяем значения ползунков до того как наше облако не приобретет цвета похожего на огонь, или просто смотрим на скриншоты и переносим все значения.

Шаг 8

Шаг 9

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

Шаг 9

Шаг 10

Выделяем слой “Языки пламени” и идем в Filter > Liquefy. Выбираем инструмент Turbulence Tool (T) и растягиваем пламя, делая маленькие язычки, учитывая форму буквы. И вообще автор урока многое чего утаил и на практике многое оказывается совсем не так просто сделать, например, в этом шаге нужно растягивать пламя на совсем короткие растояния, что бы в следующем шаге получилось красиво.

Шаг 10

Шаг 11

После вышеописанного с помощью Edit > Transform > Warp изменяем форму пламени, опять таки смотрим на скриншот и включаем фантазию, подганяя пламя под нашу букву. Вообщем у меня с н-ной попытки получилось практически то что я хотел.

Шаг 11

Шаг 12

Создаем новый слой и называем его “Желтым слоем”.  Создаем область выделения в виде эллипса, заранее указав 30px feather, растушевка по нашему. И заливаем её белой краской. Идем в Layer Style, устанавливаем Color Overlay используя желтый цвет и режим Multiply. Так же для этого слоя нужно установить режим наложения Multiply. В итоге получаем примерно вот это.

Шаг 12

Шаг 13

Самый простой шаг. Устанавливаем режимы наложения для слоев и порядок следования
“Языки пламени” - Lighter Color
“Пламя” - Normal
“Огонь” -  Lighten
“Желтый цвет” - Multiply
Вообщем можно поэксперементировать с порядком следования слоев и режимами наложения. А пока переходим к следующему шагу. Но “Желтый цвет” должен быть внизу папки.

Шаг 14

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

Шаг 13

И в конце концов у меня получается вот такое изображение, а у Вас?

Текст-метеорит

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

Метки: , , , ,

8 комментариев на “Космический текст”

  1. ert2 пишет:

    Оценил скотч на изображениях )

  2. Цмско пишет:

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

  3. Блоггерша пишет:

    Офигенный урок! Нужно будет попробовать! Смотрится здорово!

  4. admin пишет:

    Спасибо, Блоггерша. Почему себе аватар не сделаете? Ведь бесплатно же!

  5. Садовод пишет:

    Здорово! Просто класс! Обязательно попробую, только не сегодня, сегодня уже поздно.

  6. admin пишет:

    Садовод! Я рад что вам понравилось, но вряд ли вы сможете повторить, дела спамерские, т.е. садоводческие важнее! Так как Вы стали моим вторым спам-комментатором дарю ссылку, еще жду одного и все, ссылки с подобных буду убирать или вообще удалять.

  7. Дизайнер-художник пишет:

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

    Кстати, всех с Днём семьи, сегодня ж!

  8. admin пишет:

    Спасибо, а то я как всегда сомокритичен и считал свою попытку повторить урок полным провалом