Tutorials-jak na layouty v ps

10. března 2011 v 15:48 | Alice-Palice |  Návody
Dávám vám sem několik návodů jak na layout v photoshopu.Klik na celý článek..

Nejdřív dejte ve photoshopu Nový.
Doporučený rozměr 1300x900.
Pak si zvolit barvu pozadí.
Potom použijte
a klikněte na bílou plochu.
Teď by to mělo vypadat nějak takhle:
Znovu si zvolte barvu nejlépe podobnou té první, klikněte na
a zvolte část plochy kterou budete chtít jako stránku.
Můžete to mít stejné jako na obrázku výše, ale můžete to mít i trochu lepší. 2 krát klikněte na vrstvu stránky. Měla by se vám objevit tahle tabulka
Tak na tabulce zaškrtněte Vržený stín.
Jak to stím stínem chcete mít si můžete sami nastavit. Další úprava je když zaškrtnete Úkol a reliéf.
Dále zase použijte
a vyznačte na stránce místo kde chcete mít menu.
Dál potřebujete obrázky. Teď máte 2 možnosti.
1.Vyznačit si na stránce (někde nahoře) záhlaví.
A do vybraného místa dávat obrázky.
2.Zkraďte stránku ať je dlouhá asi jako menu.

zkrátit se dá
A dávat obrázky vlastně na pozadí.
Zdroj:http://animegraphic.blog.cz/rubrika/tutorialy

Návod na layout
Nejdřív si otevřu photoshop a vytvořím nový dokument- záhlaví, udám rozměry, např šířka 800 a výška 600 pixelů, pozadí bílé. (rozměry můžete mít vlastní)

Potom si vyberu libovolné obrázky do záhlaví.
Vybrané obrázky uložím do PC a ve photoshopu otevřu, a nebo stačí na obrázek pravým tlačítkem myši klinout, kopírovat, a ve photoshopu úpravy- vložit.
Takhle to uděláme se všemi obrázky, které chceme mít v záhlaví.
Když jsou obrázky moc velké, dáme úpravy- trnsformovat- změnit velikost. Pokud chceme zachovat poměr stran, při zmenšování držíme shift a u toho myší zmenšujeme do potřebné velikosti.
Obrázky samozřejmě vkládáme do toho dokumentu, co jsme si na začátku vytvořili.
Takže teď by to mělo vypadat asi takhle:
Teď by to chtělo obrázky nějak prolnout, aby nebylo vidět, kde jeden končí a druhý začíná.
Takže kousek obrázku , který je ve vrchní vrstvě ogumujeme gumou o střední velikostí, tvrdost 0.
Když už se nám zdá, ze přechod mezi obrázky nevypadá tak tvrdě, vrstvy sloučíme- vrstva- sloučit viditelné. Vše teď máme v jedné vrstvě.
Vypadat by to mělo asi takhle.
Podíváme se na internet a nejseme si nějakou šikovnou texturu, co by se tam hodila.
Když jsme ji našli, zase klikneme pravým, kopírovat, a ve photoshopu vložit. Pokud je malá, a nepokryje celý dokument, jednoduše ji zvětšíme- úpravy- trnsformovat- změnit velikost.
Ale jak vidíme, máme zakrytý celý dokument, a nejsou jiné obrázky vidět, takže zkusíme prolnutí- je to u vrstvy- jak je tam to 100 procent a nahoře normální, tak zkusíme třeba překrýt nebo měkké světlo.
Asi takle to teď vypadá:
a znovu dáme vrstva- sloučit viditelné.
A deď si vytvoříme nový dokument, výška musí být, ať se dějě co se dějě 768 pix, a šířka stejná jako v záhlaví- takže to máme 800 pixelů.Na vrch si vybereme v panelu nástrojů nějakou barvu, která se hodí barevně k záhlaví, můžeme použít i kapátko.
deďsi to označíme- kousek od okraje- asi takhle:
Pak vezmeme nástroj pero ( mělo by to být blízko toho T ) a klikneme do levého horního rohu výběru, pak do pravého, a pravého dolního, a vidíme, že se nám tam objevil takový trojůhelník, v naší vybrané barvě. Klikneme do levého dolního, a máme celý výber zabarvený:
Teď si můžeme vzít výběr a kliknout někam vedle, aby nám výběr zmizel a nepřekážel. Vezmeme znova pero a na horní straně barevného čverce klikneme, na libovloném místě a táhneme, vidíme, že se to začíná vlnit. Až to bude zvlněné, jak chceme, tak to pustíme.Přejdeme dolů, a tam uděláme to samé. Teď to vypadá asi takhle.
Teď bychom to měli rastrovat, takže klikneme pravým na vrstvu- v modrém okénku- a dáme rastrovat..Měli bychom to také roztáhnou, aby to opravdu bylo široké těch 800 pixelů- pozor- teďjenom do šířky.
Měli bychom to taky upravit, nějak ozdobit. Takže teď můžeme dát- vstva- a třeba vnitřní záře, vržený stín,....Po použití efektů to vypadá asi takhle:
Abychom neměli stránku jen tak prázdnou, bez testury, můžeme si najít někde pozadí na blog- nějaké proužkované, třeba tohle:
A dáme zase kopírovat, a vložit ve photoshopu.
Je to nová vrstva, ale my to nechcem fialové, takže dám obraz- přizpůsobení- odbarvit, protože mi to nazakryje celý obrátek, zase to roztáhnu.Ale hle, zas je to celé překryté, takže zkusím dát volby vrstvy, překrýt, nebo měkké světlo, vypadá to takhle:
Ale víme, že to zasahuje přes celý dokument, a ne jen přes to barevné, překlikneme si na na tu barevnou vrstvu, potom vezmeme násroj kouzelná hůlka, a klikneme na tu horní bílou část tý vrsvy, pak držíme shift a klineme dolů, máme označené ty 2 bílé části, překliknu na tu vrstvu s pruhovaným vzorkem a ztisku delete- pruhovaná vrstva se nám dotvarovala do stejného tvaru jako je ta barevná. Teď dám vrstva- sloučit viditelné, a vše mám v jedné vrsvě.Teď si vytvoříme dokument, velikost šířka stejná, takže 800 pixelů a výška 768 pix, ale pozor, pozadí pruhledné,
překlikneme do toho původního dokumentu, a přetáhneme to na ten průhledný, který jsme si teď vytvořili. Přetahujeme to nástrojem transformace, je to taková malá černá šipka s křížkem, je nahoře v panelu nástrojů.Srovnáme, aby to pasovalo.
Překlikneme na novou, barevnou vrstvu, potom vezmeme násroj kouzelná hůlka, a klikneme na tu horní bílou část tý vrstvy, pak držíme shift a klineme dolů, máme označené zas ty 2 bílé části. Pak dáme delete. Odmazaly se bílé části a máme to jen průhledné, zase vrstva- sloučit viditelné., tím jsem si ulehčili práci, museli bychom to samé stejně dělat o něco pozdělji. Teď vypadá takhle:
A teď menu. Řekněmě, že cheme mít menu třeba široké 160 pixelů. Ale jak to odměřit? Jednoduše. Uděláme nový dokument, výška 768, šířka 160 pixelů. Vyplníme ho nějakou kontrastní barvou, abychom to dobře viděli, a pak to přetáhneme na náš obrázek, vypadá to takhle:
Uděláme novou vrstvu. a teď uděláme čáru, vezmem nástro jiný tvar, je to pod tím T, a vezmu tvar přímka, je to nahoře, to poznáte, a široká bude asi 5 ob - to si můžete nastavit nahoře, a uděláme čáru směrem - no prostě svisle, u toho držíme shift, aby byla rovná. Pak klineme na tu vrstvu ve vrstevníku pravým a dáme rastrovat. dvakrát rychle klikneme levým ve vrstevníku, a můžeme dát překrýt barvou, vybereme barvu, aby ladila ke stránce, a taky třeba úkos a reliéf,...A teď posuneme vrstvu tlačítkem tranformace, ta černá šipečka s křížkem, nahoře v panelu nástrojů, pak na klávesnici mačkám šipku, až to bude úplně u toho pomocného obdelníku, nesmí být mezi tou čárou a dělícím obdelníkem žádná mezera:
Vysledek je takový. teď překlikneme na vrstvu s pomocným obdelníkem a odstraníme ji.
Překlikneme na vrstvu s čárou a můžeme dole kousek ugumovat, a nahoře taky:
Zase dáme vrstva- sloučit viditelné. Teď si označíme kus obrázku- celá šířka, kousek od hora:
Dáme upravy- kopírovat, a překlikneme si do dokumnetu, na to záhlaví, proto to záhlaví nesmíte pak zavřít, a dáme vložit. To překlikávání, nahoře jak máte napsáno okna, tak klikněte okna- uspořádat- kaskáda.Vidíte okna, a v jednom je ten obrázek na záhlaví tak na něj nklikněte, zvetšte si ho na obrazovku a dejte vložit.Objeví se tam ten kus toho zvlněnýho, posuňte to až dolů,:
Duplikujte vrsvu- to pozadí, a přesuňte to nad to zvlněné, tím se to sice překryje, ale my dáme prolnutí- třeba mekké světlo, nebo překrýt, a vezmeme gumu a kousek od spoda odgumujeme., chceme jen, aby nějak pěkně byl překrytý kus toho zvlněného, tak také ogumujeme zbytek duplikované vrstvy nahoře, který nezashahuje na to zvlněné.
Teď klikneme na to T v panelu nástrojů, a uděláme text. Můžem dát nadpis Menu, Stránka, nebo do obrázku vepsat název blogu,....., pokud bude text obsahovat háčky, musí font podporovat češtinu.Taky múžeme pak udělat ještě další vrstvu, a použít nějaké brushe, (odkazy, kde je stahovat najdete na mém blogu) tak aby to moc nezasahovalo do textu. Když už jsme spokojeni, dáme vrstva- sloučit viditelné, a vše máme v jedné vrstvě. Náš výsledek by měl vypadat asi takhle: pak to uložíme- Soubor- uložit pro web, formát jpg, kvalita- podle velikosti, jelkož blog.cz povolil už hranici do 400 KB, musí obrázek mít velikost do 400 kb.
Překlineme si do druhého dokumentu, opět, nahoře máte okna, na to klinete, takže-okna-uspořádat-kaskáda, vrchní okno můžete odsunout a zvětšte si to druhé, kde máte tu stránku, na tom pruhledným pozadí,měli byste tam mít ještě označený ten kus, co jste překopírovali do záhlaví, vemte si výběr, a označte, berte to jako, tam kde je spodní čát původního výběru, začíná vrchní část nového výběru. Označte asi takhle,
udělejte nový dokument, ale až po tom, co to zkopírujete, a dejte vložit. U dokumentu rozměry neměňte, má to automaticky velikost a rozměry toho, co jste vybrali a zkopírovali, pozadí už může být bílé a dejte v tom novém dokumetu úpravy- vložit, a rovnou to uložte - takže to je uložit pro web, formát jpg,a uložte do stejné složky, jako máte záhlaví, abyste to poak snadno našli. Po uložení to můžete zavřít. A teď zápatí. Máte zase maximalizovaný dokument s tou stránkou, z kterého jste teď kopírovali. Opět tam , kde jeden výběr končí, bude začínat druhý, teď to označte až na konec stránky, takto:
dejte úpravy- kopírovat, udělějte nový dokument, rozměry nechte, a dejte vložit.Teď tam máte něco takového:
No a nyní, abychom to nenechali prázdné, můžeme si třeba otevřít obrázek jpg, kde je to záhlaví, najdete tu složku, a otevřete to, můžete tam kousek z toho záhlaví označit, asi nejspíš tam, kde nejsou žádné hlavy, a postavy, dejte kopírovat, překlikněte si do toho dokumentu se záhlavím a dejte vložit. Ta vrstva, ta barevná s tím zvlněným okrajem je nad bílým pozadím, pokud chcete, aby ta nová vrstva zkopírovaná ze záhlaví nepřekrývala tu zvlněnou, překlikněte na vrstvu zvanou pozadí, udělějte novou vrstvu a tam dejte vložit, nebo jestli chcete, aby zvlněná vrstva byla překrytá,, dejte tu novou vrstvu až nad ní.. Můžeme přidat brushe, nějaké prolnutí, , a hlavně podpis autora designu., Když jsme spokojeni, můžeme sloučit vrstvy- vrstva- sloučit viditelné. Náš výsledek může vypadat třeba takhle:
zdroj:http://day-dreamer.blog.cz/0808/jak-vyrobit-a-nastavit-blogovy-layout
V adobe photoshop:
zdroj:http://layfor.blog.cz/0906/rozsahly-tutorial-jak-vytvorit-jednoduchy-layout-v-adobe-photoshop



 

Buď první, kdo ohodnotí tento článek.

Komentáře

1 Tery Tery | Web | 11. března 2011 v 13:43 | Reagovat

Ahoj chci se zeptat co chceš být? Elite,Top nebo Normal? No víš děláme si přehled v affs.

2 ♥Kulča♥ your Aff ♥Kulča♥ your Aff | Web | 11. března 2011 v 21:40 | Reagovat

Dneska, už chci jít z pc, ale zítra tento návod -pokusím se ho vyzkoušet ;-)

3 Lila Lila | E-mail | Web | 24. května 2013 v 14:25 | Reagovat

Ten návod mi veľmi pomohol :-D

Nový komentář

Přihlásit se
  Ještě nemáte vlastní web? Můžete si jej zdarma založit na Blog.cz.
 

Aktuální články

Reklama