Posts Tagged ‘as3’
…добавим z-sort и Depth Of Fields!
В очередной серии приключений математических кривых во flash (см. предыдущий пост) я углубился далее в 3D.
Мне захотелось более правильной картинки. Пришлось несколько пересмотреть алгоритм отрисовки кривой.
Теперь вся кривая состоит из отрезков, каждый из которых имеет цвет в зависимости от положения на оси z, называется это z-сортировка. В моем случае я сдела так, что чем дальше от наблюдателя, тем светлее цвет. Соответственно пришлось сортировать эти отрезки так, чтобы они отрисовывались на экране в зависимости от глубины своего расположения, от самых дальних к самым ближним.
Потом я привернул DOF. DOF - depth of field или “глубина резко изображаемого пространства”. На некотором расстоянии от фокальной плоскости все объекты в резкости, по мере удаления от этой точки в обе стороны, резкость падает. Я пока реализовал упрощенный вариант, то что ближе к наблюдателю - в резкости, то что дальше - нерезко, причем степень размытия пропорциональна удалению от плоскости экрана.
Увы с появлением DOF производительность падает чуть ли не в двое. Впрочем все зависит от числа точек кривой. но выглядит красиво. Художественнo-математический туман!
Mатематические кривые в 3D
Мне стало интересно посмотреть на математические кривые в 3-х мерном пространстве. Для этого я начал разбираться с Matrix3D и прочей трехмерной оснасткой в action script. Получилась вот такая штуковина:
Чтобы читать дальше и скачать исходные коды этой демки пройдите пожалуйста под кат…
Фигуры Лиссажу, гильоши и вектора в Иллюстратор.
Я недавно заинтересовался всякими математическими художествами - фракталами, аттракторами и т.п. Разумеется, я не смог просто так пройти мимо и ударился в эксперименты. Практически готовый код для рисования фигур Лиссажу (фр. Lissajous), я нашел на сайте Е. Скляревского, там еще много всяких таких штук есть, ну вы понимаете, я все-таки больше художник, чем математик и, в конце концов, надо уметь пользоваться “богатствами интернета”.
Я привернул контролы ко всем возможным параметрам и получилась вот такая занятная игрушка - фигуры Лиссажу во всей своей красе, во всех, так сказать интимных подробностях. Моя фигура Лиссажу эта одна, здоровенной длины, векторная кривая, отрисованная спомощью graphics.lineTo. Для начала, на сладкое, поиграйтесь с этой штукой, а потом я расскажу кое-что еще интересное.
А теперь о главном.
Как известно, все эти художества используются для оформления разного рода ценных и не очень ценных бумаг. Эти сложные узоры полученные математическим способом называются гильошами или гильоширными сетками. Мне приходилось использовать такие штуки в своей работе. Проблема тут заключается в том, что обычно приходится использовать готовые решения, а их еще найди. В замечательном Иллюстраторе, в рукопашную изобразить те же фигуры Лиссажу будет, мягко говоря, сложно. Конечно, есть какие-то плагины, и еще есть дорогая, прекрасная программа Цербер для рисования сложных гильоширных сеток, но вы же сами понимаете… все это добро теперь не так просто заполучить бедному дизайнеру… да в конце концов дело даже не в этом.
Как вы понимаете, настоящий воин не мог не заинтересоваться большой красной кнопкой на этом оружии… Так вот, посмотрел я на свою замечательную картинку и задался вопросом: а можно ли вот это художество заполучить в векторе, а еще лучше, чтоб прямо в Иллюстратор? Оказалось еще как можно. При том трюк просто феерически прост! Объясняю: чтобы получить содержимое флэш ролика в векторном виде, надо напечатать его в pdf! Все. То есть, щелкаете правой кнопкой по флэш ролику, выбираете из меню пункт - Печать… затем в качестве принтера Adobe pdf (если его у вас нет то надо установить, по-моему это часть Adobe Acrobata) и печатаете в файл pdf. А pdf, как известно, прекрасно открывается в иллюстраторе! Ура. Замечательная, офигенная гильоширная сетка ваша!
UPDATE
Здесь, в посте Эпициклоида… или эпитрохоида? можно поразвлекаться с более продвинутой версией флеш-приложения по математическим кривым. Там больше пресетов и есть несколько разных видов мат. кривых.
В посте Mатематические кривые в 3D Фигуры Лиссажу представлены в трехмерном пространстве, тоже довольно любопытное зрелище.
Как я вытачивал свое портфолио.
Дело было аж в 2007 году. Я решил сделать портфолио “не как у всех”, чтобы навигация была поинтереснее, ну вобщем хотелось чудес, особенно посмотрев на это и вот это и еще вот особенно это. Тогда я даже близко не представлял как это реализовать, но уж очень хотелось, чего-то необычного.
Я решил, что моя навигация не будет пришпилена к определенному месту, а кнопки будут живыми, будут свободно перемещаться по экрану, прилипая к курсору мыши. Это идею я и реализовал, при этом пришлось кнопки научить при столкновениях разбегаться в стороны. Понятно, что никакой навороченной физики я применять не стал т.к. просто не умел и сделал попроще - каждая кнопка проверяет не столкнулась ли она с кем-либо, если да, то она валит по диагонали в сторону, вторая в свою очередь тоже убегает. Вобщем умные получились кнопки. Я остался вполне доволен.
Позже я решил, что не все любят хаос и добавил два элемента управления - красный треугольник строит кнопки по вертикали, синий - по горизонтали. Причем нажимать ничего не надо, просто нужно навести курсор на треугольник. При столкновениях кнопки прекращают движение и нужно снова теребить треугольник, чтобы привести их на место.
Сайт работает на xml, черпая всю информацию из подгружаемых файлов. Вес основного модуля 142 kb. Я терпеть не могу монструозные сооружения, загружаемые по полчаса, бездумно набитые под завязку фотографиями и музыкальными треками, ну не гуманно это! Поэтому только xml!
На примере этого проекта я разбирался с программированием на ActionScript. Тогда еще не было AS3, поэтому я просто тонул в густом месиве различных практик программирования на as. Слишком много было совершенно разных подходов, кто все в кадрах все пишет, кто-то нормальные классы пишет, с нуля было совершенно не понятно, как писать код правильно. В конце концов я слепил этот проект, как умел, прямо внутри одного fla файла, но опыт получил колоссальный.
Сейчас, в эпоху AS3 я стараюсь делать все как положено - код отдельно, символы отдельно, кругом классы, классы и классы… отделяю так сказать художественные байты от технических :). И это мне нравится куда больше рассовывания кода по кадрам.
Genie. Эффект Джина с использованием PixelBlender.
Недавно в блоге “Флэш-потрошителя” я нашел интересную ссылку в блоге ViValution, о том как создать эффект genie на сильверлайте с помощью пиксельных шейдеров.
Я посмотрел и загорелся идеей сделать этот эффект на As3 c помощью PixelBlender.
Click to continue…