Volite web dizajn?

Zašto ne podijelite svoje znanje s cijelim svijetom? Svatko može pisati za Kroativ i na taj način se promovirati.

Pomoć potrebitima

http://www.hck.hr

Hrvatski Crveni križ

u službi humanosti od 1878.

Letterpress – Efekt utisnutih slova u web dizajnu

Autor/ica Weberica

Završila fotografiju na ŠPU, a nakon toga grafički i web dizajn. Rođena, živi i radi u epicentru Zagreba. Stalni član Kroativ mreže i autor mnogih korisnih članaka, radi kao stalni suradnik Web Inkubator studija.

Oglas

Ove godine je u web dizajnu iznimno popularan efekt utisnutih slova ili po naški – Letterpress. U ovom vrlo kratkom photoshop tutorialu naučiti ćemo kako ga napraviti, a izgledati će ovako:

letterpress efekt

letterpress efekt

Otvorimo novi dokument i na prvi layer izlijemo svjetloplavu boju ili nježni gradient. (slika 1)

slika 1

slika 1

Odaberemo jedan od modernih boldanih fontova na kojem će se efekt lijepo vidjeti i na novi layer napišemo željeni tekst. Mi smo koristili font “futura”. (slika 2)

slika 2

slika 2

Desnom tipkom miša kliknemo na layer sa tekstom a zatim na blending options i otvoriti će nam se prozor kao na slici 3

slika 3

slika 3

Namjestiti ćemo slijedeće postavke:

drop shadow: blend mode color dodge, #e6f1fb, opacity 43%, angle 90, distance 1, spread 0, size 1

Inner shadow: blend mode multiply, #000000, opacity 75%, angle 90, distance 2, choke 0, size 1

gradient overlay: normal, opacity 100 %, gradient #196ccb – #418cd5, style: linear, angle 90, scale 100%.

Rezultat vidimo na slici 4.

slika 4

slika 4

Ako smo zadovoljni rezultatom možemo svoj stil spremiti klikom na “new style” a zatim potvrditi na ok. Idući puta ovaj stil ćemo naći u dockeru “styles” i lako ćemo mu izmjeniti boju gradienta dok sve ostale postavke možemo koristiti iste.

Da bi sve bilo zanimljivije i efektnije možemo na kraju preko novog layera proliti diskretni pattern kao na slici 5 i dati mu blending option Linear burn za jače boje i kontrast. Ili ne 🙂

slika 5

slika 5

I to bi bilo to, dobru zabavu 🙂

Označeno s: , , , , ,
Za ovaj članak možete glasati na CroPortalu i tako pomoći u njegovoj promociji. Ako članak još nije objavljen vi možete biti prvi!
Stavovi i mišljenja izrečena u ovome članku i/ili komentarima odnose se samo na autora/icu članka i/ili komentara, a ne i cijele Kroativ mreže. Zabranjeno je neovlašteno prenošenje članaka u cjelosti bez prethodnog dogovora ili bez istaknutog povratnog linka na www.kroativ.net stranicu te imena autora.
Oglas

3 komentara

  • ad kaže:

    Hvala na tutorijalu, koristiti će.

    Inače, jedno pitanje nevezano uz temu. Zašto na početku svakog članka na naslovnici piše nešto kao “url_site = “http://www.kroativ.net/photoshop/photoshop-za-poetnike-efekt-stare-fotografije/”;

    Izgleda kao nešto što bi trebalo biti dio nekog javascripta (a nije).

    • Webmaster kaže:

      Hvala, evo problem je riješen. Ma problem je bio što je došla nova verzija WordPress-a koja je donijela par promjena, naš plug-in to nije znao 🙂

  • Muamer kaže:

    Dobar tutorijal 🙂

Trackbacks & Pingbacks

Ostavite komentar

Autori s više od 10 komentara nemaju tag nofollow na svojim linkovima! Zabranjeno je vrijeđanje, omalovažavanje ili na bilo koji drugi način ometanje normalnog toka komentara. Također je zabranjeno oglašavanje u komentarima i sve druge vrste spam-a.

(*) polja su obavezna

XHTML: Možete koristiti: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="">