W tym samouczku zobaczycie jak szybko zrobić bardzo prosty szablon, który może posłużyć jako portfolio, np. dla fotografa. Projekt jest niesamowicie łatwy do realizacji - dlaczego ten? Bo pojawiły się prośby o jego "rozpisanie" (nie interesuje mnie, czy to było na poważnie, czy to była czysta ironia), a ja muszę powoli wrócić do formy pisania tutoriali.

Otwieramy dokument o dowolnej szerokości, ja ostatnimi czasy zazwyczaj pracuję na formacie 1200x1200px. Projekt, który opisuję ma akurat rozmiar 900x900, bo jest dość stary.

Kiedy utworzymy powierzchnię roboczą wybieramy gradient radialny (Radial Gradient). Kolory, które wykorzystałam w swoim projekcie to #001943 oraz #000212. Farbę/gradient rozlewamy w ten sposób, by jaśniejsza barwa była po środku. Należy również pamiętać, by na wykończeniach był stały kolor. Na wierzch dokoptowałam wzorek widoczny na obrazku, jego krycie ustawiając na "multiply".

Kolejnym krokiem jest dodanie - jak widać na projekcie - obrazu, który kojarzyłby się z naszą stroną (najlepiej, ale niekoniecznie), by dodać jej trochę artystycznego wyglądu. W związku z charakterystyczną kolorystyką zdecydowałam się na rybki (http://www.sxc.hu/photo/1214923). Usuwamy kolory z wybranego obrazu (Desturate - Ctrl + Shift + U), odpowiednio formatujemy, a krycie zmieniamy na "Color Dodge" 40%. Ja swój obraz delikatnie wygumkowałam po brzegach przy użyciu soft brusha 350px. Powinniście uzyskać coś takiego:

Możemy zdecydować się również na bardziej oklepaną wersję z drewnem (wzór powtarzalny można uzyskać wykorzystując ten obrazek: http://tzolkin.deviantart.com/art/Texture-Dusty-Wood-70928532). Po prostu tworzymy nowy dokument, wklejamy nasze drewienko, desturujemy, wchodzimy w Edit -> Define Pattern i zapisujemy. Następnie, w naszym już projekcie, tworzymy nową warstwę i przez Layer -> New Fill Layer wypełniamy nasze tło. Podobnie jak w przypadku zdjęcia wybieramy "Color Dodge", ale nie zmniejszamy krycia.

Następnie przy użyciu Rectangle Tool (chyba że ktoś woli zaokrąglenia, to po prostu Rounded Rectangle Tool z odpowiednim "Radius"), tworzymy kształty, na których następnie umieścimy naszą treść. Nie rzucamy prostokątów jakkolwiek - rozmieszczamy poszczególne pola z głową. Oczywistą oczywistością jest, że menu musi być stosunkowo wąskie, pole na treść główną (czyli np. teksty) powinno mieć dużą powierzchnię, a prostokąt po prawej (lub lewej - można zmienić "orientację" projektu), służący do prezentacji najnowszych/najlepszych prac musi pokazywać odpowiednio dużo, by zainteresować potencjalnego odbiorcę. Po prawej umieszczamy niewielkie kwadraty, które służyłyby do wyboru zdjęcia. Na nich umieszczamy cyfry (kropki, literki, miniatury innych zdjęć - co tylko podpowie nam wyobraźnia).

Menu

Użyłam tylko standardowych fontów. Nagłówki "O mnie", "Portfolio", etc. napisane zostały Century Gothic Bold, 12pt, z wygładzaniem Smooth. Mniejsze napisy - opisy szczegółowe - to również Century Gothic, ale już bez wygładzania i o rozmiarze 10pt.

Strzałki tworzymy używając Pencil Tool - powiększamy obraz do maksimum (1600%) i piksel po pikselu tworzymy kształt.

Tak robimy po kolei każdy z trójkątów, z tą różnicą, że używamy innych kolorów. Inaczej - można po prostu pierwszą warstwę zduplikować, a w Blending Options (Opcjach mieszania) nałożyć kolor - a tam mamy już pełną dowolność.

Kształty można zrobić większe, inne, ważne jednak, by były różnobarwne - w przypadku takiego szablonu, gdzie niewiele się dzieje i nie ma opcji wkomponowania dwóch-trzech barw wiodących, takie szczegóły ożywiają całość projektu.

Kropeczki, w przypadku mojego projektu, to po prostu kolejna warstwa tekstowa (verdana, 8-9pt, bez wygładzania), ale odwrócona o 90 stopni.

Treść

Tutaj istnieje pełna dowolność, nie ma raczej co zakopywać tego małego, biednego kwadracika tonami ściśniętego tekstu - lepiej wpisać mniej, by było czytelniej, ale i tu trzeba postępować z głową - nikt przecież nie chce nieprzyjemnej pustki! Do tego najlepszy font - dla mnie niepodważalnie pozostaje nim Tahoma albo Verdana.

Pamiętamy o stopce i o informacji CO-TO-ZA-STRONA (w przypadku opisywanego projektu widoczna po prawej na górze).

Finiszujemy z czymś takim:

Już niebawem tutorial na projekt http://siostranocy.deviantart.com/art/Wojewodztwa-template-115873901