Звукові ефекти - це динамічні та сучасні елементи дизайну, які ідеально підходять для вечірніх флаєрів, банерів або шпалер. Завдяки ритмічним лініям і яскравим кольорам вони додають енергії та руху вашим проектам. У цьому уроці я покажу вам, як створювати приголомшливі ефекти рівня звуку в Photoshop, поєднуючи форми, кольорові градієнти та ефекти світіння. Давайте почнемо і додамо вашим проектам ідеального ритму!
1. створюємо рівні звуку в стилі ретро
У першій техніці я опишу, як створити рівень звуку в стилі ретро. Подібний ефект вже був описаний raptor31 в уроці тут, на PSD-Tutorials.de.
Техніка дуже проста і не вимагає занадто багато уваги при створенні, оскільки про найважливіші речі подбає фільтр.
Крок 1: Створіть новий документ
Я створюю новий документ (Ctrl+N ) розміром 800x600 пікселів і заливаю фоновий шар чорним кольором.
Крок 2: Малюємо контур еквалайзера
Створюю новий шар за допомогою комбінації клавіш Ctrl+Alt+Shift+N. За допомогою круглого білого пензля (B) розміром 5 пікселів малюю контур верхнього відхилення еквалайзера на новому шарі.
Крок 3: Дублюємо і дзеркально відображаємо шар
Дублюю шар з контуром еквалайзера за допомогою комбінації клавіш Ctrl+J і дзеркально відображаю його по вертикалі за допомогою Ctrl+T>Дзеркально по вертикалі. Переміщаю шар до нижнього краю оригінального контуру еквалайзера за допомогою інструмента "Переміщення" (Move ).
Крок 4: Зменшуємо обидва шари до одного
Виділяю обидва контурні шари на панелі Layers (Шари ) і зменшую їх до одного за допомогою комбінації клавіш Ctrl+E.
Крок 5: Заповніть внутрішню область
За допомогою інструмента заливки (G) я заливаю внутрішні області контурного шару білим кольором.
Крок 6: Повертаємо зображення на 90 градусів
Я повертаю весь документ на 90 градусів за годинниковою стрілкою за допомогою меню Зображення>Поворот зображення>90° в УЗС. Це важливо, оскільки фільтр, застосований на наступному кроці, працює тільки вправо або вліво, але не вгору або вниз.
Крок 7: Фільтр стилізації з ефектом вітру праворуч
Я викликаю діалогове вікно ефекту вітру через меню Фільтр>Фільтр стилізації.
Я встановлюю прапорець для Шторм з напрямком праворуч . Підтверджую вибір натисканням кнопки OK.
Крок 8: Повторний фільтр
У верхній частині меню Фільтр я знаходжу опцію повтору останнього фільтра. Я натискаю на неї або просто вибираю комбінацію клавіш Ctrl+F. Я повторюю застосування фільтра приблизно 2-3 рази.
Тепер з'являється знайомий контур еквалайзера, таким, яким я хотів би його бачити в моєму першому варіанті рівня звуку.
Крок 9: Ефект вітру фільтра стилізації зліва
Тепер я знову викликаю фільтр через меню фільтрів і змінюю напрямок на лівий . Знову ж таки, я повторюю застосування фільтра 2-3 рази, поки ефект не буде правильним.
Крок 10: Поворот зображення назад
Я знову повертаю документ назад через меню Зображення>Поворот зображення>90° проти УЗС.
Крок 11: Градієнт рівня заливки
Для того, щоб розфарбувати рівні білого, я вибираю градієнтну заливку як шар заливки.
Градієнт переходить від світло-червоного до криваво-червоного і є світловідбиваючим.
Я розміщую шар заливки як обтравочну маску за допомогою комбінації клавіш Ctrl+Alt+G.
Крок 12: Дублюємо шар відхилення рівня разом із шаром заливки
Я дублюю площину прогину рівня разом з площиною заливки, тому що зараз я створюю внутрішню область прогину рівня.
Трансформую прогин рівня за допомогою комбінації клавіш Ctrl+T. За допомогою бічних точок я просто трохи зменшую прогин рівня всередину.
Змінюю колір градієнтної заливки з білого на жовтий.
Крок 13: Помістіть обидва шари в смарт-об'єкт
Я виділяю обидва шари і об'єдную їх в один смарт-об'єкт. Це дозволяє мені редагувати обидва шари однаково, але при цьому зберігати доступ до окремих шарів.
Крок 14: Варіанти заливки
Тепер я додаю кількаваріантів заливки до мого смарт-об'єкта, щоб ще більше підкреслити ефект.
- Падаюча тінь:
- Непрозорість : 100 відсотків
- Відстань: 6 пікселів
- Розмір: 6 пікселів
- Зовнішнє світіння:
- Колір/яскравість: Білий
- Непрозорість : 4 відсотки
- Розмір: 43 пікселі
Щоб зробити тінь помітною, я створив нове тло з радіальним градієнтом від темно-синього до чорного.
Крок 15: Останні штрихи з віньєткою
Ефект вирівнювання тепер можна використовувати як елемент дизайну у шпалерах і флаєрах. Однак, якщо я хочу залишити його в такій формі і розмірі, я можу дуже добре оживити його за допомогою віньєтки.
Я створюю новий шар і заливаю його кольором на свій вибір.
Я встановлюю повзунок області на панелі керування шаром на 0 відсотків. Це означає, що вміст шару не відображається. Відображаються лише встановлені стилі шару. І зараз я встановлю їх.
Я відкриваю параметри накладання і вибираю " Сяйво всередину " з наступними налаштуваннями:
- Колір/Яскравість: Чорний з режимом накладання " Множення
- Непрозорість : 75 відсотків
- Розмір: 250 пікселів
Віньєтка готова.
Крок 16: Варіації з областю шрифту
Якщо я залишу білу область в межах рівня, то зможу дуже добре використовувати її для текстів.
Використовуючи інструмент виділення, я спочатку виділяю верхню область до центру в смарт-об'єкті, копіюю її за допомогою Ctrl+C і вставляю в документ за допомогою Ctrl+V. Те ж саме роблю з нижньою половиною. Я роблю те саме з нижньою половиною мого ефекту вирівнювання.
За допомогою інструмента " Переміщення" я переміщаю два нові шари так, щоб у центрі залишилося місце для тексту. Потім я можу виділити обидва шари і звести їх до одного за допомогою комбінації клавіш Ctrl+E. Я зафарбовую прозору внутрішню область білим пензлем.
Крок 17: Розміщення тексту
Тепер я можу використовувати свій текстовий інструмент, щоб написати будь-який текст у внутрішній області. Я вибираю шрифт Swatch it і просто пишу всередині PSD-Tutorials.de. З точки зору мотиву, оголошення про техно-вечірку, звичайно, підійшло б набагато краще.
2. створіть ефект рівня звуку за допомогою цифрового блиску
Ще один спосіб створити ефект рівня звуку як графічний елемент для флаєрів і шпалер - імітувати вигляд цифрового блиску.
Крок 1: Документ на чорному тлі
Я можу створити новий документ розміром 800x600 або просто продовжити використовувати існуючий документ і створити нову групу, в якій я організую ці ефекти.
Крок 2: Створення шаблону
Я створюю растровий шаблон у новому документі розміром 42x42 пікселі.
Для цього я малюю чорну центральну смугу вертикально на правій стороні документа і три чорні вузькі смуги горизонтально на лівій стороні. Піксельна сітка відображається в області високого масштабування, щоб допомогти мені розташувати смуги.
Використовуючи інструмент "Прямокутник ", я спочатку перетягую три прямокутники заввишки 4 пікселі по горизонталі, а потім прямокутник завширшки 10 пікселів по вертикалі в документ. Проміжки між вузькими прямокутниками становлять 10 пікселів!
Важливо, щоб тло було прозорим під час визначення візерунка. Нарешті, я можу визначити свій візерунок за допомогою меню " Редагування>Визначити візерунок".
Крок 3: Створення градієнта
Я створюю потрібний градієнт у новому шарі в кольорах, які я хочу, щоб градієнтна заливка з'явилася в моїх рівнях звуку.
Крок 4: Створення шаблону
Створюю новий шар і заливаю його за допомогою інструмента "Градієнт". Замість кольору переднього плану в рядку меню активується пункт " Візерунок " ( Pattern ). Я призначаю там щойно створений візерунок. Потім я заливаю шар своїм візерунком.
Для роботи з шарами має сенс створити шар-шаблон як обтравочну маску для шару-градієнта. Я роблю це за допомогою комбінації клавіш Ctrl+Alt+G або з клавішею Alt і клацаю між обома шарами на панелі керування шарами.
Крок 5: Намалюйте відхилення рівня в масці шару
Я додаю маску ша ру до градієнтного шару. Тепер я можу зафарбувати області, які не належать до моїх відхилень рівня. Я можу легко зробити це за допомогою чорного пензля. Крім того, ви можете просто виділити області за допомогою інструмента виділення і залити їх чорним кольором у масці шару. Колір переднього плану можна залити за допомогою комбінації клавіш Alt+Reset.
Крок 6: Створюємо смарт-об'єкт
Я виділяю шар градієнта і шар візерунка і зберігаю обидва в смарт-об'єкті (клацніть правою кнопкою миші>перетворити в смарт-об'єкт). Тепер краще, якщо обидва шари будуть у смарт-об'єкті і редагуватимуться разом, оскільки потім я зможу просто перемістити смарт-об'єкт вище в документі.
Крок 7: Дублювання та віддзеркалення смарт-об'єкта
Я дублюю свій смарт-об'єкт за допомогою Ctrl+J.
За допомогою Ctrl+T>Дзеркальне відображення по вертикалі я можу - несподівано, несподівано - віддзеркалити мій дублікат по вертикалі.
Я використовую інструмент " Переміщення ", щоб перетягнути його трохи вниз, так, щоб два "нижні" рівні майже торкалися один одного. Тепер я зменшую непрозорість до 40 відсотків.
Крок 8: Зникаюче відображення
Щоб надати віддзеркаленню ефекту переходу в темну шкіру, я просто додаю маску шару до смарт-об'єкта.
Використовуючи чорно-білий градієнт, я перетягую знизу вгору, щоб нижня частина стала прозорою, коли відображення зникає.
Крок 9: Трансформація
Я виділяю обидва смарт-об'єкти і можу трансформувати їх як єдине ціле за допомогою комбінації клавіш Ctrl+T. Має сенс трансформувати і трохи спотворити ефект у перспективі. Це додасть ефекту трохи динамічності. І на цьому все. Ефект рівня звуку є чудовим графічним елементом для флаєрів та шпалер.
Крок 10: Варіації
Дуже зручно, що я можу змінювати кольори градієнта в будь-який час. Я просто двічі клацаю на смарт-об'єкті у верхньому рівні перегляду. Тепер я потрапляю до документа PSB, в якому зберігаються два мої початкові шари.
Там я можу змінити колір градієнта за власним бажанням.
Якщо я хочу зробити ще одну варіацію, я можу зробити так, щоб піки рівнів стрибали. Це по-особливому підкреслює графічний ефект.
Для цього я зафарбовую другий окремий рівень кожного піку рівня в масці шару. Він зникає у поданні.
Коли PSB-документ зберігається, зміни застосовуються до PSD-файлу.
Що помітно? Зміни також були включені в дзеркальне відображення. Круто! Однак це не велика магія, а просто тому, що дублікати смарт-об'єктів створюють екземпляр оригінального смарт-об'єкта через панель керування шаром або за допомогою комбінації клавіш Ctrl+J. Таким чином, зміни також "успадковуються" від оригіналу.
Якщо мені не потрібні ці зміни, я створюю дублікат шляхом копіювання через меню Шар>Смарт-об'єкти>Новий смарт-об'єкт.
