Погодные эффекты.

Теплая погода сменяется на прохладную. Скоро начнутся затяжные дожди, а мы до сих пор так и не научились рисовать осадки. Пора исправлять этот недостаток.

 

Дождь.

 

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


 

Создайте новый символ, назовите его капля. Нарисуйте овал с острым верхом и залейте его бело голубым градиентом. Откорректируйте заливку выбрав инструмент
Gradient Transform Tool



Поверните каплю в направление, по которому она будет падать.
Modify – Transform – Rotate and Skew

На 15 кадре поставьте ключевой кадр и переместите каплю вниз по направлению движения.



 

Нажмите на шкале правую кнопку мыши и выберите Create Motion Tween

Капля стала падать вниз.

 

Рябь на воде

 

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


Выберите примитив овал.



Запретите цвет у фоновой заливки. Цвет контура выберите синий.

Выделите нарисованный круг и конвертируйте его в клип –
Modify – Convert to Simbol – тип Graphic
Назовите символ – Рябь анимированная.
Вставьте ключевой кадр на 15 кадре анимации.
Создайте правой кнопкой мыши:
Create Motion Tween
На первом кадре выделите и уменьшите круг
Modify – Transform – Scale

 

 

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



Создайте новый слой и скопируйте туда круг со сдвигом на 5 кадров.
Выделите в нижнем слое все кадры, нажмите правую кнопку мыши – Copy Frames
На верхнем слое на 5 кадре нажмите правую кнопку мыши - Paste Frames
Не забудьте выделить сдвинутые кадры и нажав правую кнопку мыши выберите - Remove Frames, чтобы удалить их.

Перейдите на клип Капля и и в новом слое – Рябь, добавьте клип рябь.



Все готово, чтобы сплющить круги  для имитации вида сбоку сверху.
Modify – Transform – Free Transform
Чтобы от капли расходились круги. Добавьте к анимации 18 кадров.

Осталось только разместить капли в проекте, чтобы они художественно капали.




 

 

А на слое капля – поставьте на 15 кадре - ключевой кадр, на котором удалите саму каплю, чтобы она не нависала над рябью.


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

 

Дождь в городке

 

 

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



Нижний слой представляет собой градиент мрачного неба, создающего мрачное настроение.

 


Слой выше состоит из рисунка дороги и зеленого газона.



В самом конце дороги добавлены деревья

 


Естественно что на поверхности стоят дома.

 


Вполне естественно что пелена дождя затрудняет видимость. В этом слое я нарисовал белую фигуру которой задал уровень прозрачности. Чем более красный рисунок – тем прозрачнее слой. Обычно так имитируют туман.

 


Деревья на переднем плане не затронуты дымкой дождя.

 


Перед деревьями сидит на скамейке девушка под зонтом.

 

 


В этом слое расположена полупрозрачная заливка, имитирующая лужи – «Дорога». Также эта форма использована, чтобы определить столкновение с каплями. Вполне естественно ожидать круги на воде чем на земле.



Не забудьте написать в свойствах клипа его имя – Doroga



На этом же слое расположен пустой клип, центр которого совмещен с верхним левым углом проекта. Именно в этот клип будут выводится капли дождя среднего и дальнего  плана.

 

Свойства этого клипа. Имя клипа – Layer

 


И наконец, мужчина на переднем плане.

Выше этого слоя вне рабочего поля расположен Movie Clip в виде слова Script, в котором описана программа работы сцены. Рассмотрим ее поподробнее.

 

Управляющий скрипт.

 

//Блок выполняющий инициализацию сцены.
onClipEvent (load) {

            //Число капель - 0
i=0;
}

//Блок выполняющий команды каждый кадр пока выполняются заданные условия.
onClipEvent (enterFrame) {

            //С каждым кадром добавляется на одну каплю больше и так до 500
if (i<500){                  
i++;     
//Загрузка идет на слой Дождь (В этом слое расположена полупрозрачная заливка, имитирующая лужи - Doroga) в клип - Layer. Привязка к Instans Name клипа.
//Все отсчеты координат относительно центра пустого клипа Layer.

                        _root.Layer.attachMovie("Капля","Капля"+i,i);

//Чтобы клип "Капля" отображался из библиотеки надо прописать путь _root.
//В свойствах клипа поставить галочки: Export for ActionScript и Export in first frame
//Смещение по Х больше 953 пикселя, изза того что капля падает по диагонали справа – налево.
_root.Layer["Капля"+i]._x = int(Math.random()*976);                     

//Капли по высоте смещены от 140 до 390 пикселей
dy = int(Math.random()*250);
_root.Layer["Капля"+i]._y = dy -140;                       

//Уменьшение габаритов клипа капля в процентах. Чем дальше, тем более сжато по Х.
_root.Layer["Капля"+i]._xscale = dy/25;                   
_root.Layer["Капля"+i]._yscale = 20;

//прозрачность клипа (в процентах) Чем дальше - тем прозрачнее.
_root.Layer["Капля"+i]._alpha = dy/2.5;

//Уменьшение делает каплю меньше по горизонтали, а уменьшение прозрачности делает ее более дальней по ощущению

//Каждая 10 капля пролетает впереди всей сцены, чтобы были видны капли перед мужчиной.
n=int(i/10);
//Если не поставить условие, то капля пытается запустится 10 раз, каждый запуск затирает предыдущий из-за равенства имен.
if (n_old<>n){ 
n_old=n;
_root.attachMovie("Капля","капел"+n,n);
_root["капел"+n]._x = int(Math.random()*976);
//Капли летят с трого с одной высоты
_root["капел"+n]._y = 50;
_root["капел"+n]._xscale = 15;                     
_root["капел"+n]._yscale = 20;

//Слой _root находится выше всех слоев проекта.
}

}

}

 

Этот кусок скрипта описывает падение капель. Но чтобы увидеть расходящиеся круги от попадания капли в воду, надо добавить еще один скрипт.

 

Скрипт столкновения

 


Как видно из рисунка скрипт расположен на пустом кадре когда капля уже упала, но круг на воде еще не образовался.
Скрипт должен определить, куда попала капля. Если в воду, то формируется картинка ряби, если нет, то падает новая капля.

 

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

                                   //центр капли смещен относительно падения капли на -57 пикселя по Х, и +350 пикселей по У
if (_root.Layer["Doroga"].hitTest(this._x-40,this._y+350,true)) {        

                                   //Проверка столкновения капли с клипом Doroga, находящемся в клипе Layer. Если да, то показывается анимация Ряби.       

} else{                        

                                   //Если нет, то переход на первый кадр и падение новой капли.

                                   gotoAndPlay(1);

                        }

 

Основные этапы описаны. Если возникнут вопросы - пишите.

 

vassago

Магический журнал "Гадкая Саламандра" http://gad-salamandra.narod.ru/

Обложка Страницы: 1, 2, 3, 4, 5, 6, 7, 8, 9, 10

 

У тебя есть в интернете ресурс на тему магии, но ты не знаешь как его раскрутить?

Пиши свою заявку в ПРОЕКТ МИРА МАГИИ.

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

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

Мы ждем вас.

 
Hosted by uCoz