Разное

Как сделать неоновую надпись в фотошопе? Создание неоновой вывески для ночного клуба в Photoshop CS6 Extended.

Как сделать неоновую надпись в фотошопе? Создание неоновой вывески для ночного клуба в Photoshop CS6 Extended.

Рассказываем, как сделать такой декор своими руками (и порядочно сэкономить!). Тренируемся на самых популярных словах: love и hello.

Чтобы сделать DIY-надпись, вам понадобится электролюминесцентный провод. У нас он продается как «холодный неон», а в западных магазинах - как EL wire. Такой неон состоит из ПВХ-шнура и покрытой электролюминофором жилы. Для его питания нужен ток высокой частоты, поэтому стоит лучше сразу набор из шнура и инвертора (он может работать от сети или от батареек).

HELLO

Проект от автора блога I spy DIY Дженни, гениальный в своей простоте: вместо того, чтобы крепить надпись на жесткую основу, клеим ее на основу из проволоки. Получается невесомый декор, который можно повесить даже на стену с пестрыми обоями.

Вам понадобятся :

  • маркер;
  • ватман или другой большой лист бумаги;
  • стальная проволока;
  • кусачки;
  • универсальный клей;
  • неоновый шнур с питанием от батареек или инвертором для электрической сети;
  • зажимы для бумаги.

1. Напишите ваше слово, не отрывая маркер от бумаги.

2. Согните проволоку по форме слова, используя надпись как шаблон.

3. После того как вы согнули проволоку, приклейте к ней неоновый шнур. Начиная с конца шнура, через каждые 5-10 см капайте на него клеем и с помощью зажимов для бумаги фиксируйте место соединения. Оставьте до высыхания.

4. Поставьте надпись на консоль или повесьте на стену, вставьте в блок питания батарейки, включите. Готово!

11.09.15 2.9K

Что мы будем создавать

В этой статье я покажу вам, как изменить текстуру кирпича для фона; использовать стили слоя и инструмент «Перо », чтобы создать яркий, светящийся эффект, имитирующий неоновую вывеску.

  • Шрифт Beon Medium ;
  • BrickOldRounded0061 изображение 2 — большое (2000 на 2328);
  • Light Grunge Seamless Patterns Vol. 2 .

1. Создание фона

Шаг 1

Создайте новый документ с размерами 1500 на 950 пикселей и установите для него разрешение 300.

Перейдите в Файл> Поместить встроенные и откройте изображение BrickOldRounded0061 . Измените размер изображения по своему усмотрению, а затем нажмите клавишу Enter, чтобы применить изменения:

Шаг 2

Нажмите иконку «» в нижней части панели слоев и выберите пункт «Уровни »:

Шаг 3

Создайте обтравочную маску для корректирующего слоя, а затем задайте для «Темных тонов » значение 85:

Шаг 4

Снова нажмите иконку «Создать новый корректирующий слой или слой-заливку » и выберите «Цветовой тон / Насыщенность ». В меню «Слои » выберите пункт «Создать обтравочную маску », а затем задайте значения для «Насыщенности » 11, для «Яркости » -83:

2. Создание текста

Шаг 1

Введите нужный текст заглавными буквами, используя шрифт Beon Medium . Цвет — #a33e88 , размер — 103 пикселя:

Шаг 2

Продублируйте слой текста и отключите его видимость, нажав на иконку глаза рядом с миниатюрой слоя. Затем кликните по слою копии правой кнопкой мыши и выберите пункт «Растрировать текст ».

Теперь нужно отделить вертикальные и диагональные части букв от горизонтальных, чтобы применить эффекты, используя различные значения угла:

Шаг 3

Выберите инструмент «Прямоугольная область ». В верхней части окна нажмите иконку «Добавить к выделению » и выберите все горизонтальные части букв:

Шаг 4

Перейдите в Редактирование> Вырезать, а затем в Редактирование > Специальная вставка> Вставить вместо . Вырезанные части будут помещены на отдельный слой. Переименуйте слои в Vertical и Horizontal :

Шаг 5

Измените для слоев Vertical и Horizontal значения «Заливки » на 0:

