Lag en Ornate Website Header Photoshop Tutorial

28 februar, 2006 av Oli ° 12 kommentarer

Denne veiledningen vil vise deg hvordan du lager en dekorativ header som du kan bruke på nettsteder eller blogger.




Dette er hva du skal lage:
Nettside header tutorial

Første skritt er å opprette et tomt lerret på rundt 770px bred og 400 piksler høyt, og velg deretter avrundet rektangel verktøy, stille inn avstanden til 9px og trekke ut formen på overskriften din hvor høy du ønsker det:

Nettside header tutorial step1

Neste opp vil legge til en gradient i form - høyreklikk på figurens laget og legge til en gradient overlay innstillinger:

Nettside header tutorial trinn 2

Velg en lys lilla og mørk lilla for graderingen, brukte jeg # 190141 for den mørke og # 5E01F7 for lyset
Din formen vil nå se slik ut:

Nettside header tutorial Trinn 3

Nå må vi velge et mønster på overskriften, for denne opplæringen brukte jeg en fra den utmerkede squidfinger nettsted .
Min valgt mønster var:

mønster

Du kan bruke denne, bare høyreklikk på bildet og lagre det eller bla gjennom squidfinger er å finne en du foretrekker.

Nå åpner mønsteret i photoshop, velger du den og klippe og lime inn i din header psd, ctrl + klikk på mønsteret laget for å velge det, som så:

Nettside header tutorial trinn 4

Deretter går du til> Rediger> Definer Pattern> og gi den et navn.

Ctrl + Klikk på hoved header form lag å velge, opprette et nytt lag over det, og klikk på Paint Bucket Tool. Slå fylltype fra "forgrunn" til "mønster" og velg din mønster fra nedtrekksmenyen.

Nettside header tutorial trinn 4

Fyll det nye laget med mønster ditt:

Nettside header tutorial trinn 5

Høyreklikk mønsteret laget og velg blandingsalternativer, endre Blend Mode til "overlegg" og ta opacity ned til 39%:

Nettside header tutorial trinn 6

Din header vil nå se slik ut:

Nettside header tutorial trinn 7

Velg header formen laget, høyreklikk og gå inn blandingsalternativer, vil vi nå legge til noen ytre glød:

Nettside header tutorial trinn 8

En ett 4pixel inne slag:

Nettside header tutorial trinn 9

Du skal nå ha:

Nettside header tutorial steg 10

Nå endelig legge til din logo / tekst og navigasjon og din header er ferdig:

Nettside header photoshop tutorial

Du kan også laste ned psd for denne opplæringen.

Om Oli
Oliver Dale går Kooc Media, et britisk-basert web selskap som spesialiserer seg på Web Apps, nettbaserte samfunn, Wordpress Tutorials & Wordpress Plugins .

Kommentarer

12 Responses to "Lag en Ornate Website Header Photoshop Tutorial"
  1. Video Tutorials - http://videotutorials.blogspot.com/ sier:

    Utmerket tutorial

  2. mheidzir - sier:

    dette er bra tutorial. ønsker å se GIMP tutorial i fremtiden

  3. Ivan Minic - http://www.burek.co.yu sier:

    Cute :)

  4. Seyhan - sier:

    Dette er veldig hyggelig, takk. Hold oppe det gode arbeidet ..

  5. morly - http://orderonline.harisen.jp/celexa/ sier:

    Veldig Veldig fin informasjon her ... Takk

  6. Henry - http://www.henryhoffman.com sier:

    Nice tutorial!

    Du kan laste ned massevis av gratis web design elementer som ligner dette på http://www.stemplate.com

  7. Svart Tiger - http://www.resimsite.com sier:

    Takk, fin tutorial!

  8. Mattias B. - http://none sier:

    Takk Jeg likte denne tuturial. Enkle effekter som kan brukes i masse måter virkelig hjelpe programmererne som prøver å sette ut noe grafisk nå og da uten å bli latterliggjort =)

  9. psdtemplates - http://www.psdtemplates.org sier:

    Fin effekt. Vil prøve det snart. Tnx igjen!

  10. Laura - sier:

    Flott tutorial, takk!

  11. Chalo - sier:

    Flott tutorial - Basic, men med noen funksjoner jeg var ute etter, ekstra bonus.

    Takk.

Tutorial Blog