Menu
- Aktualności
- Mój startup Nowy odcinek
- Blogi ekspertów
- Projektowanie WWW
- Planowanie
- Hosting i domeny
- Organizacja i nawigacja
- Webdesign i grafika
- Warsztat - programy
- Tutoriale Photoshop
- Programowanie i tworzenie
- XHTML, HTML i CSS
- JavaScript, DOM i AJAX
- jQuery
- PHP i SQL
- Flash i ActionScript
- Dostępność i WAI
- Promowanie stron
- Pozycjonowanie
- Reklama i marketing
- Monitoring i statystyki
- Publicystyka
- Artykuły ogólne
- Społeczności
- Praca i zarabianie
- Wywiady
- Standardy sieciowe
- Zasoby
- Kursy
- Recenzje książek
- Linki
Dla webmastera
Metalowe menu ze szkłem
Autor: Łukasz Pabian, dodano: 12-08-2009
Kategoria: Projektowanie WWW
Tutorial pozwoli Ci uzyskać taki efekt:

Za pomocą kształtów formujemy prostokąt z zaokrąglonymi rogami - wybieramy Rounded Rectangle Tool [U] i ustawiamy radiu na 3px. ustawiamy kolor narzędzia na RGB:[52,131,0] a kolor tła na RGB:[116,243,30]


Klikamy prawym przyciskiem myszy na warstwę z przyciskiem i wybieramy Blending Options. Przechodzimy do sekcji Gradient Overlay, wybieramy z gradientów kolory, które przed chwilą wybraliśmy, zaznaczamy Reverse oraz ustawiamy Scale na 120%

Teraz przechodzimy do sekcji Bevel and Emboss i zmieniamy Depth na 1000%, Size na 6px, Soften na 3px, kąty zostawiamy bez zmian, jedynie zmieniamy Hilight mode na Linear Dodge oraz Opacity odbicia ustawiamy na 87%, a Opacity cienia ustawiamy na 0%

Za pomocą kształtów formujemy prostokąt z zaokrąglonymi rogami - wybieramy Rounded Rectangle Tool [U] i ustawiamy radiu na 3px. ustawiamy kolor narzędzia na RGB:[120,120,120] a kolor tła na RGB:[199,199,199]. Klikamy prawym przyciskiem myszy na warstwę i wybieramy Rasterize Layer.
Klikamy lewym przyciskiem myszy razem z Ctrl na warstwę zieloną i wycinamy z szarej warstwy powstałe zaznaczenie - [Ctrl + X]. Klikamy prawym przyciskiem myszy na warstwę z przyciskiem i wybieramy Blending Options. Przechodzimy do sekcji Gradient Overlay, wybieramy z gradientów kolory, które przed chwilą wybraliśmy - szare, ustawiamy Angle na 92 stopnie.
W sekcji Bevel and Emboss zmieniamy Depth na 1000%, Size na 1px, Soften na 2px, Angle zmieniamy na 113 stopni, Altitude na 45 stopni, jedynie zmieniamy Hilight mode na Color Dodge oraz Opacity odbicia ustawiamy na 100%, a Opacity cienia ustawiamy na 45%.

Z prawej strony tworzymy zaznaczenie z okręgu o średnicy równej wysokości szarego prostokąta. Odwracamy zaznaczenie [Ctrl+shift+I] i gumką usuwamy prawą strone okręgu.
Komentarze:
- Artykuł
Dodał: Robo data: 2009-08-23Bardzo pomocny i przydatny tutek, dzięki :) - Braki
Dodał: Gość data: 2009-12-01Tutorial źle napisany - brak w nim paru podpunktów do wykonania. Postępując zgodnie z opisem, nigdy nie osiągnie się efektów jak na przykładowych obrazkach.
Najlepiej TYLKO przejrzeć opis ćwiczenia, i ściągnąć pliczek przykładowy - dopiero on zawiera wszystkie ustawienia, i na nim najlepiej się wzorować. - Krytyka
Dodał: Gość data: 2010-01-07Całkowicie zgadzam się z przedmówcą. Materiał napisany na odczepnego aby zapełnić wortal.
Dodał: Gość data: 2010-06-18uwazam podobnie, dla kogos kto slabo zna angielski i dopiero zaczyna zabawe z ps ten tutorial jest nieprzydatny.
Dodał: Gość data: 2010-09-02Wszytko fajnie tylko w opisie jak "wyciąć" zieloną warstwę z szarej czegoś brakuje, a przykład w psd nie działa :/- cs5
Dodał: Gość data: 2011-08-10działa działa, kreatywni nawet nie muszą nad tym myśleć za dużo ...