Шаг 6

Продублируйте каждый из слоев дважды, а затем поместите каждый набор в группу с соответствующим названием (Vertical / Horizontal ):

Шаг 7

Поместите группу Horizontal под группой Vertical :

3. Стили исходного слоя Horizontal

Дважды кликните по оригинальному слою Horizontal , чтобы применить к нему следующие стили слоя:

Шаг 1

Добавьте стиль «Тиснение

  • Размер: 10;
  • Глобальное освещение »;
  • Угол: 0;
  • Высота: 70;
  • Режим подсветки: «Линейный свет »;
  • Непрозрачность: 0%:

Шаг 2

В стиле «Контур » установите флажок для параметра «Сглаживание »:

Шаг 3

Добавьте стиль «Внутренняя тень » со следующими значениями параметров:

  • Режим наложения: «Экран »;
  • Цвет: #e658d4 ;
  • Угол: 30;
  • Смещение: 0.

Шаг 4

Добавьте стиль «Внутреннее свечение » со следующими значениями параметров:

  • Непрозрачность: 85%;
  • Цвет: #fe66f1 ;
  • Источник: «Из центра »;
  • Размер: 18.

Шаг 5

Добавьте «Тень » со следующими значениями параметров:

  • Смещение: 13;
  • Размер: 7.


Мы задали стили для слоя первой горизонтальной части:

4. Стили для первой копии слоя Horizontal

Дважды кликните по первой копии слоя Horizontal , чтобы применить к ней следующие стили слоя:

Шаг 1

  • Размер: 16;
  • Снимите флажок для параметра «Глобальное освещение »;
  • Угол: -36;
  • Высота: 42;
  • Контур глянца: «Глубокая выемка »;
  • Установите флажок для параметра «Сглаживание »;
  • Режим тени – «Умножение »;
  • Непрозрачность: 0%.

Шаг 2

  • Контур: «Перевернутый конус »;


Таким образом, мы добавили тексту блеск:

5. Стили для второй копии слоя Horizontal

Дважды кликните на второй копии слоя Horizontal , чтобы применить к ней следующие стили слоя:

Шаг 1

Добавьте «Тиснение » со следующими значениями параметров:

  • Размер: 16;
  • Снимите флажок для параметра «Глобальное освещение »;
  • Угол: 18;
  • Высота: 58;
  • Контур глянца: «Полукруглый »;
  • Установите флажок для параметра «Сглаживание »;
  • Режим подсветки: «Яркий свет »;
  • Режим тени: «Умножение »;
  • Непрозрачность: 0%.

Шаг 2

Добавьте «Контур » со следующими значениями параметров:

  • Контур: Пила 2;
  • Установите флажок для параметра «Сглаживание ».

Шаг 3

Добавьте стиль «Внутреннее свечение » со следующими значениями параметров:

  • Режим смешивания: «Линейный свет »;
  • Шум: 5%;
  • Цвет: #ffdcfa ;
  • Источник: «Из центра »;
  • Размер: 38.

Шаг 4

Добавьте стиль «Внешнее свечение » со следующими значениями параметров:

  • Цвет: #7f2d65 ;
  • Размер: 15.


Таким образом, мы задали стили для всех горизонтальных слоев, добавив еще больше блеска и свечения:

6. Стили исходного слоя Vertical

Шаг 1

Кликните правой кнопкой мыши по оригинальному слою Horizontal , выберите пункт «Копировать стили слоя », затем кликните правой кнопкой мыши по оригинальному слою Vertical и выберите пункт «Вставить стили слоя ».

Дважды кликните по исходному слою Vertical и измените значения параметров «Угол » и «Высота » для стиля «Тиснение » на 90 и 74 соответственно:

Шаг 2

Для «Внутреннего свечения » измените только значение «Размера » на 15:


Мы скорректировали эффект неонового света для вертикальных и диагональных частей:

7. Стили первой копии слоя Vertical

Скопируйте и вставьте стили первой копии слоя Horizontal в первую копию слоя Vertical , а затем дважды кликните по первой копии слоя Horizontal и измените значения параметров «Угол » и «Высота » для стиля «Тиснение » на -76 и 53 соответственно:


