Webhely fejléce a Photoshop-ban

• Április 26, 2024

Ebben az oktatóanyagban egy weboldal fejlécét készítjük a Photoshopban^R amelyet animálunk Flash-ben^R Katalizátor^TM. Az animáció egy üres háttérrel kezdődik, és a tervezési elemek becsúsznak, hogy szemünk előtt "építsék" a fejlécet. Az animációt úgy kell beprogramozni, hogy "terheléssel" kezdődjön, és csak néhány másodpercig tart. Ez a weboldal fejléce egy ügyes üdvözlőkártya-vállalkozás számára lesz.

Első lépésünk a fejléc felépítése a Photoshop programba. Mindegyik tervezőelemet a saját rétegére tesszük, hogy felkészülhessünk velük a Flash Catalyst alkalmazásra. Mint láthatja, 6 design elem lesz.

1.Háttér
2. Alsó sáv a fejléc szélessége mentén
3. Cég neve
4. Születésnapi kártya
5. Pumpkin Notecard
6. Karácsonyi kártya

1. Indítsunk el egy új projektet a Photoshopban. Állítsa a szélességet 1000 pixelre, a magasságot 225 pixelre, a hátteret pedig átlátszóra. Ez a méret szépen illeszkedik weboldalunk tetejére.
   
   
2. Az egyetlen elem, amely az animáció elején látható lesz, a fehér háttér. Töltse fel a kép első rétegét a választott háttér színével. A Rétegek panelen nevezze át ezt a réteget "Háttér" -re.
   
   
3. Az árnyékolt él létrehozásához a Belső árnyékréteg stílust használtam. Kattintson duplán a Háttér rétegre, és jelölje be a Belső árnyék melletti négyzetet. Állítsa a távolságot és a fojtót 0-ra és a méretet 49-re.
   
   
4. Ezután hozzáadjuk a kép köré vékony szegélyt a Stroke Layer Style-nal. A színt barnara (# 6e674f) állítottam, a méretet 2-re és a belső pozíciót.
   
   Ezután hozzáadjuk a kártyákat. Az üdvözlőlapok méretét 230 x 175 képpontra csökkentem. Ez arányban tartja őket a fejléc méretével.
   
   
5. Másolja / illessze be a Pumpkin kártyát a fejlécünkbe. Nevezze az új réteget "Pumpkin" -nek. Kattintson a Szerkesztés - Ingyenes transzformáció elemre a kártya kissé jobbra forgatásához. Kattintson a Pumpkin rétegre, és alkalmazza az árnyékréteg esés stílusát, megtartva az alapértelmezett beállításokat.
   
   
6. Ismételje meg az utolsó lépést mind a születésnapi, mind a karácsonyi kártya esetében.
   
   Ezután hozzáadjuk a fejléc alján található sávot. Kártyáinkat e sáv mögé rakjuk, hogy a polcon lévő kártyákat emuláljuk.
   
   
7. Adjon hozzá egy új réteget a Rétegek panelen, és nevezze el "Sáv" -nak.
   
   
8. A Téglalap alakú sáv eszközzel válassza ki a fejléc alsó részét, csak a barna szegély belsejében. Válasszon színt a sávnak, és töltse ki a választást ezzel a színnel.
   
   
9. Kattintson duplán a rétegre, és adja hozzá a Stroke Layer Style-t, ahogy a háttérréteghez.
   
   
10. Kattintson a Vízszintes típus eszközre, és válasszon betűtípust a vállalkozás nevéhez. Ugyanazt a barna színt használtam, mint a szegélyt. Írja be a vállalkozás nevét a fejléc bal oldalára.
    
    
11. Ez a lépés nem kötelező. Raszteresítjük a szöveget. Kattintson a jobb gombbal a szövegrétegre, és válassza a menüben a Rasterize Type menüpontot.
    
    
12. Mentse el a projektet Photoshop .psd formátumban.
    
    

Szerzői jog 2018 Adobe Systems Incorporated. Minden jog fenntartva. Az Adobe termék képernyőképe (i) újra kinyomtatva az Adobe Systems Incorporated engedélyével. Adobe, Photoshop, Photoshop Album, Photoshop Elements, Illustrator, InDesign, GoLive, Acrobat, Cue, Premiere Pro, Premiere Elements, Bridge, After Effects, InCopy, Dreamweaver, Flash, ActionScript, Fireworks, Contribute, Captivate, Flash Catalyst és Flash Paper vagy bejegyzett védjegy (ek) vagy az Adobe Systems Incorporated védjegye (i) az Egyesült Államokban és / vagy más országokban.

Video Utasításokat: fejléc alap készítése (Április 2024).