A következőkben elárulom, és részletesen bemutatom, hogyan kell készíteni grunge témájú websablont. Elősször is néhány stock textúrára lesz szükségünk.   Megmutatom,  hogyan kell elkészítened a fejécet, menüsort, a szövegmezőt.  Majd később felhasználahtod, akár html, vagy valamilyen blog alapú weboldal motorral.



A végeredmény, egy kis kedvcsinálónak, kb ilyen lesz ha kész lesz, jó ha egy kis kreativitást viszel bele, nem kell feltétlenül így kinéznie, kísérletezz a rétegek elhelyezésével. Megszámlálhatatlan módon tudod elhelyezni, de mégis jól mutat!

Psd file letöltése

1. Lépés

A következőkben, egy teljes grunge weboldal sablont fogunk felépíteni, ezért egy  stock képre is lesz szükségünk, ami a fejléc alapját képezi. Itt találod az álltalam használt hozzávalókat.

Elősször is készítsünk egy új dokumentumot 950*800px felbontásban RGB színmódban, 72dpi-vel. Majd  show rulers(vonalzó mutatása), és mind a négy sarokba húzunk egy vonalat, ez a későbbiekben nagyon hasznos lesz.

Azután Image > Canvas Size növeljük meg a dokumentum méretét 1200 px * 1000 px -re. Ezután pedig beállítjuk a segédvonalakat, a fejlécnek, menüsornak, és a láblécnek.

2. Lépés

A szövegbox, és a fejléc rétegeket létrehozzuk, külön rétegen #4d2702 színnel a Rectangle Tool használatával. A segédvonalaknak itt van szerepe, ezzel körülbelül el tudod helyezni, hogy milyen magas legyen a boxok mérete. Ne aggódj, ez nem piros, de majd az lesz, az alábbi rétegbeállításokkal amit a szövegbox, és a fejléc réteg is kap. A layer tools segítségével, amit a layeren történő dupla kattintással hívhatunk elő. A Gradient Overlay, és a Pattern Overlay beállításait válltoztatjuk(ezt megtalálod alul a képen).

3. Lépés

A Fejléc réteg felett létrehozunk egy újabb réteged, ide kerül a stock fotó(én egy fém felszínt választottam te választhatsz mást is). A lényeg hogy ezt a réteget  Color Dodge módba állítot, majd a felesleges részeket, ami kilóg a fejléc réteg alól azt levágod.

Jöhet a kreatív része most kell elhelyezned a foltokat, és az íveket.

Virágok elhelyezése:

A  Set_2_Hand_Drawn_Floral_Sample.abr filet fel kell venned az ecsetek közé, de a vectoros file-al is dolgozhatsz. Három réteget készítünk, a virag reteg1: fehér virágokkal, hard light réteg beállítással. A virag reteg2 70% opacity-vel. A virag reteg3 pedig piros színben.

Foltok elhelyezése:

A foltok mindegyike külön rétegen van, hiszen így külön egyszerűbb gyorsan beállítanunk a pontos helyét. CTRL+T billentyű kombinációval. Csak a bal felső sarokban található folt rétegbeállítását változtattam color overlay-re.

Betűk elhelyezése:

A betűk is külön rétegekre kerülnek, itt is  a gyors mozgatás, és forgatás végett. Ez a betűtípus nem tartalmaz ékezetet, de nagyon gyorsan gyárthatunk hozzá.



Ezzel készen is van első grunge layoutunk, amit ízlés szerint formálhatsz. A végén pedig a slice tool segítségével feldarabolhatod.