Creați un efect de text neon strălucitor

Sep 11, 2025
să

Adesea, sunt cele mai simple efecte care arată cel mai frapant, iar textul Neon este un astfel de proiect. De asemenea, este mult mai ușor să creați un efect de neon care arată realist decât credeți. În timp ce întregul tutorial folosește doar o imagine de fundal, creierul tău se învârte în a vedea acest semn real, funcționând neon - asta este puterea lui Photoshop CC. Stiluri de strat. Aflați mai multe despre Lucruri uimitoare pe care le puteți face cu straturile lui Photoshop aici .

Faptul că întregul proiect este construit de la zero - de la font la culorile strălucirii, la eventuala animație - înseamnă că există o mulțime de scopuri de creativitate. Puteți alege exact ceea ce doriți ca fiecare parte din acest efect să arate.

Neon continuă să fie popular. Afișarea tonurilor saturate împotriva unui fundal întunecat și dezactivat este o modalitate excelentă de a prezenta a Pagina de aterizare , A logo design sau un antet, și este ușor să vă animați lucrarea și să o salvați ca un GIF cu o dimensiune redusă a fișierului (păstrați fișierele în siguranță Stocare in cloud ). Să ne aruncăm în cum să o creăm.

Crearea unui font care urmează să fie afișat pe un site nou? Ai nevoie de Builder de site-uri web și excelent web hosting .

01. Începeți să creați fontul

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

Folosiți instrumentul Penshop pentru a desena prima scrisoare

Creați un nou document 550x550px în Photoshop și aduceți grila lovind cmd / ctrl + ' . Creați un nou strat și cu instrumentul Pen, schițați prima literă. Lăsați lacunele în caracter, deoarece aceasta va fi o tapetate în stil neon. Odată ce sunteți fericit, loviți accident vascular cerebral în fila Căile pentru a desena în scrisoare.

02. Lucrați prin alfabet

dollar and pounds signs in Photoshop

Nu uitați de caracterele speciale

Creați cât mai multe caractere doriți, cu stiloul pe un strat nou de fiecare dată. Dacă doriți, adăugați în anumite caractere speciale, cum ar fi simbolurile valutare, punctuația și scrisorile accentuate. Urmați același stil de bază cu care ați început, astfel încât fontul dvs. este coeziv.

03. Deplasați-vă în FontCreator

fontcreator trial

Există un proces gratuit de FontCreator disponibil dacă aveți nevoie de ea

Daca ai FontCreator de logică mare , aceasta este partea în care vă puteți transforma personajele într-un font. Dacă nu, este disponibil un proces gratuit. Prin lipirea fiecărui caracter în FontCreator, putem crea o tapete de utilizare pentru Photoshop.

Lucrați-vă calea prin fontonă făcând dublu clic pe fiecare caracter și lipire în munca dvs. desenată. Asigurați-vă că fiecare literă se află pe aceeași linie de bază.

04. Kern textul dvs.

check your kerning

Întotdeauna verificați-vă kerning-ul

Kerning este spațiul dintre fiecare dintre litere (pentru mai multe informații, aruncați o privire la noi Glosar tipografic ), iar opțiunea auto-kerning din cadrul FontCreatorului se află în mod natural literele, astfel încât fontul să pară îngrijite. Încercați această opțiune și asigurați-vă că fiecare literă arată bine împreună.

Odată ce este complet, exportați fontul și instalați-l în computer. Acest lucru va adăuga automat la Photoshop CC.

05. Configurați un document Photoshop

photoshop document palette

Utilizați paleta sugerată sau creați-vă propria dvs.

Creați un nou document în Photoshop. Pe un strat nou, creați o paletă de culori utilizând o perie mare. Am mers cu # 501d26, # AF273D, # FFADAE1, # 35E985 și # B2DCC4.

Apoi găsiți o imagine potrivită de fundal și trageți-o în Photoshop. Creați un strat nou, umpleți-l culoarea roșie adâncă și duplicați-vă. Setați un strat pentru a multiplica și unul la culoare. Creați un strat de luminozitate / contrast și setați la -75 în luminozitate. Duplicați acest lucru și masca centrul pentru o vignetă.

06. Introduceți textul

default text in Photoshop

Introduceți un text și rasterizați-l

Prindeți instrumentul de tip și selectați fontul (dacă nu ați creat un font mai devreme, locul doar în fiecare literă individual). Verificați-vă textul, înainte Ctrl + Faceți clic dreapta stratul și selectarea tipului de rasterize.

07. Creați o strălucire

add a bevel in Photoshop

Dați textului dvs. un pic mai profund cu o bucată minunată

Ctrl + Faceți clic dreapta stratul și mergeți la opțiunile de amestecare & GT; Strălucire exterioară. Acolo, introduceți o opacitate de 50%, o răspândire de 5% și o dimensiune de 63px. Acum, puteți vedea că textul dvs. neon începe să arate mult mai realist. Alegeți o culoare strălucitoare.

Faceți clic pe Bevel și Embos, încă în opțiunea Stiluri de strat. Alegeți Adâncime: 250%, Dimensiune: 5px, se înmoaie: 2px. Utilizați modurile de evidențiere și umbra pentru a adăuga o adâncime mai mare la text și redați cu aceste opțiuni până când găsiți amestecul potrivit.

08. Redați-vă cu umbrele