Вот как должна выглядеть первая копия слоя Vertical :

8. Стили второй копии слоя Vertical

Скопируйте и вставьте стили второй копии слоя Horizontal во вторую копию слоя Vertical , а затем измените значения параметров «Угол » и «Высота » для стиля «Тиснение » на -82 и 53 соответственно:


На этом этапе мы закончили редактирование всех составляющих текста:

9. Добавление дополнительного свечения и создание проводов

Шаг 1

Создайте новый слой ниже оригинального (скрытого ) слоя текста, назовите его Background Light и измените его режим смешивания на «Линейный свет ».

Установите цвет переднего плана на #98338b , выберите инструмент «Кисть » и установите большой размер для кисти с мягкими, круглыми краями. Затем кликните один раз, чтобы добавить пятна цвета за текстом:

Шаг 2

Создайте новый слой ниже слоя Background Light и назовите его Cable . Выберите инструмент «Перо » и в панели параметров установите значение «Контур ».

Создадим контуры для проводов между буквами. Нужно нажать несколько раз, чтобы добавить угловые опорные точки, а с помощью их перетаскивания создать кривые. Имейте в виду, что контуры, которые мы создаем, не должны быть идеально правильными. С помощью инструмента «Выделение узла » вы всегда сможете изменить опорные точки и направления кривых:

Шаг 3

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

Шаг 4

Не торопитесь с выполнением этой операции, чтобы получить правильный результат:

Шаг 5

Выберите инструмент «Кисть », а затем откройте палитру «Кисти » (Окно> Кисть ) и выберите кисть с жестким круглым наконечником в 7 пикселей с интервалом, выставленным на 1:

Шаг 6

Установите цвет переднего плана на #252525 , выберите инструмент «Выделение узла », кликните по контуру правой кнопкой мыши и выберите пункт «Выполнить обводку контура »:

Шаг 7

В поле «Инструмент » выберите пункт «Кисть » и снимите флажок для опции «Имитировать нажим »:

Шаг 8

Таким образом, мы создадим обводку контура. Нажмите клавишу Enter, чтобы закончить работу с контуром:

10. Стили для проводов

Дважды кликните на слое проводов, чтобы применить следующие стили слоя:

Шаг 1

Добавьте «Тиснение » со следующими значениями параметров:

  • Установите флажок для параметра «Сглаживание »;
  • Режим подсветки: «Яркий свет »;
  • Цвет: #ec6ab7 ;
  • Непрозрачность: 24%.

Шаг 2

Для стиля «Контур » установите флажок параметра «Сглаживание »:

Шаг 3

Добавьте стиль «Наложение узора » со следующими значениями параметров:

  • Режим наложения: «Умножение »;
  • Узор: 8.

Шаг 4

  • Непрозрачность: 60%;
  • Смещение: 13;
  • Размер: 10.


Вот так должны выглядеть провода:

11. Создание креплений проводов

Шаг 1

Выберите инструмент «Прямоугольник » и создайте прямоугольник размером 11 на 15 пикселей:

Шаг 2

Выберите инструмент «Перо+ (добавить опорную точку) » и кликните по сторонам прямоугольника, чтобы добавить две точки в центрах двух вертикальных сторон прямоугольника:

Шаг 3

Выберите инструмент «Выделение узла ». Удерживая нажатой левую кнопку мыши, обведите контуром обе точки, которые мы только что создали, чтобы выделить их. Затем нажмите клавишу со стрелкой влево, чтобы переместить эти точки на 1 пиксель влево:

Шаг 4

Продублируйте слой прямоугольника и перейдите в Редактирование> Трансформирование контура> Повернуть на 90 градусов по часовой стрелке. Переименуйте слои прямоугольников в Н (горизонтальный ) и V (вертикальный ):

12. Стили креплений проводов

Дважды кликните по слою H , чтобы применить к нему следующие стили слоя:

Шаг 1

Добавьте стиль «Наложение градиента » со значением непрозрачности 42%.

Установите флажок для параметра «Градиент ». Чтобы создать градиент, используйте следующие цвета: #151515 слева, #6d6d6d в центре и #161616 справа:

