Совет 1: Как сделать анимацию Юзербар

Юзербарами (Userbars) называются картинки небольшого формата, которые используются для подписи на форумах и могут быть анимированными. Как правило, юзербары отражают какую-либо информацию о предпочтениях и взглядах пользователя.
Инструкция
1
Для создания анимированного юзербара вам понадобится изображение и шрифт Visitor, ведь именно он чаще всего используется в надписях. Если у вас этого шрифта нет, поищите его в интернете. Обратите внимание на то, что картинка должна быть размером 350х19 пикселей. Затем возьмите второе изображение, то есть то, которое будет двигаться и создавать эффект анимации.
2
Откройте программу Photoshop, выделите изображение, нажав сочетание клавиш Ctrl+A, а затем скопируйте его при помощи Ctrl+C. Перейдите на юзербар и вставьте скопированную картинку, нажатием Ctrl+V. Кликните правой кнопкой мыши и выберите опцию под названием «Свободное трансформирование» (Free Transform). Теперь подгоните изображение под нужный размер (если только изначальный рисунок ему не соответствует).
3
Создайте новый слой, зажав клавиши Ctrl+Shift+N либо просто кликнув на вкладку «Слой» (Layer, если у вас англоязычная версия программы), а затем выбрав графу «Новый слой» (New Layer). Данный слой залейте узором, сделанным самостоятельно. Создайте новое прозрачное изображение размером всего 3х3 пикселя.
4
Выберите инструмент «Карандаш» (Pencil) и поставьте черный цвет. По диагонали нарисуйте три квадрата. Вверху вы увидите кнопку «Редактировать» (Edit), а затем - «Определить узор» (Define pattern). Нажмите на кнопку OK. Теперь можете залить новый слой юзербара узором. Для этого воспользуйтесь сочетанием Shift+F5, кликните на созданный вами узор. Не забудьте установить пункт «Прозрачность» на 21%.
5
Установите в параметрах белый цвет, а потом выберите фигуру прямоугольник. Нарисуйте ее достаточно вытянутой (так, чтобы она закрыла по ширине всю шапку картинки). Правой кнопкой мыши кликните по изображению. Перед вами появится меню, в котором вы должны выбрать пункт «Опции слоя» (Belinding Options).
6
Воспользуйтесь инструментом «Текст» (Text), в меню шрифтов выберите нужный и установите желаемый текст юзербара. Зайдите во вкладку «Окна» и выберите раздел «Анимация». Первый кадр фиксируется нажатием кнопки на панель анимации, расположенную снизу.
7
Далее вам понадобится инструмент «Передвижение». Зажмите на клавиатуре стрелку «вниз», и двигайте рисунок, пока он не дойдет до конца. Для сохранения анимации откройте вкладку «Файл» и выберите команду «Сохранить для веб и приложений».

Совет 2: Как сделать анимированный юзербар

Юзербар представляет собой графическое изображение, помещенное в подписи на форуме для определения принадлежности к различным интересам, убеждениям или группам. Такое изображение можно сделать при помощи анимации.
Инструкция
1
Запустите программу Photoshop. Осуществите создание нового объекта необходимого размера, нажав «Файл» и «Новый», если вы используете русскую версию, или «File», а затем «New», если у вас английская версия программы. Заполните документ черным цветом, нажав «Редактирование», «Выполнить заливку» и «Черный» («Edit», «Fill» и «Black»).
2
Нажав на иконку «Прямоугольная область» («Rectangular Marquee Tool») сделайте выделение так, чтобы около всех краев осталась невыделенная область толщиной в один пиксель. Удалите выделенную область, нажав «Delete» на клавиатуре. Отмените выделение нажатием клавиш «Ctrl» + «D». Выполните создание нового слоя, нажав вкладку «Слой», «Новый», «Слой» («Layer», «New», «Layer»). На панели слоев поместите новый объект ниже слоя с рамкой. Сделайте перемещенный слой активным и заполните его серым цветом, нажав «Редактирование», «Выполнить заливку», «Серый 50%» («Edit», «Fill», «50% Gray»).
3
Сделайте новый слой, переместите его на панели объектов выше слоя с серой заливкой. Залейте созданный слой любым понравившимся вам цветом. Щелкните по объекту правой кнопкой мыши и зайдите в меню «Параметры наложения» («Blending Options»). В открывшемся окне кликните на пункт «Наложение градиента» («Gradient Overlay») и установите значения: «Режим» - «Жесткий цвет» («Blend mode» - «Hard Light»), «Прозрачность» - «45%» («Opacity» - «45%»), «Градиент» - «Металл» - «Стальной прут» («Gradient» - «Metals» - «Steel Bar»). Нажмите «Ok».
4
Создайте новый слой и поместите его после слоя с рамкой. Залейте его любым цветом. Зайдите в «Параметры наложения» («Blending Options») и в пункте «Внутреннее свечение» («Inner Glow») установите параметры: «Режим» - «Линейный свет» («Blend mode» - «Linear Dodge»), «Непрозрачность» - «100%» («Opacity» - «100%»), «Цвет» - «Белый» («Color» - «White»), «Размер» - «4» («Size» - «4»).
5
Выполните создание нового объекта размером 1 на 2 пикселя. Выберите «Кисть» («Pencil Tool»). Сбросьте цвета, нажав клавишу «D». Поставьте точку в верхнем пикселе документа, нажмите «Редактирование» - «Определить узор» - «Ok» («Edit» - «Define Pattern» - «Ok»). Закройте файл, не сохраняя его, и перейдите к документу с юзербаром.
6
Создайте новый слой, поместите его выше всех слоев, кроме объекта с рамкой. Залейте новый слой созданной текстурой. Для этого нажмите «Редактирование» - «Выполнить заливку». Кликните по кнопке «Узор». Выберите вашу текстуру: она должна быть последней в списке («Edit» - «Fill», «Use» - «Pattern», «Custom Pattern» - кликнете на нее).
7
Выберите инструмент «Горизонтальный текст» («Horizontal Type Tool»). Напишите нужную надпись подходящего размера, с помощью шрифта из списка доступных.
8
Соедините три нижних слоя. Для этого на панели слоев нажмите на иконке глаза рядом со слоями, не подлежащими объединению, сделав их невидимыми. Выберите «Слой» - «Объединить» («Layer» - «Merge Visible»).
9
Создайте новый слой, он должен размещаться над самым нижним. На этом слое создайте анимацию. Для этого сделайте дубликат слоя, нажав «Слой» - «Дубликат» («Layer» - «Duplicate Layer»). На дубликате зайдите в «Параметры наложения» («Blending Options») и установите значения: «Режим» - «Осветление» («Blend mode» - «Lighten»). Откройте окно анимации, выбрав «Окно» - «Анимация» («Window» - «Animation»). Сделайте необходимое количество дубликатов кадра, выставьте видимость слоя и необходимое время.
10
Сохраните получившийся юзербар, нажав «Файл» - «Сохранить для Web» («File» – «Save for web»).
Источники:
  • анимированные юзербары
Поиск
ВАЖНО! Проблемы сердца сильно "помолодели". Потратьте 3 минуты на просмотр ролика. Защитите себя и близких от страшных проблем.
Совет полезен?
Добавить комментарий к статье
Осталось символов: 500