drop shadow in Photoshop

Nu vă încurcați strălucirea exterioară cu umbra de cădere

Pentru umbra interioară, alegeți aceeași culoare strălucitoare pe care ați ales-o pentru strălucirea exterioară. Tot ce va trebui să editați aici este dimensiunea, în funcție de cât de mare este textul. Modificați acest lucru și lăsați toate celelalte valori la 0.

Pe măsură ce textul neonului va sta ușor de pe perete, vom avea nevoie de o umbră subtilă de cădere, dar nu prea mult ca nu vrem să compromită strălucirea exterioară. Utilizați o opacitate scăzută și dați-o mai multă distanță și dimensiune.

09. aprindeți-o

string added to text in Photoshop

Asigurați-vă că șirul urmează prin toate caracterele

Du-te la stratul de text, Ctrl. / Faceți clic dreapta și alegeți Stiluri de copiere. Faceți clic pe stratul animal, Ctrl. / Faceți clic cu butonul din dreapta și alegeți stiluri de straturi. Faceți dublu clic pe pictograma FX și rotiți culorile roz la verde pentru un mic contrast cu textul.

Prindeți instrumentul Pen și creați un șir prin textul neonului și animalele pe care le-ați creat. Asigurați-vă că urmează prin toate caracterele și apoi accident vascular cerebral cu # 808080, cu o perie de 2px selectată cu spațiere 1%.

10. Adăugați o umbră de picătură

add a drop shadow in Photoshop

Dați șirului un teșit și un pic de umbră de picătură

Mergeți la opțiunile de amestecare pentru șirul pe care tocmai l-ați făcut. Capul pentru a vă da o formă subtilă și dați-i și o umbră subtilă de cădere. Variabilele aici depind de dimensiunea și forma șirului pe care l-ați creat, deci experimentați doar pentru a vedea ce funcționează.

11. Creați o versiune "Off"

flickering effect in Photoshop

Acum faceți o copie non-stralucitoare, astfel încât să puteți crea un efect de pâlpâire

Să creăm un strat de text care nu este strălucitor, așa că putem anima o pâlpâire pe unele dintre litere. Duplicați stratul de text, apoi ascundeți stilul strălucitor exterior. Setați umbra interioară la # 808080, apoi modificați luminozitatea acestui strat la -50, utilizând Hue / Saturație ( cmd / ctrl. +. U. ).

Pe stratul de text strălucitor, apucați instrumentul Marquee și selectați câteva litere pe care doriți să le opriți scurt în animație. Faceți duplicări ale acestui strat, cu aceste litere mascate până când aveți suficiente straturi pentru a crea o animație.

12. Animați-vă designul

export animation as a gif in Photoshop

Exportați ca un gif animat și sunteți bine să mergeți

Mergeți la dreapta-dreapta de la Photoshop și selectați MOVEI ca opțiune spațiu de lucru. Cronologia de animație va apărea în partea de jos; Aici puteți defini ce straturi sunt afișate sau ascunse, oricât de mult doriți să fie.

Creați cadre noi de-a lungul fundului cu diferite litere fie strălucind, fie nu strălucitoare, în funcție de faptul dacă stratul este vizibil sau nu. Setați ora animației fiecărui strat folosind săgeata mică pe fiecare cadru. Salvați ca GIF utilizând Salvare pentru Web.

Acest articol a fost publicat inițial în Web Designer, revista Creative Web Design - oferind tutoriale de experți, tendințe de ultimă oră și resurse gratuite. Aboneaza-te la designerul web aici .

Articole similare:

  • 40 trebuie să vezi exemple de tipografie cinetică
  • Cum se creează un efect de scriere animat
  • Creați-vă propria tamponare 3D

să - Cele mai populare articole

Cum să curățați pensule: Ghidul definitiv

să Sep 11, 2025

(Credit de imagine: Sonny Flanaghan) Învățați cum să curățați periculosul în mod corespunzător este o abili..

Lucrează inteligent cu Zbrush UI

să Sep 11, 2025

Orice care stimulează mintea noastră poate afecta productivitatea noastră și este important să recunoaștem factorii care susțin munca noastră, indiferent dacă este un fel de muzică ..

Cum să atragă cifre mai realiste

să Sep 11, 2025

În acest tip de desen tutorial ne vom concentra pe tors și sânii, în special asupra modului în care sânii schimbă forma da..

Creați un interior primitor folosind linia de artă

să Sep 11, 2025

Pentru acest atelier, voi crea un fundal interior cu artă de linie și un stil de vopsea texturate. Vreau să mă stabilesc pent..

Achiziționați modelul dvs. greu de suprafață în 3DS MAX

să Sep 11, 2025

În acest tutorial, voi împărtăși tehnicile și metodele pe care le folosesc pentru a crea modele de suprafață dur ..

Creați mișcare dinamică într-o compoziție

să Sep 11, 2025

Înainte de a începe desenul, este important să decideți ce tip de mișcare doriți să capturați. Încercați să o păstra�..

O introducere la testul de frontend

să Sep 11, 2025

Pagina 1 din 2: Diferite tipuri de teste de frontend (și când să le folosească) ..

Cum se creează păr în cinema 4d

să Sep 11, 2025

Inspirat de arta personajului fantastic a lui Carlos Ortega Elizalde și Lois van Baarle, am decis să încerc mâna mea la crear..

Categorii