Суббота, 20.04.2024, 13:13
Главная Регистрация Вход
Приветствую Вас, Гость · RSS
Это интересно
[ · · · · ]
  • Страница 1 из 1
  • 1
Модератор форума: ImmortaL  
Форум » Все для веб-мастера » Уроки Фотошопа » Создание анимированного баннера сайта в стиле Vista
Создание анимированного баннера сайта в стиле Vista
ImmortaLДата: Вторник, 12.05.2009, 13:19 | Сообщение # 1
Сообщений: 359
Уважение
[ ]
Здравствуйте, в этом уроке мы будем создавать анимированный баннер в стиле Vista.

Шаг 1.
Создаем новый документ (Ctrl+N) размером 88х31.
Создаем новый слой (Shift+Ctrl+N) и закрашиваем его в любой цвет.

Шаг 2.
В окне слоев правой кнопкой мыши щелкаем на верхний слой, выбираем “Blending Options” и настраиваем “Inner Glow” и “Gradient Overlay” как на картинках:




Шаг 3.
Создаем новый слой.
С помощью инструмента Rectangular Marquee Tool (M) создаем выделение как на рисунке:

Шаг 4.
Берем инструмент Paint Bucket Tool (G) и заливаем выделение белым цветом:

Шаг 5.
Меняем “Opacity” для этого слоя на 20-25%:

Шаг 6.
Берем инструмент “Horizontal Type Tool (T)” и пишем текст (Я использовал шрифт “Arial”, размер 14рх):

Шаг 7.
Пишем вторую надпись (она должна быть на другом текстовом слое) и запускаем “Image Ready (Shift+Ctrl+M)” (если используется Photoshop CS3, то в этом шаге вам просто нужно открыть окно анимации “Window > Animation”). Скрываем слои с текстом:

Шаг 8.
В окне анимации нажимаем на “Duplicates selected frames” и делаем первый слой с текстом видимым:

Шаг 9.
Убедитесь, что у вас выбран второй кадр и нажмите “Tweens animation frames”, в появившемся окне выставите “Tweens With: Previous Frame” и “Frames to Add: 2”:


Шаг 10.
Снова нажимаем “Duplicates selected frames”, скрываем первый слой с текстом и повторяем действия из девятого шага, но для третьего кадра:

Шаг 11.
Теперь повторите все шаги с восьмого по десятый, но для второго слоя с текстом, должно выглядеть так:


Шаг 12.
Теперь установите для кадров №4 и №10 время 0,5 sec, для этого нажмите под кадром на маленький треугольник:

Шаг 13.
Теперь нажмите “Alt+Shift+Ctrl+S” и сохраните в формате .GIF



Форум » Все для веб-мастера » Уроки Фотошопа » Создание анимированного баннера сайта в стиле Vista
  • Страница 1 из 1
  • 1
Поиск:

Статистика Форума
Последние обновленные темы Самые популярные темы Самые активные Новые участники
Новый Топ пользователей с аватарами для Ucoz
[0]
Простой и красивый вид формы опроса
[0]
Красивый информер "кто нас сегодня посетил" для Ucoz
[0]
Flash радио для сайта
[0]
Новый информер комментарии для ucoz как на Dle
[0]
Новый вид опроса для uCoz
[0]
Связь с администрацией
[0]
Новый вид статистики Ucoz
[0]
Скрипт Наши сервера в одном блоке
[0]
Выдвижная кнопка ВКонтакте
[0]
[15]
ImmortaL
[359]
Sanshroom
[107]
100$)))
[87]
2wey
[81]
КрисТишка
[37]
Warchi
[13]
Strider
[6]
Роман
[6]
aldamm
[2]
Amator
[2]
Angelinajoliitacy
(20.01.2017|03:48)
ZhenyaWelo
(01.03.2016|21:56)
Stojanhesk
(14.06.2015|11:03)
Gopn1k
(07.04.2012|11:52)
Star
(04.07.2011|15:29)
snezhok
(16.01.2011|22:15)
Каваня
(21.09.2010|03:23)
2wey
(07.07.2010|10:21)
4353453454345345
(03.05.2010|15:10)
eldendhutle
(19.04.2010|08:53)