Создаем необычную анимацию загрузки Vista в Фотошопе

| Категория: Уроки по созданию анимации в Фотошопе | Сложность урока: Средняя

В данном уроке Фотошопа мы рассмотрим процесс создания необычной анимации загрузки в стиле Vista.


Финальный результат

Создаем необычную анимацию загрузки в стиле Vista в Фотошопе

Приступаем к уроку Фотошопа


Создаём новый квадратный документ, у меня 500x500 пикселей (File > New (Файл > Новый / Сочетание клавиш "Ctrl+N")). На новом слое (New Layer (Новый слой / Сочетание клавиш "Ctrl+Shift+N")), ровно по центру, делаем круглое выделение с помощью Elliptical Marquee Tools Инструмент - Овальная область выделения (Инструмент "Овальная область выделения" / Клавиша "M"). Что бы проще было искать центр жмём Ctrl+R и опускаем линии перпендикулярно друг другу. Затем не снимая выделения заливаем любым цветом (Paint Bucket Tool Инструмент - Заливка (Инструмент Заливка / Клавиша "G")), у меня он серый. Жмём Ctrl+D. Далее на новом слое с помощью Rectangular Marquee Tool Инструмент - Прямоугольная область выделения (Прямоугольная область выделения / Клавиша "M") делаем квадратное выделение, т.е. делаем круга (дольку) и заливаем красным цветом.


Создаем необычную анимацию загрузки в стиле Vista в Фотошопе

Затем Ctrl+ щелчёк по слою с серым кругом, чтобы загрузить выделение. Далее Ctrl+shift+I и далее жмем Delete, Ctrl+D. Далее Ctrl+J слой с красной долькой, разворачиваем её (Ctrl+T), подвигаем (это вторая долька). Жмём Ctrl+U, ставим галочку на Colorize (Тонирование / Колорирование) делаем зелёный цвет вместо красного. Таким образом сделайте ещё две дольки, каждую на новом слое, ещё синего и жёлтого цвета. Поставьте каждую на свои места. Далее обьедините слои с дольками. Вот так: ↓


Создаем необычную анимацию загрузки в стиле Vista в Фотошопе

На нём добавляем настройки слоя - Blending Options (Параметры наложения): ↓


Bevel and Emboss (Тиснение и рельеф): ↓

Создаем необычную анимацию загрузки в стиле Vista в Фотошопе

Contour (Контур): ↓

Создаем необычную анимацию загрузки в стиле Vista в Фотошопе

Satin (Глянец): ↓

Создаем необычную анимацию загрузки в стиле Vista в Фотошопе

Gradient Overlay (Наложение градиента): ↓

Создаем необычную анимацию загрузки в стиле Vista в Фотошопе

Stroke (Обводка): ↓

Создаем необычную анимацию загрузки в стиле Vista в Фотошопе

Создаем новый слой (New Layer (Новый слой / Сочетание клавиш "Ctrl+Shift+N")), создаём квадратное выделение, заливаем чёрным цветом доли круга. Так нужно сделать ещё одну долю чёрного цвета и две доли белого цвета, расположив в шахматном порядке. Обьединить чёрно – белые доли. Далее Ctrl+ щелчёк по слою с красно-сине-жёлтому кругу, чтобы загрузить выделение круга, Ctrl+shift+I и на шахматном слое жмём Delete. Должно получиться примерно так: ↓


Создаем необычную анимацию загрузки в стиле Vista в Фотошопе

Меняем Blending mode (Режим наложения) этого слоя на Soft light (Мягкий свет), Opacity (Непрозрачность) 29. Ctrl+T перекручиваем по часовой стрелке. Делаю несколько слоёв постепенно поварачивая по часовой стрелке. В слоях это выглядит так: ↓


Создаем необычную анимацию загрузки в стиле Vista в Фотошопе

Делаем синий флаг: создаем Rectangular Marquee Tool Инструмент - Прямоугольная область выделения (Прямоугольная область выделения / Клавиша "M") - прямоугольное выделение, заливаем синим цветом. Filter > Distort > Wave (Фильтр > Искажение > Волна).


Создаем необычную анимацию загрузки в стиле Vista в Фотошопе

Далее выставляем настройки слоя - Blending Options (Параметры наложения): ↓


Drop Shadow (Тень): ↓

Создаем необычную анимацию загрузки в стиле Vista в Фотошопе

Inner Shadow (Внутренняя тень): ↓

Создаем необычную анимацию загрузки в стиле Vista в Фотошопе

Outer Glow (Внешнее свечение): ↓

Создаем необычную анимацию загрузки в стиле Vista в Фотошопе

Inner Glow (Внутреннее свечение): ↓

Создаем необычную анимацию загрузки в стиле Vista в Фотошопе

Bevel and Emboss (Тиснение и рельеф): ↓

Создаем необычную анимацию загрузки в стиле Vista в Фотошопе

Gradient Overlay (Наложение градиента): ↓

Создаем необычную анимацию загрузки в стиле Vista в Фотошопе

Настройки можете менять по своему усмотрению. Для каждого случая они могут быть разными.


Переходим в Imadge Ready (или в Window > Animation (Окно > Анимация), или иначе в зависимости от версии). На первом кадре включёны слои с синим флагом, серым кругом и четырёх цветным кругом. Они будут включены всегда, Делаем дубликат слоя (Layer > Duplicate Layer (Слой > Дублировать Слой / Сочетание клавиш "Ctrl+J")) и оставляем включенным всё то же, только добавляем первый повёрнутый по часовой стрелке чёрно белый круг. И так включаем на каждом новом слое новый повёрнутый черно-белый круг, а предыдущий выключаем. Делаем это до конца. Потом выставляем время как хотите, у меня все по 0,1 сек. И сохраняем в формате gif.


Вот и все.


Финальный результат

Создаем необычную анимацию загрузки в стиле Vista в Фотошопе

Автор: lillo;

Текст доработан командой сайта PhotoshopPro.ru