Шаг 2

Добавьте стиль «Тень » со следующими значениями параметров:

  • Непрозрачность: 60%;
  • Смещение: 13;
  • Размер: 10.


Так должны выглядеть горизонтальные крепления:

Шаг 3

Скопируйте и вставьте стили слоя Н для слоя V , а затем дважды кликните по слою V , чтобы изменить значение «Угла » для «Наложения градиента » на 0 :

Шаг 4

Продублируйте и разместите слои креплений вдоль проводов, которые мы создали ранее:

13. Добавление еще одного корректирующего слоя

Нажмите иконку «Создать новый корректирующий слой или слой-заливку » и выберите пункт «Цвет ». Используйте цвет #a34799 , поместите корректирующий слой ниже слоя проводов и измените его режим смешивания на «Яркий свет ». Таким образом, мы применим этот цвет к кирпичам на стене за светящимся текстом, а также увеличим яркость и освещенность всей сцены:

Мы закончили

В процессе создания надписи мы изменили текстуру кирпича и немного ее затемнили. Затем мы создали текст, растрировали его слой и отделили горизонтальные части букв от вертикальных и диагональных.

После этого, мы продублировали и сгруппировали разделенные слои текста, а затем задали для них стили, чтобы создать эффект неонового свечения.

После того, как основной текст был создан, мы добавили небольшой эффект свечения для фона и с помощью инструмента «Перо » создали контуры проводов. Затем мы сгладили контуры и задали для них стили, чтобы придать проводам трехмерность.

В конце мы использовали инструмент «Прямоугольник », чтобы создать несколько креплений провода, изменили их стили и добавили последний корректирующий слой, чтобы улучшить цветопередачу конечного изображения.

Данная публикация представляет собой перевод статьи «How to Create a Realistic Neon Light Text Effect in Adobe Photoshop » , подготовленной дружной командой проекта

Хорошо Плохо

Инертный газ неон присутствует в воздухе в соотношении 1:65000. Приложив к концам трубки с неоновым газом электрический ток, определенной силы тока и напряжения, можно получить красивое свечение. Чистый неон светится красным цветом, все остальные цвета достигаются в результате добавления смеси аргона, ртути и фосфора. Производство трубок с газом – очень точный процесс, не говоря уже об их превращении в буквы. Пользователям Photoshop для имитации подобных эффектов потребуется использовать сплошные мазки, прерывающиеся при переходе между смежными символами. В настоящем примере мы попробуем воспроизвести свечение трубок с неоном. Этот урок будет полезен дизайнеру для визуализации ночных витрин магазинов, аптек, кафе и т.д.

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


2. Создадим фон, к примеру кирпичную стену. На панели инструментов выберем кирпичный темно-красный цвет C-0, M-100, Y-100, K-60.


Зальем фон кирпичным цветом, Edit > Fill или горячая клавиша Shift+Backspace.

3. Выполним команду Filter > Texture > Texturizer.

Выберем текстуру Brick (Кирпич) и зададим значения: Scaling – 200%, Relief – 14, Light – Top Left.

Нажмем ОК.

Назовем этот слой “brick”.

4. Создадим новый слой “clouds». Выберем фоновый цвет C-0, M-100, Y-100, K-70 и основной C-0, M-100, Y-100, K-100.

Зайдем в меню Filter > Render > Clouds.

Выберем режим наложения Multiply.

5. Для получения более реалистичного эффекта, осветлим и затемним произвольные части кирпичной стены, выполнив следующее. Выделим отдельные кирпичи с нажатой клавишей Shift инструментом выделения Restangular Marquee.


При активном слое brick выполним команду Layer > New > Layer via Copy или нажмем Ctrl+J.

Присвоим новому слою имя «lighter brick». При активном выделенном слое осветлим его с помощью команды Image > Adjustments > Brightness/Contrast.

6. При активном слое brick повторим действия пункта 5, на этот раз затемним слой. Назовем слой darken brick. Также можно попробовать выделить еще несколько кирпичей и с помощью Brightness/Contrast сделать среднее значение, задача в том, чтобы освещение кирпичей не было однородным.


