Рейтинг: 0.0/0

Метки

photoshop, фотошоп, дизайн элементов, золотая лента, дизайн ленты

Опрос: Чего добавлять больше?

Чего добавлять больше?
Всего ответов: 192

Главная » Статьи » Дизайн элементов » Восхитительная золотая лента



То, что мы будем создавать, вы можете видеть на изображении выше. Скрутите её, обмакните, оближите и съешьте! Используйте на своем сайте, целей много!

1. Создание документа

Начнем с создания нового документа в Photoshop - около 800 х 500 пикселей, или как вам нравится! Лучше использовать разрешение по умолчанию (72), хотя...

Теперь у вас есть холст, вы можете добавить немного более интересный фон, отличный от обычного белого цвета. Для моего фона я применил Filter> Render> Lighting Effects, затем выставил непрозрачность для параметра Fade примерно на 15%.



Ну, наш основной фон мы сделали.

2. Форма ленты

Начните с создания нового слоя (Layer> New> Layer), а затем включите сетки в Photoshop (View> Show> Grid), теперь перейдите к Edit> Preferences> Guides, Grid, Slices & Count… и измените параметры сетки так, чтобы было похоже на мою, если это возможно.



Создайте прямоугольное выделение на холсте, это будет база вашей ленты, а затем залейте его черным цветом (находясь на новом слое!)



Следующее, что нужно сделать, это: с помощью Polygonal Lasso Tool, вырезать треугольную форму на правой стороне вашего выделения (с помощью сетки, если это возможно), как это сделал я:



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

Завершите, заполнив вашу ленту желтым цветом с помощью инструмента заливки.



3. Текстура ленты

Начните с создания нового слоя, а затем примените фильтр Filter> Render> Clouds к вашему пустому слою. Убедитесь, что сперва ваши цвета будут сброшены на черный и белый. Затем, примените Filter> Render> Fibers со случайной настройкой



Последним примените Filter> Blur> Motion Blur с углом 90, а расстоянием в 100 или больше. Мы будем использовать готовый результат в качестве текстуры для нашей ленты. Обрежьте лишнее, оставив текстуру лишь для ленты, и немного поэкспериментируйте с режимом слоя и непрозрачностью.



На изображении выше я использовал режим для слоя Multiply и 25% непрозрачности. Дублируйте слой с текстурой и выставите Overlay с непрозрачностью 35-50%.



Выглядит неплохо сейчас.

Я закончил, пройдя немного мягкой кистью внутри ленты. Начните с создания нового слоя. Теперь выберите содержимое слоя с лентой (удерживайте Ctrl и щелкните миниатюру слоя), затем мягкой кистью пройдите немного внутри краев ленты.



Для смягчения краев ленты я использовал черный цвет кисти. Меняем режим наложения для вашего слоя с "внутренним свечением" на Linear Burn.

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



4. Последние штрихи

Последними штрихами я применил несколько стилей слоя на оригинальный слой ленты:

Drop Shadow



Gradient Overlay



И это даст результат как на изображении ниже



5. Добавим текст

Последнее, что нужно сделать, это добавить текст нашей ленте, придать ей жизнь, не так ли? Используйте Type Tool, и напишите какой-то текст на вашу ленту.



На изображении выше я использовал шрифт Myriad Pro с высоким значением жирности, если у вас нет Myriad Pro, просто найдите хорошую альтернативу, такую как, например, Arial Black. Я также использовал черный (# 000000) цвет шрифта. После того, как я написал свой текст чёрным, я применил эти три стиля:

Drop Shadow



Inner Shadow



Gradient Overlay





Я добавил второй фрагмент текста (гораздо меньше, и выбрав белый в качестве основного цвета):



Для этого текста я применил только Drop Shadow.



Теперь вы, вероятно, может повернуть это и приклеить на свой сайт или что-то подобное!

Финиш



Спасибо за чтение этого урока, я надеюсь, вам понравилось!

Источник
Перевод и описание: PS-Studio.Info
Ссылка:
BB-код:
HTML-код:
Всего комментариев: 0
Оставь комментарий первым!
Имя *:
Email:
Код *: