Záhlaví webových stránek ve Photoshopu

• Duben 28, 2024

V tomto tutoriálu vytvoříme ve Photoshopu záhlaví webové stránky^R které budeme animovat ve Flashi^R Katalyzátor^TM. Animace začíná prázdným pozadím a návrhové prvky se zasouvají, aby „vytvořily“ záhlaví před našimi očima. Animace bude naprogramována tak, aby začala „při načítání“ a bude trvat jen několik sekund. Záhlaví tohoto webu bude určeno pro obchod s vážnými pohlednicemi.

Naším prvním krokem je vytvoření záhlaví ve Photoshopu. Každý návrhový prvek umístíme na svou vlastní vrstvu, aby jsme s nimi mohli pracovat v aplikaci Flash Catalyst. Jak vidíte, budeme mít 6 designových prvků.

1. Pozadí
2. Spodní lišta přes šířku záhlaví
3. Název společnosti
4. Přání k narozeninám
5. Dýňová Notecard
6. Vánoční přání

1. Začněme nový projekt ve Photoshopu. Nastavte šířku na 1000 pixelů, výšku na 225 pixelů a pozadí na průhlednou. Tato velikost se pěkně vejde do horní části naší webové stránky.
   
   
2. Jediným prvkem, který bude vidět na začátku animace, je bílé pozadí. Vyplňte první vrstvu obrázku barvou pozadí podle vašeho výběru. Na panelu Vrstvy přejmenujte tuto vrstvu „Pozadí“.
   
   
3. K vytvoření stínované hrany jsem použil styl vnitřní vrstvy stínu. Poklepejte na vrstvu pozadí a zaškrtněte políčko vedle Vnitřní stín. Nastavte vzdálenost a sytič na 0 a velikost na 49.
   
   
4. Dále přidáme tenké ohraničení kolem obrázku pomocí stylu vrstvy tahu. Nastavil jsem barvu na hnědou (# 6e674f), velikost na 2 a pozici na vnitřní.
   
   Dále přidáme karty. Zmenšil jsem velikost svých pohlednic na 230 x 175 pixelů. To je udrží v poměru k velikosti záhlaví.
   
   
5. Zkopírujte / vložte dýňovou kartu do naší hlavičky. Pojmenujte novou vrstvu „Dýně“. Chcete-li kartu mírně otočit doprava, klikněte na Upravit - transformace zdarma. Klikněte na vrstvu dýně a použijte styl vrstevnice stínů, ponechte výchozí nastavení.
   
   
6. Opakujte poslední krok pro narozeniny i vánoční přání.
   
   Dále přidáme lištu na konec záhlaví. Zastrčíme své karty za tuto lištu, abychom emulovali karty na polici.
   
   
7. Přidejte novou vrstvu na panel Vrstvy a pojmenujte ji „Bar“.
   
   
8. Pomocí nástroje Obdélníkové ohraničení vyberte spodní část záhlaví, přímo uvnitř hnědého okraje. Vyberte barvu pro svůj pruh a vyplňte výběr touto barvou.
   
   
9. Poklepejte na vrstvu a přidejte styl vrstvy tahu stejně jako do vrstvy pozadí.
   
   
10. Klikněte na nástroj Horizontální typ a vyberte písmo pro název firmy. Použil jsem stejnou hnědou barvu jako okrajovou barvu. Zadejte obchodní název na levé straně záhlaví.
    
    
11. Tento krok je volitelný. Text budeme rastrovat. Klepněte pravým tlačítkem myši na textovou vrstvu a v nabídce vyberte možnost Rastrový typ.
    
    
12. Uložte svůj projekt ve formátu Photoshop .psd.
    
    

Copyright 2018 Adobe Systems Incorporated. Všechna práva vyhrazena. Snímky obrazovky produktů Adobe přetištěné se souhlasem společnosti Adobe Systems Incorporated. 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 a Flash Paper je / jsou [a] registrovanou ochrannou známkou (značkami) nebo ochrannou známkou (značkami) společnosti Adobe Systems Incorporated ve Spojených státech a / nebo jiných zemích.

Video Návody: Záhlaví a zápatí stránky, členění do oddílů (Duben 2024).