• Flash animation

  • прорисовка в «карамельном» стиле

16 Сентябрь 2008

прорисовка в «карамельном» стиле

меня уже несколько раз просили более подробно рассказать о прорисовке/рисовании во flash. в частности просили рассмотреть на примере «карамельного домика», который вы видите на 1-м слайде флешки. обещания я свои выполняю, поэтому присаживайтесь поудобнее и слушайте внимательно.

1. итак, мы имеем на выходе вот такой симпатичный домик. рассмотрим по порядку все шаги, которые привели к этому результату.
2. всё всегда начинается со скетча (наброска) на бумаге. можно конечно и сразу на компьютере, если у вас есть планшет, но как по мне никакой планшет не сможет сравниться с простым карандашом и листком бумаги. этот домик был нарисован гелевой ручкой в блокноте.
3. первое что я делаю это выбираю контрастный цвет для контурных линий (зачастую это синий или красный) и прорисовываю все основные контуры с помощью инструмента pen и редактирую точки и линии инструментом arrow. не используйте при прорисовке pencil, его линии зачастую получаются кривые и содержат много точке, к тому же их сложнее редактировать.
4. когда все линии прорисованы, удаляем слой с наброском, меняем цвет линий на чёрный и корректируем элементы по композиции. я увеличила домик, передвинула окошки, дорисовала облака и велосипед. планировались ещё деревья, но они не вписались )
5. подбираем основные цвета картинке. обычно это процесс у меня занимает больше всего времени. если я не знаю, чего конкретно хочу от цветовой гаммы, на помощь приходит адобовский кулер. здесь я обошлась без него, заранее зная, что хочу картинку в тёплых тонах.
6. вот как выглядит наша картинка без контурных линий. не спешите их удалять, они могут вам ещё пригодится, лучше всего скопируйте их на отдельный слой.
7. далее добавляем градиенты. в идеале нужно использовать корректирующие слои (слой с градиентной заливкой в чётных или белых тонах с прозрачностью), чтобы мы в любой момент могли поменять основной цвет без ущерба градиентным переходам. но в данном случае цвета менять я не собиралась, поэтому работала без корректирующих слоёв – просто добавляла градиент основному цвету (от более всетлого к тёмного). результат вы можете видеть.
8. далее шёл кропотливый процесс добавления бликов и теней, который и привёл домик к «карамельному» виду. и добавлены детали такие как цветочек и кружка в окошке.
9. вот блики и тени без заливки. обратите внимание на контуры окошек и забора – это нично иное как наши контурные линии, просто где-то они чёрные, а где то белые с прозрачностью 15-25%. так же добавлены градиентные блики везде, где что-то может блестеть. даже шёрстка у кошки )
10. чтобы блики смотрелись симпатичнее я использовала градиентную заливку  не белого цвета, а светло-жёлтого, в результате чего блики кажутся теплее.
11. что касается теней, то часть из них это просто градиенты чётного с прозрачностью он 0 до 25% (см. тени вокруг окошек и двери), а часть – расблёреные movie clip-ы с обычной заливкой (см тени под велосипедом и забором).

вот собственно и весь секрет. пробуйте, экспериментируйте и у вас всё получится!!!

вот например процесс отрисовки нескольких «сладких» иконок.

posted in drawing, lesson | 21 Comments