Блог дизайнера » Анимация

Полезный сервис для веб-маcтеров

Панков Иван — Thu, 14 Apr 2011 14:08:48 +0000

Недавно искал гиф иконку для пред загрузки изображений. Хотел стандартную иконку от плагина shutter-reloaded заменить на кукую нибудь красивую. Погуглил наткнулся на отличный сервис который генерирует такие вот гифные изображения. Сервис на английском, но при этом все понятно. В настройках нужно выбрать понравившуюся анимацию, далее меняем код цвета фона на который вы хотите, затем галочку ставим если хотим, чтобы фон был прозрачен, и меняем цвет самой иконки. Вот и все нажимаем кнопку Generate it!.

Вот ссылка на этот сервис http://www.ajaxload.info.

Гипнотические GIF-изображения от Davidope

Панков Иван — Mon, 04 Oct 2010 17:23:52 +0000

Наткнулся в интернете на уникальную gif анимацию. Сразу решил опубликовать в своем блоге. Первый раз увидел такую сложную и затягивающие анимацию в gif. Можно долго втыкать в картинки, и в голову приходят всякие разные мысли, ко мне приходят такие мысли как будто я у психолога на сеансе от избавления той или другой зависимости . У нас был предмет в училище, назывался человековедение, напомнило мне про сеансы которые там проходили. Davidope является творческим директором и основателем дизайн ателье volll. Volll креативная студия занимающаяся графическим дизайном.

Как обычно для улыбочки.

Подборка свежих флеш сайтов

Панков Иван — Mon, 06 Sep 2010 12:51:38 +0000

В этой подборке собрал последние, крутые флеш сайты для вдохновения. Подборка состоит из 10+ сайтов сделанные на флеше. Встречаются действительно мощные работы, которые заставляют задуматься: А как это сделано? Данная подборка собрана с сайта creattica. Первый сайт Silver Pistol, больше всего понравился, как меняются цвета, как организованно портфолио, просто супер. Конечно минус таких сайтов это большой вес и нагрузка на процессор. У меня 4 ядра и все равно чувствуется подлагивание.

Для улыбочки.

Флеш подсказка для себя

Панков Иван — Wed, 31 Mar 2010 19:48:00 +0000

Я не так часто работаю в Macromedia Flash, что постоянно забываю элементарные вещи, например: где поставить скобочку или точку с запятой для правильности работы клипа, и постоянно открывал готовый флеш ролик, чтобы посмотреть на правильность кода. Так вот чтобы больше такого не было, решил сделать черновик, заметку у себя в блоге. Теперь если забыл, открыл страничку и посмотрел и сразу сделал. Удобно и быстро. Кому нужно пользуйтесь.

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

on (release) {
getURL(«http://pankov.org/») ;
}

Методы клипов

getURL – загружает указанный файл в заданный фрейм;
gotoAndPlay – производит переход на кадр с заданным номером или меткой и продолжает проигрывание клипа;
gotoAndStop – производит переход на кадр с заданным номером или меткой и останавливает проигрывание клипа;
nextFrame – производит переход на следующий кадр и останавливает проигрывание клипа;
prevFrame – производит переход на предыдущий кадр и останавливает проигрывание клипа;
play – продолжает проигрывание клипа;
stop – останавливает проигрывание клипа;
loadMovie – загружает фильм (как правило, SWF-фаил) вместо данного клипа;
unloadMovie – выгружает фильм, загруженный с помощью предыдущего метода.

Урок анимации, фокусировка во флеш

Панков Иван — Wed, 16 Dec 2009 19:49:40 +0000

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

Начнем, создаем документ с любым разрешением. А вот fps рекомендую ставить не меньше 25, потому что, если оставить по умолчанию 12 то флеш будет жутко мельтешить, как будто тормозит комп.

Потом берем картинки, одна будет фоном, а другая по верх ней без фона в пнг.

Создаем два слоя, на нижний слой ставим картинку интерьер, а на верхний девушку как у меня на примере.(Ваши картинки могут быть любыми )

Теперь жмем на картинку с фоном (мой интерьер), патом нажимаем f8 создаем Movie clip. После создания Movie clip создаем такую анимацию чтобы наш фон увеличивался (приближался), затем через определённое время уменьшался (как бы уходил в даль). Далее добавляем эффект blur на кадры; при приближении на второй кадр, и на удалении картинки на первый с параметрами как справа на примере.

Так же делаем и с девушкой. Только, при фокусировки на интерьер, девушку сдвигаем на несколько пикселей в лево.

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

Хотелось бы, чтоб урок был понятным, так как я первый раз пишу про флеш.

Скачать исходник