GIMP - Prosty "Download button"

Materiały do pobrania:

Czionka Futura (w załączniku na końcu posta)

Informacje:

Poziom: Podstawowy, aczkolwiek wskazana podst. znajomość interfejsu

Wersja GIMP: 2.2 (stabilna)

[1] Tworzenie nowego obrazu

Utwórz nowy obraz o wygodnych rozmiarach np. 420 na 110 pikseli.

[2] Rysowanie tła guzika

Po stworzeniu nowej warstwy. Narysuj za pomocą zaznaczenia prostokątnego Zaznaczenie prostokątne

prostokąt o wymiarach 340 na 67 pikseli. Wypełnij go Wypełnienie kubełkiem

tym o to kolorem: 272727

[3] Górne paski

Utwórz nową warstwę. Na dole i u góry tym samym narzędziem co wcześniej narysuj paski takiej samej szerokości co czarny prostokąt, oba o wysokości 5px. Wypełnij je (narzędziem wypełnianie Wypełnienie kubełkiem

) tym kolorem: cbcbcb. Uwaga! Ta warstwa powinna znajdować się zawsze nad wszystkimi innymi!

[4] Szklany pasek

Znowu utwórz nową warstwę. Zaznacz połowę guzika na biało (można zostawić 1px z prawej i lewej) i wypełnij bielą oraz zmniejsz krycie warstwy na 10%.

[5] Czarne ukośne paski

Ponownie nowa warstwa tym razem przesuń ją też pod warstwę z białymi paskami i szkłem.
Wybierz wypełnianie a tryb ustaw na deseń, z dostępnej listy zaznacz "Warning!".
Musisz teraz wypełnić nim obszar taki sam jak czarny prostokąt (najlepiej w oknie warstw kliknąć na czarny prostokąt prawym przyciskiem myszy i wybrać "kanał alfa na zaznaczenie". Gdy to zrobisz narzędziem zaznaczanie według koloru z progiem na 130 zaznacz żółty kolor i go usuń (ctr+k, czy del zależnie od wersji bądź po prostu wybrać z menu"Edycja>Wyczyść"). Krycie ustaw zależnie od upodobań w zakresie od 10% do 20%.

[6] Cień pod paskami

Zastosuj kanał alfa na zaznaczenie na warstwie z białymi paskami i utwórz nową warstwę pod tymi że paskami. Następnie wypełnij zaznaczenie czernią. Następnie wybierz Filtry>Rozmywanie>Rozmycie Gaussa na 8x8.

[7] Światło

Nową warstwę umieść pod tą z cieniem dla pasków. Zaznaczeniem owalnym Zaznaczenie eliptyczne

zaznacz obszar taki jak na screenie, wypełnij go bielą i rozmyj rozmyciem Gaussa na jakieś 40. Następnie zmniejsz krycie do 20 procent bądź innej jakiej chcesz ale moim zdaniem powinna być ledwo widoczna. Musisz wybrać kanał alfa na zaznaczenie dla czarnego prostokąta a następnie odwrócić zaznaczenie (ctrl+i) i na warstwie ze światłem wyczyścić ("Edycja>Wyczyść").

[8] Napisy

Wykonamy teraz napisy. Narzędziem tekst Narzędzia tekstowe

czcionką Futura (ew. coś innego) napisz "DOWNLOAD" kolorem 0084ff oraz rozmiarem czcionki 22px, zaznacz też "wygładzanie". Następnie napisz "NOW!" kolorem ff9000.

[9] Dodatkowy cień

Można zduplikować czarny pasek i rozmyć go Gaussem na 8. I to by było w zasadzie wszystko chyba że...

Dodatkowy: [10] Rozmywanie napisu

Button powinien być interaktywny dlatego warto dodać poświatę dla napisy kiedy zostanie najechany, aby go wykonać zduplikuj warstwy z oboma napisami. Następnie połącz je (PPM i połącz w duł) i wybierz "Warstwa>Dopasuj wymiary warstwy do obrazu" . Pozostaje tylko lekko je rozmyć. I to jest już ewidentny koniec. Pamiętajcie by eksperymentować, powodzenia!

Witamy, Gość. Zaloguj się lub zarejestruj.Czy dotarł do Ciebie email aktywacyjny?

Witamy, Gość. Zaloguj się lub zarejestruj.
Czy dotarł do Ciebie email aktywacyjny?