빛나는 네온 텍스트 효과를 만듭니다

Sep 14, 2025
어떻게

종종 가장 눈에 띄는 가장 간단한 효과이며 네온 텍스트는 그러한 프로젝트 중 하나입니다. 또한 당신이 생각하는 것보다 현실적으로 보이는 네온 효과를 창출하는 것도 훨씬 쉽습니다. 이 전체 자습서는 하나의 배경 이미지 만 사용하는 동안, 당신의 두뇌는 이것을 실제로 만나는 네온 사인으로 이것을보고 있습니다. Photoshop CC. 의 계층 스타일. 그 사항에 대해 자세히 알아보십시오 여기서 Photoshop의 레이어로 할 수있는 놀라운 일들 ...에

이 전체 프로젝트는 글꼴에서 글로우의 색상에서 최종 애니메이션에 대한 글꼴에서 처음부터 제작되었다는 사실은 창의성을 위해 많은 범위가 있음을 의미합니다. 이 효과의 모든 부분이 원하는 것을 정확히 선택할 수 있습니다.

네온은 계속해서 인기가 있습니다. 어두운, 음소거 된 배경에 대해 포화 톤을 보여주는 좋은 방법은 방문 페이지 , ㅏ 로고 디자인 또는 헤더를 사용하면 작업을 애니메이션하고 파일 크기가 부족한 GIF로 저장하기 쉽습니다 (파일을 안전하게 유지하십시오. 클라우드 스토리지 짐마자 그것을 만드는 방법에 대한 잠수합시다.

새 웹 사이트에 표시 할 글꼴 만들기? 너는 필요해 웹 사이트 빌더 그리고 우수한 웹 호스팅 ...에

01. 글꼴 만들기 시작

Use Photoshop's Pen tool to draw the letter 'a'

Photoshop의 펜 도구를 사용하여 첫 글자를 그립니다.

Photoshop에서 새 문서 550x550px를 작성하고 타격을 통해 그리드를 가져 오십시오. cmd / ctrl + ' ...에 새 레이어를 만들고 펜 도구로 첫 글자를 스케치하십시오. 이것은 네온 스타일의 서체가 될 것처럼 캐릭터의 틈을 남겨 두십시오. 일단 행복하면 경로 탭에서 획을 눌러 문자를 그립니다.

02. 알파벳을 통해 일하십시오

dollar and pounds signs in Photoshop

특별한 캐릭터를 잊지 마십시오

매번 새 레이어의 펜으로 원하는만큼 많은 문자를 만듭니다. 원하는 경우 통화 기호, 구두점 및 악센트가있는 문자와 같은 일부 특수 문자를 추가하십시오. 당신이 시작한 동일한 기본 스타일을 따르십시오. 그래서 글꼴이 응집력이 있습니다.

03. FontCreator로 이동하십시오

fontcreator trial

필요한 경우 사용할 수있는 FontCreator의 무료 평가판이 있습니다.

당신이 가지고 있다면 하이 로직 FontCreator. , 이것은 캐릭터를 글꼴로 바꿀 수있는 부분입니다. 그렇지 않은 경우 무료 평가판을 사용할 수 있습니다. 각 문자를 FontCreator에 붙여서 Photoshop 용 사용할 수있는 서체를 만들 수 있습니다.

각 캐릭터를 두 번 클릭하고 펜으로 그려진 작업에 붙여 넣기를 통해 FontCreator를 통해 작업하십시오. 각 문자가 같은 기준선에 있는지 확인하십시오.

04. KERN 텍스트

check your kerning

항상 커닝을 다시 확인하십시오

커닝은 각 문자 사이의 공간입니다 (자세한 내용은 우리의 봐 활판 인쇄 용어집 ) 및 FontCreator 내의 자동 커닝 옵션은 글꼴이 깔끔하게 보이도록 자연스럽게 글자를 공백으로 공백합니다. 이 옵션을 사용해보십시오. 각 문자가 함께 잘 보이는지 확인하십시오.

완료되면 글꼴을 내보내고 컴퓨터에 설치하십시오. 자동으로 Photoshop CC에 추가됩니다.

05. Photoshop 문서를 설정하십시오

photoshop document palette

제안 된 팔레트를 사용하거나 자신의 것을 만들어냅니다

Photoshop에서 새 문서를 만듭니다. 새 레이어에서 큰 브러시를 사용하여 색상 팔레트를 만듭니다. 우리는 # 501D26, # AF273D, # F74663, # FFDAE1, # 35E985 및 # B2DCC4와 함께 갔다.

그런 다음 적절한 배경 이미지를 찾아 Photoshop으로 드래그하십시오. 새 레이어를 만들고 깊은 붉은 색을 채우고 복제하십시오. 하나의 레이어를 곱하고 하나의 색상으로 설정하십시오. 밝기 / 대비 레이어를 만들고 -75 밝기로 설정하십시오. 이것을 복제하고 짤막한 센터를 마스크하십시오.

06. 텍스트를 입력하십시오

default text in Photoshop

텍스트를 입력하고 래스터를 입력하십시오

유형 도구를 잡고 글꼴을 선택하십시오 (이전에 글꼴을 만드는 경우 개별적으로 각 문자로 제 위치). 전에 텍스트를 철자하십시오 Ctrl + 오른쪽 클릭 레이어 및 래스터 화 유형을 선택합니다.

07. 글로우를 만드십시오

add a bevel in Photoshop

텍스트를 사랑스러운 베벨로 조금 더 깊이 깊게주세요.

Ctrl + 마우스 오른쪽 버튼을 클릭하십시오 계층, 그리고 블렌딩 옵션 & gt; 외부 광선. 거기에서 불투명도가 50 %, 5 %의 확산 및 크기 63px의 크기를 입력합니다. 이제 네온 텍스트가 훨씬 더 현실적으로 보이기 시작할 수 있습니다. 밝은 색을 선택하십시오.

베이브 및 엠보싱을 클릭하십시오. 레이어 스타일 옵션에서 여전히 여전히 있습니다. 깊이 선택 : 250 %, 크기 : 5px, soften : 2px. 하이라이트 및 섀도우 모드를 사용하여 텍스트에 조금 더 깊이 깊이를 추가하고 올바른 믹스를 찾을 때 까지이 옵션으로 재생하십시오.

08. 그림자로 놀아 라

drop shadow in Photoshop

너의 바깥 쪽에서 너의 바깥쪽에 빛을 엉망이 없어.

내부 그림자의 경우 바깥 광선에 대해 선택한 밝은 색을 선택하십시오. 텍스트가 얼마나 큰지에 따라 여기에서 편집해야 할 모든 크기입니다. 이것을 변경하고 다른 모든 값을 0에 두십시오.

네온 텍스트가 약간 벽에 앉아있을 것입니다. 우리는 미묘한 드롭 그림자가 필요할 것입니다. 그러나 우리가 바깥 쪽 글로우를 타협하고 싶지 않아서 너무 많이 아닙니다. 낮은 불투명도를 사용하고,이 하나의 거리와 크기를 더 멀리하십시오.

09. 그것을 밝게하십시오

string added to text in Photoshop

문자열이 모든 문자를 통해 다음 문자를 따르고 있는지 확인하십시오.

텍스트 레이어로 이동하십시오. Ctrl. / 마우스 오른쪽 버튼을 클릭하고 레이어 스타일 복사를 선택하십시오. 동물 레이어를 클릭하십시오. Ctrl. / 마우스 오른쪽 버튼을 클릭하고 레이어 스타일 붙여 넣기를 선택하십시오. FX 아이콘을 두 번 클릭하고 핑크색을 녹색으로 녹색으로 바꾸면 텍스트가 약간 대조됩니다.

펜 도구를 잡고 네온 텍스트와 생성 한 동물을 통해 문자열을 만듭니다. 모든 캐릭터를 통해 다음과 같은 경우 # 808080으로 뇌졸중이 있는지 확인하십시오. 2PX 브러시가 1 % 간격으로 선택된 것으로 선택하십시오.

10. 드롭 - 그림자를 추가하십시오

add a drop shadow in Photoshop

문자열을 베벨과 약간의 그림자를 줘라.

방금 만든 문자열의 블렌딩 옵션으로 이동하십시오. 미묘한 모양을주기 위해 베벨을 베벨로 향하게하고 미묘한 그림자도주십시오. 여기 변수는 생성 한 문자열의 크기와 모양에 따라 다르므로 작동하는 것을 확인하기 위해 실험하십시오.

11. 'OFF'버전을 만듭니다

flickering effect in Photoshop

이제 빛나는 복사본을 만들어 깜박 거리는 효과를 만들 수 있습니다.

빛나지 않는 텍스트 레이어를 만들어서 일부 편지에서 깜박 거림을 움직일 수 있습니다. 텍스트 레이어를 복제 한 다음 외부 글로우 스타일을 숨 깁니다. 내부 그림자를 # 808080으로 설정 한 다음 색조 / 채도를 사용 하여이 계층의 밝기를 -50으로 변경하십시오. cmd / ctrl. + 유 짐마자

빛나는 텍스트 레이어에서 Marquee 도구를 잡고 애니메이션에서 간략하게 끄려는 몇 글자를 선택하십시오. 이 레이어의 복제본을 사용하면이 문자가 애니메이션을 만들 수있는 레이어가 충분할 때까지 마스크되어 있습니다.

12. 귀하의 디자인을 움직입니다

export animation as a gif in Photoshop

애니메이션 GIF로 내보내고 당신은 좋은 것입니다.

Photoshop의 오른쪽 위로 이동하여 작업 공간으로 동작을 선택하십시오. 옵션을 선택하십시오. 애니메이션 타임 라인은 하단에 나타납니다. 여기에서는 어떤 레이어가 표시되거나 숨겨지기를 원한다면 어떤 레이어를 정의 할지를 정의 할 수 있습니다.

레이어가 보이는지 여부에 따라 빛나거나 빛나지 않는 다양한 문자로 바닥을 따라 새 프레임을 만듭니다. 각 프레임의 작은 화살표를 사용하여 각 레이어의 애니메이션의 시간을 설정하십시오. 웹 저장을 사용하여 GIF로 저장하십시오.

이 기사는 원래 독창적 인 웹 디자인 잡지 (Creative Web Design Magazine)에서 원래 게시되었습니다. 전문 자습서, 최첨단 트렌드 및 무료 리소스를 제공했습니다. 웹 디자이너를 구독하십시오 ...에

관련 기사:

  • 40 Kinetic Typography의 예를보아야합니다
  • 애니메이션 타이핑 효과를 만드는 방법
  • 자신의 3D 서체를 만듭니다

어떻게 - 가장 인기있는 기사

지도 그림 : 단계별 가이드

어떻게 Sep 14, 2025

지도 일러스트레이션은 지난 몇 년 동안 진짜 부활을 받았습니다. 드라이 Google지도에 대한 흥미로운 대안은 도시의 분위기를 진정으로 포착하�..

그리드와 FlexBox가있는 블로그 만들기

어떻게 Sep 14, 2025

지난 2 ~ 3 년 동안 도약과 경계에서 레이아웃이 앞으로 나아가는 것을 보았습니다. 이제 이러한 �..

ARTRAGE 5가있는 페인트 표현 초상화 아트

어떻게 Sep 14, 2025

artrage는 인기있는 디지털 아트 도구입니다 (더 많은 것을 위해 artrage. 소개)이 튜토리�..

Photoshop에서 다채로운 애니메이션 아트를 페인트하는 방법

어떻게 Sep 14, 2025

이 Photoshop 자습서에서는 일러스트 레이터로 사용하는 몇 가지 주요 개념을 가질 것입니다. 나는 �..

30 개의 Keyshot 렌더링 팁

어떻게 Sep 14, 2025

이미지 렌더링, 모델의 애니메이션 또는 전체 장면의 애니메이션은 예술 작성의 중요한 단계입니..

원격 팀을위한 마스터 버전 제어

어떻게 Sep 14, 2025

지난 몇 년 동안 웹 개발에서 훨씬 더 흔하게 작동했습니다. 버전 제어하기 전에 동일한 개발 프�..

기초가있는 카드 기반 UI를 구축하십시오

어떻게 Sep 14, 2025

카드 기반 웹 사이트 레이아웃 웹을 밟았습니다. Pinterest, Twitter, Facebook 및 Google로 인기..

모든 이메일 클라이언트에서 완벽한 메시지 생성

어떻게 Sep 14, 2025

모든 이메일 마케팅 캠페인이 일하면 이메일은받은 편지함에 도달하고 다른 모든 사람들로부터 밖으로서야합니다. 그러나 이야기는 거기에서 �..

카테고리