Title 1Title 2Title 3Title 4
Title 1

Title 2

Title 3

Title 4

назад вперед
[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]
  • Страница 1 из 1
  • 1
Форум » 2D Графика » Академия Photoshop » Статьи по веб дизайну (часть первая)
Статьи по веб дизайну
ShyrikasДата: Суббота, 25.10.2008, 13:12 | Сообщение # 1
ДИЗАЙНЕР
Группа: Администраторы
Сообщений: 427
Статус: Offline
Создаем анимированную кнопку
Вам потребуется Photoshop 7 или выше.

1. Создайте новое изображение (Файл-новый) размером 300Х300 пикселов, с прозрачным фоном.
2. На панели иструментов выберите инструмент "Произвольная фигура" и в списке фигур выберите фигуру бабочки. Растяните контур бабочки.
3. Перейдите на панель КОНТУРЫ и нажмите на кнопку "Преобразовать контур в выделенную область" в нижней части панели. Перейдите на панель СЛОИ. Залейте выделение линейным градиентом с цветами от красного к оранжевому (Выбрав цветом заднего плана красный, а переднего оранжевый и тип градиента "от основного к фоновому").
4. Примените стили слоя, дважды кликнув по строке слоя левой кнопкой мыши и в появившемся окне ставим галочки напротив следующих стилей: Внутреннее свечение, Тиснение, Обводка, поставив параметры как на рисунке.
5. Теперь залейте полученное выделение на новом слое, радиальным градиентом и смените режим наложения слоя на "Осветление". Склейте слои (Слой-объеденить видимые).
6. Копируем слой, перетащив его на значек "Новый слой", не снимая выделения заливаем бабочку линейным градиентом с цветами от оранжевого к желтому.
7. Снова копируем слой, перетащив его на значек "Новый слой", не снимая выделения заливаем бабочку линейным градиентом с цветами от желтого к зеленому.
8. Снова копируем слой и заливаем бабочку линейным градиентом с цветами от зеленого к голубому.
9. Снова копируем слой и заливаем бабочку линейным градиентом с цветами от голубого к синему.
10. Снова копируем слой и заливаем бабочку линейным градиентом с цветами от синего к сиреневому.
11. Снова копируем слой и заливаем бабочку линейным градиентом с цветами от сиреневого к красному.
12. Переходим в программу ImageReady при помощи кнопки "Редактировать в ImageReady" в самом низу панели инструментов. В появившейся строке анимации копируем первый кадр 6 раз (всего получится 7 кадров) и устанавливаем время задержки кадра 0,1 секунды всем кадрам.
13. Возвращаемся к первому кадру и оставляем видимым первый слой (Самый нижний), у остальных отключаем видимость нажав на значек глаза рядом со строкой слоя. У второго кадра оставляем видимым второй слой, у третьего третий слой и т.д.
14. Измените размер кнопки до нужного Вам, при помощи команды ИЗОБРАЖЕНИЕ-РАЗМЕР ИЗОБРАЖЕНИЯ. Нажмите кнопку Play на строке анимации и наслаждайтесь

учебник-статья FOTODRUG



А вы сделали свою обязанность?тогда я иду к вам!
 
Форум » 2D Графика » Академия Photoshop » Статьи по веб дизайну (часть первая)
  • Страница 1 из 1
  • 1
Поиск: