Nová verze tohoto webu se nachází na www.tutorialy.com

homeforumTutorialy.com
 
Reklama
Clean webdesign
Clean webdesign
Clean webdesign
Tutoriál na klasický moderní web v uhlazeném stylu s kontrastem světlé na tmavém...
Autor: Filda | Kategorie: Photoshop > Webdesign | Zhlédnuto: 27586x |
Hodnocení: 1.9 | Komentáře (32) | Obtížnost: Uživatel | Vloženo: 04.1.2007

1. Nejdříve si vytvoříme pattern, který použijeme na pozadí našeho webu. Udělejte si nový dokument (ctrl+n) 18×18px, obraz si přibližte na 1600%. Vemte si plechovku (G) s barvou #566163 a vyplňte s ní pozadí obrázku. Přepněte na nástroj tužka, který se skrývá pod štětcem (B) a udělejte čáru od rohu k rohu (úhlopříčku) o barvě #5b6668.

2. Vzorek bychom měli, teď si vytvořte nový dokument (ctrl+n) 850×850px a pozadí vyplňte vzorkem, jenž jsme si vytvořili v bodě 1.

3. Vemte si nástroj zaoblený obdélník (U) Poloměr zaoblení nastavte na 4.

4. Nástrojem zaoblený obdélník, bílou bravou vytvořte základ pro web. Velikost záleží na Vás, ale není dobré dělat web příliš malý, nebo příliš velký…

5. Nyní kolem bílého obdélníku vytvoříme stín, což nám vytvoří vystupujcí efekt, který pomůže k oddělení obsahu od pozadí. Klikněte na vrstvu s obdélníkem pravým tlačítkem, zvolte volby prolnutí a postupujte podle obrázků…



6. Nyní si vemte nástroj Obdélník (U) a vytvořte si jako na obrázku obdélník o barvě #679fab.

7. Stiskněte alt+ctrl+G (vytvoření ořezové masky), obdélník se nám krásně ořízne podle spodní vrstvy, těla webu a vznikne nám header.

8. Klikněte pravým tlačítkem myši na vrstvu s headerem a zvolte volby prolnutí.

Měli bychom mít toto:

9. Tak teď se pustíme do úprav headeru. Vemte si nástroj štětec (B) a zvolte sadu brushů „Basic brushes“ (klasické kulaté štetce). Zvolte si štetec s vyhlazenýma okrajema velikost 182 bílou barvu.

10. Vytvořte si novou vrstvu (ctrl+N) a připraveným štětcem udělejte „fleky“ přes header jako na obrázku. Nevadí, že přesahují header, vrstvu v dalším kroku ořízneme.

11. Nyní vrstvu s „fleky“, jak už jsem v kroku č.10 načnul, ořízneme opět pomocí zkratky alt+ctrl+G a krytí vrstvy dáme na 60%

12. Nyní připíšeme název a slogan Vašeho webu. Použil jsem font Trebuched MS.

13. Nyní se pustíme do tvorby informační lišty. Nebudu to protahovat, vemte si nástroj obdélník (U) a vytvořte si půlku lišty o barvě #bacf87 a druhou půlku #b2c979 a opět to ořízněte podle těla webu (alt+ctrl+G) viz obrázek.

14. Vyrobíme si pravý sloupečk pro menu, novinky atd… Opět budeme potřebovat nástroj obdélník barvu #e1e1e1.

15. Vrstvu opět ořízneme, už nebudu popisovat jak na to.

A základ máme hotový, nyní už jen zbývá přidat texty a nějaké drobnosti.


psd zdroj


Hodnocení tutoriálu: 1.9 (hodnotilo 66 uživatelů)

Ohodnoťte tutoriál (jako ve škole):

Tutorialy.com © 2006 Marek Čapla & Filda | výměna odkazů | mapa webu | RSS zdroj | PageRank: 4 | ISSN 0322-9289

Online flash hry