Здравствуйте, гость ( Вход | Регистрация )

 
Ответить в данную темуНачать новую тему
> Листание страниц, Урок
HALFORD
сообщение 25.11.2006 - 14:47
Silent Screams
******
9 лет с форумом орден I степени
Группа: Участник
Сообщений: 1861
Регистрация: 12.07.2005
Пользователь №: 8873


Недавно арсенал классических трюков Flash пополнился новым и модным эффектом "Листания" страниц.

(IMG:http://forum.gor-net.ru/uploads//1164451285/gallery_8873_473_19432.jpg)

Рисунок 1

Рисунок даёт полное представление об идее, на которой базируется весь эффект. Да, эффект действительно очень сложный и реализовать такую идею не каждому флешеру по плечу, даже хорошему. Прежде всего было ясно, что эффект "Листания страниц" был как-то связан с принципом листания страниц (надо же!).
Далее: В большинстве сценарных эффектов в том или другом виде - используется симметрия. Треугольник (угол изгиба), изображающий перелом страницы, является зеркальным, но некоторые делают отдельную картинку для обратной стороны, находящегося под ним. Два треугольника относительно симметричны пунктирной линии. В конце анимации с переворачиваемой страницей появляются две страницы (обе стороны), симметричные относительно "корня" книги, ну т.е. к чему листы прикреплены, вот как раз туда... Ось симметрий точка "А", и перемещается в положение "В". Сценарий анимации переворота страницы сводится к перемещению оси симметрии во время анимации.

Симметрия встречается в природе, и при работе с фракталами.

Wikipedia:

Фрактал (лат. fractus — дроблёный) — термин, введённый Бенуа Мандельбротом в 1975 году для обозначения множеств с дробной размерностью Хаусдорфа — Безиковича (HB). Для самоподобных множеств, типа канторового множества, HB-размерность совпадает с размерностью подобия.



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

Так, теперь надо разъяснить как это будет работать в реале.

Процесс анимации:

Теперь смотрим на второй рисунок с четыремя листкмми слева направо.
Изменяется прежде всего ось симметрии, гнущегося листа. Сначало угол будет 45° в правом нижнем углу, переворачиваемой страницы (но можно и сверху, правда так никто не перелистывает, да и идею саму прийдётся реконструировать), а потом только переходит на положение 90°, т.е. страница уже лежит перевёрнутая. Ось симметрии - всего лишь концепция, заложенная в основу, а не сам еффект естественно. Главное помнить об этом процессе обобщения! Чтобы создать такой эффект, надо разбить его на легко-реализуемые составляющие. Пример показан на третьем рисунке.

(IMG:http://forum.gor-net.ru/uploads//1164451285/gallery_8873_473_3732.jpg)

Рисунок 2

Так, анимация этого эффекта основана на перемещении двух клапов вокруг оси. Один клип - "зеркало" переворачиваемой страницы, для узнаваемости назовём его reverse_ms. В начальном положени он повёрнуть на 90°, и, находится на позиции пунктирного прямоугольника рисунка Три. Клип reverse_mc стремится совместить свой правый край с осью (симметрии). А другой клип - это маска. пусть это будет maskReverse_mc. В начальном положении клип положен на 45°, а в конечном он должен быть как реверс_мс. Это значит, что в конце анимации клип реверс_мс виден полностью, т.к. ни одна ни одна из его частей не скрывается под маской.

(IMG:http://forum.gor-net.ru/uploads//1164451285/gallery_8873_473_50345.jpg)

Рисунок 3

Открываемый клип остается неподвижным, но его маска ведёт себя почти так же, как maskReverse_mc: она двигается аналогично, но симметрично относительно оси. На четвёртом рисунке маска обазначена maskNew_mc (новая маска).

(IMG:http://forum.gor-net.ru/uploads//1164451285/gallery_8873_473_2723.jpg)

Рисунок 4

В этом "спецэффекте" показаны основы этого эффекта перелистывания страниц, показывающие общий подход к созданию подобных эффектов:

- найти и выделить основные базовые элементы, из которых самым распространённым является симметрия, но могут встречаться и другие типа фракталов и других эффектов частиц. Лучше нарисовать диаграммы с указанием места этих концепций в эффекте;
- чтобы развить свою идею, лучше всего сделать какие-нибудь наброски, описывающие действия, в данном случае переход от базовой идеи к её реализации во Flash. Если вы не понимаете как создаётся такой эффект или другой, то скорее всего там используется маска. Помните, маски в сочитании со сценариями обычно создают самые необычные и неочевидные эффекты. Блин, "страшное это оружие" я вам скажу;
- не пытаётесь быстро всё переводить в математические формулы, т.к. простое визуальное представление во многом упрощает работу, да и конфликтов будет меньше. Несмотря на математические особенности, мат. уравнения плохо подходят под преобразование в визуальную форму. Они скорее будут абстрактны, чем визуальные.

]]>Blog]]>



Вот мой старый пост, по этой теме:


В помощь абоненту!

(IMG:http://forum.gor-net.ru/uploads//1160124831/gallery_8873_473_3986.jpg)

]]>Смотрим>>]]>
Перейти в начало страницы
 
+Цитировать сообщение
vtm
сообщение 15.12.2006 - 16:51
blessed
****
орден IV степени
Группа: Участник
Сообщений: 321
Регистрация: 4.02.2004
Пользователь №: 2168


а не проще то же сделать а АЕ и сохранить как флешку? :_)
Перейти в начало страницы
 
+Цитировать сообщение
HALFORD
сообщение 15.12.2006 - 17:15
Silent Screams
******
9 лет с форумом орден I степени
Группа: Участник
Сообщений: 1861
Регистрация: 12.07.2005
Пользователь №: 8873


Что за АЕ?
Перейти в начало страницы
 
+Цитировать сообщение
HALFORD
сообщение 3.02.2010 - 15:43
Silent Screams
******
9 лет с форумом орден I степени
Группа: Участник
Сообщений: 1861
Регистрация: 12.07.2005
Пользователь №: 8873


Да пално таких, хоть какие хочешь, хоть флэш-галереи или листалки) тема то создана аж в ноябре 2006

ps. спасибо что хоть её поднял (IMG:http://forum.netall.ru/style_emoticons/default/wink.gif)
Перейти в начало страницы
 
+Цитировать сообщение
indiobobr
сообщение 5.03.2010 - 19:24
Новичок
*

Группа: Участник
Сообщений: 1
Регистрация: 5.03.2010
Пользователь №: 29647


слушайте, народ... наткнулся тут в рунете на товарищей, которые продают такую прогу, которая собсна и делает эффект листания, вот эти ]]>http://luxedition.ru]]>

что скажете?
Перейти в начало страницы
 
+Цитировать сообщение
Maxell12
сообщение 19.12.2010 - 00:04
Новичок
*

Группа: Участник
Сообщений: 1
Регистрация: 18.12.2010
Пользователь №: 32467


AE- это Adobe After Effects
Отличная программа для создания спецэффектов, в ней кстати можно сделать 3d альбом с эффектом перелистывания страниц, например как этот
]]>http://video-effects.at.ua/index/3d_album_after_effect/0-353]]> можно и получше сделать если повозиться, Я свой альбом в этой программе делал,альбом правда большой получился 86 фото всего 42 страницы по два фото на странице
Перейти в начало страницы
 
+Цитировать сообщение

Ответить в данную темуНачать новую тему
2 чел. читают эту тему (гостей: 2, скрытых пользователей: 0)
Пользователей: 0

 



RSS Текстовая версия Сейчас: 21.10.2021 - 14:50