7. Далее приспупим собственно к созданию нашей неоновой трубки. Выберем инструмент Type (Текст) и введем слово Cafe, используя подходящий шрифт. В данном случае выбран шрифт Arial Rounded Bold. Зададим красный цвет шрифта.


8. Создадим копию текстового слоя Сtrl+J. Работая с копией текстового слоя, сделаем режим наложения Multiply, Fill – 35 %.

Нажмем правую кнопку на этом слое и выберем Blending Options. Откроется окно Layer Style. Применим эффекты ко вкладкам: Outer Glow, Inner Glow с красным свечением букв, а также Stroke в желтом градиенте (см. настройки на картинках ниже).

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

Материалы

Для работы вам будут нужны:

  • гибкий неон на 12 или 24 В и источник питания к нему;
  • 2-х контактный разъем для гибкого неона;
  • торцевые крышки;
  • алюминиевый профиль;
  • плоская алюминиевая трубка по ширине соответствующая гибкому неону;
  • эпоксидный клей для стальных изделий;
  • наждачную бумагу;
  • проволоку;
  • изоленту или термоусадочную трубку;
  • грунтовку;
  • краску;
  • ножовку;
  • тиски;
  • прозрачный силиконовый клей.

Шаг 1 . Вам нужно составить макет надписи, которая и станет вывеской. По сути, ее нужно перенести на большой лист бумаги, например, ватман и т.д. Поскольку неоновые трубки могут в итоге согнуться не так, как вы себе представляли, стоит черновой вариант макета сделать из круглого провода. Его зафиксируйте кусочками скотча и оцените, то ли это, что вы хотите видеть. После перенесите макет на бумагу.

Шаг 2 . Основываясь на заготовленном шаблоне, плоскую алюминиевую трубку загните, формируя каркас. На сгибах и пересечениях его нужно будет сварить.

Шаг 3 . С обратной стороны каркаса приварите два металлических крепления, которые понадобятся для подвешивания надписи к стене.

Шаг 4 . Разрежьте подготовленный алюминиевый профиль на малые детали, 1 – 2 см длиной. Их нужно закрепить по всей длине заготовленного каркаса. Будьте внимательны при их креплении, так как устанавливать кусочки профиля следует строго по той стороне, где будет проходить гибкий неон. Из-за поворотов и перекручивания будет казаться, что они располагаются по обе стороны от трубки, но это не так.

Шаг 5 . Перед креплением профиля металлический каркас зашкурьте по всей длине, особо уделив внимание местам, где использовалась сварка.

Шаг 6 . Прикрепите кусочки профиля к раме в намеченных заранее точках, используя эпоксидный клей. Оставьте все до полного высыхания клеящего материала.

Шаг 7 . Нанесите на поверхность полученного каркаса грунтовку. Вновь оставьте все до полного высыхания материала.

Шаг 8 . Закрепите на раме гибкий неон. Если в крепления он входит не достаточно плотно, используйте эпоксидный клей.

Шаг 9 . Излишки гибкого неона отрежьте.

Шаг 10 . Установите разъем источника питания, соблюдая полярность.

Шаг 11 . Проверьте, работает ли собранная конструкция.

Шаг 12 . Если все в порядке, места соединения неона и источник питания скройте, используя изоленту или термоусадочную трубку. Закрепите торцевые крышки, капнув в них клеем на основе силикона.

Крутой эффект подойдет тем, кто хорошо владеет фотошопом! Удивить своих подписчиков или просто научиться делать светящуюся надпись довольно просто. Давайте посмотрим, как сделать неоновую надпись в фотошопе?

Подготовка фона

Для начала в фотошопе нужно открыть фоновое изображение. В большинстве случаев берут картинку кирпичной, каменной или металлической стены. Достаточно в поисковике ввести «кирпичная стена».

Вариант 1

