Zaprojektuj błyszczący przycisk Web 2.0 w Photoshopie
Chcąc zaprojektować błyszczący przycisk Web 2.0? Oto prosty samouczek programu Photoshop, który krok po kroku pokazuje, jak uzyskać ładnie wyglądający czerwony przycisk błyszczący.
Krok 1 - Tworzenie bazy
Uruchom nowe płótno i dostosuj następujące ustawienia (zaznaczone na żółto) zgodnie z obrazkiem poniżej. Reszta powinna być domyślna. Możesz także sprawdzić dwukrotnie wartości domyślne.
Utwórz nowe wywołanie warstwy „Button”
Na warstwie „Przycisk” wybierz narzędzie Zaokrąglony prostokąt
Daj mu promień 7px
Narysuj prostokąt podobny do poniższego obrazu.
Krok 2 - Czerwony przycisk
Kliknij prawym przyciskiem myszy Opcje mieszania dla warstwy „Przycisk”
Dostosuj następujące ustawienia dla
Upuść cień
Wewnętrzny cień
Faza i płaskorzeźba
Nakładka gradientowa
Twój przycisk powinien wyglądać mniej więcej tak
Krok 3 - Utwórz błyszczący efekt
Utwórz nową warstwę, wywołując „Szkło”
Wybierz narzędzie Markiza prostokątna, upewnij się, że wybierasz warstwę „Przycisk”. Przytrzymaj klawisz Ctrl i kliknij przycisk „Warstwy””s miniatura warstwy. Twój przycisk powinien być teraz podświetlony.
Wybierz teraz przycisk „Szkło”, przytrzymaj klawisz Alt z wybranym narzędziem Zaznaczanie prostokątne. Narysuj (wytnij) na dolnej połowie przycisku, tak jak na poniższym obrazku.
Wypełnij wybrany obszar białym kolorem #ffffff za pomocą narzędzia Wiadro z farbą
Dostosuj krycie do 18%
Powinieneś mieć błyszczący przycisk wyglądający tak.
Krok 4 - Nakładka wzoru
Dajmy przyciskowi lekką nakładkę na wzór. Będę używał niestandardowego stripe5px utworzonego wcześniej. Utwórz nową warstwę „Wzorzec” pomiędzy „Przycisk” i „Szkło” i kontynuuj opcje mieszania.
Wybierz Nakładka wzoru, wybierz Stripe5px (lub dowolny utworzony wzór) i kliknij OK, a następnie zamknij okno dialogowe.
Upewnij się, że nadal jesteś na narzędziu prostokątnego namiotu, przytrzymaj
Krok 5 - Wstawianie tekstu
Wrzuć losowy tekst w kolorze białym #ffffff z następującymi ustawieniami
Użyj następujących efektów mieszania na warstwie mojego tekstu.
Upuść cień
Krok 6 - Wynik końcowy
Powinieneś otrzymać taki obrazek.