Как подготовить фон для неоновой надписи:

  1. Открыть картинку с изображением кирпичной стены (или любой вашей).
  2. Справа в фотошопе есть панель со «Слоями». Именно там справа от маленького изображения нашей картинки нужно нажать на замочек и открепить слой, кликнув по нему два раза.
  3. В появившимся окне можно задать абсолютно любое название своему слою (а можно и не задавать) и нажать ОК.
  4. Далее открыть Изображения-Размер изображения . И выставляем параметры ширины и высоты на 1280*720.
  5. Затем открыть Фильтр-Коррекция дисторсии .
  6. Справа кликнуть на вкладку «Заказная» и поставить «Удалить искажение» на -1,00. Нажать ОК.
  7. В правой менюшке, где показаны все слои, в самом низу навести курсор на маленький кружок. Кликнуть по нему и выбрать пункт «Цветовой тон/Насыщенность» .
  8. Выставить параметры Яркости на -60 (минус 60), а Насыщенности на -90.
  9. Скрепить слои между собой. На этой же вкладке, где до этого выставлялись параметры, внизу есть квадратик со стрелочкой вниз. Его и надо нажать.

Вариант 2

Как сделать неоновую надпись в фотошопе и фон:

  1. Открыть изображение.
  2. В пункте Слои нажать на маленький кружок и выбрать вкладку «Уровни».
  3. Белый цвет убавить до значения 65-75 (любой диапозон).

Команда Control и «+» на Windows, команда Command и «+» на Mac увеличивают картинку. Подобный эффект можно настроить в настройках, чтобы фото увеличивалось по скроллингу колесика мыши.

Делаем магию

Дальше дело останется за малым. Нужно выбрать и скачать шрифт , который вам понравится. Не забудьте его установить на компьютер! Можно поесть французских булок, да выпить чаю во время установки.?

Как сделать неоновую надпись своими руками:

  1. Написать текст и масштабировать надпись до нужного размера.
  2. В панели Слои два раза кликнуть по слою и вызвать меню с настройками Стиль слоя.
  3. Непрозрачность заливки поставить на 0%.
  4. В пункте «Обводка» поставить Размер на 4 пикселя, а Положение выбрать «Из центра», выбрать Цвет обводки по желанию.
  5. В пункте «Внешнее свечение» задать Режим наложения – «Нормальный». Выбрать любой цвет из палитры по желанию. Размер поставить на 12 пикселей.
  6. В пункте «Внутреннее свечение» задать Режим наложения – «Нормальный». Выбрать любой цвет из палитры по желанию. Размер поставить на 12 пикселей.
  7. В пункте «Тень» и «Внутренняя тень» поставить Размер на 7 пикселей, Смещение на 7 пикселей.
  8. Создать дубликат слоя с помощью Ctrl + J.
  9. На панели слоев выключить все настройки, кроме «Обводки» .
  10. Настроить в «Обводке» следующие параметры: Размер на 2 пикселя, Цвет – белый.
  11. Неоновая надпись готова! А вы великолепны!

Подсветка

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

Как сделать подсветку неоновой надписи:

  1. На панели Слои, где находятся слои ваших надписей, в самом углу есть небольшая стрелочка, которая позволяет свернуть все настройки. Необходимо проделать эту процедуру с 2 слоями текста.
  2. Зажать Ctrl и создать новый слой. Он должен находиться под слоями надписей.
  3. Зажать Ctrl и нажать на пентаграмму текстового слоя (буква Т). Должен выделиться весь слой текста.
  4. В верхнем меню выбрать вкладку Выделение – Уточнить край .
  5. В появившемся окошке во вкладке «Вид» выбрать режим «Наложение» .
  6. Растушевку поставить на 50, а Сместить край на 70.
  7. Нажать Ctrl + Delete и залить надпись белым цветом.
  8. В панели Слои выбрать Режим наложения – Перекрытие .
  9. Далее кликнуть два раза на этот же слой, в «Наложение цвета» выбрать любой оттенок для надписи, а Режим наложения поставить «Цветность».

Лайфхак для телефонов

Разработчики пока не создали подобное приложение для телефонов. Но есть две программы, где можно сделать неоновую надпись онлайн. Называются приложения Рисуйте картинки и создавайте заметки и Kids Doodle . Единственный минус: в обоих редакторах нужно рисовать от руки.

Будьте самыми стильными! Используйте супер эффекты.