Tytuł: Przycisk menu w stylu Maca Wiadomość wysłana przez: noss on 04.08.2007, 23:59:20 Przycisk menu w stylu Maca Tutorial Opracowanie: noss Poziom trudności: średni (http://www.gimpuj.info/gallery/21370_15_03_09_5_14_12.png) W tym tutorialu nauczysz się wykonywać ładny guzik, którym można ładnie przyozdobić stronę www. Tutorial napisany w wersji GIMP 2.6.4. W innych wersjach nazwy narzędzi i pojęć mogą się różnić. [lp] Zaczynamy [lp] 1. Tworzymy nowy obrazek (Plik -> Nowy... [Ctrl+N]) o dowolnych wymiarach i białym tle. (http://www.gimpuj.info/gallery/21370_15_03_09_5_32_20_0.png) [lp] 2. Następnie za pomocą narzędzia Zaznaczenie prostokątne <zaznaczenie-prostokatne> [R] utwórz zaznaczenie o wymiarach 150x30 px.. (http://www.gimpuj.info/gallery/21370_15_03_09_5_32_20_1.png) [lp] 3. Teraz wybierz Zaznaczenie -> Zaokrąglenie, i ustaw poniższe opcje. (http://www.gimpuj.info/gallery/21370_15_03_09_5_32_20_2.png) (http://www.gimpuj.info/gallery/21370_15_03_09_5_32_20_3.png) [lp] 4. Utwórz nową warstwę (Warstwa -> Nowa warstwa... [Shift+Ctrl+N]) i nazwij ją Owal. [lp] 5. Zaznaczenie na warstwie Owal za pomocą narzędzia Wypełnienie kubełkiem <wypelnienie> [Shift+B] wypełnij kolorem #000000. [lp] 6. Usuwamy zaznaczenie (Zaznaczenie -> Nic [Shift+Ctrl+A]). (http://www.gimpuj.info/gallery/21370_15_03_09_5_32_20_4.png) [lp] 7. Duplikujemy warstwę Owal (Warstwa -> Duplikuj warstwę <duplikowanie-warstwy> [Shift+Ctrl+D]) i zmieniamy nazwę duplikatu na Owal2 [lp] 8. Wyłączamy widoczność warstwy Owal klikając na ikonkę <widocznosc> przy jej miniaturce. [lp] 9. Na warstwie Owal2 stosujemy filtr: Filtry -> Rozmycie -> Rozmycie Gaussa... z ustawieniami, jak na obrazku niżej. (http://www.gimpuj.info/gallery/21370_15_03_09_6_16_04_0.png) (http://www.gimpuj.info/gallery/21370_15_03_09_6_16_04_1.png) [lp] 10. Na warstwie Owal wchodzimy w Warstwa -> Przezroczystość -> Kanał alfa na zaznaczenie i powracamy do warstwy Owal2. [lp] 11. Odwracamy zaznaczenie (Zaznaczenie -> Odwróć [Ctrl+I]) i czyścimy je (Edycja -> Wyczyść [Delete]). [lp] 12. Usuń zaznaczenie (Zaznaczenie -> Nic [Shift+Ctrl+A]). (http://www.gimpuj.info/gallery/21370_15_03_09_6_16_04_2.png) [lp] 13. Zaznaczamy opcję Blokowanie kanału alfa dla warstwy Owal2. [lp] 14. Teraz za pomocą narzędzia Powiększenie <zoom> [Z] powiększ obraz do 300%. [lp] 15. Następnie wybieramy narzędzie Gradient <gradient> [L] z wybranym gradientem Default i wypełniamy nim warstwę Owal2 tak, jak jest pokazane na screenie. (http://www.gimpuj.info/gallery/21370_15_03_09_6_16_04_3.png) (http://www.gimpuj.info/gallery/21370_15_03_09_6_16_04_4.png) [lp] 16. Duplikujemy warstwę Owal2 (Warstwa -> Duplikuj warstwę <duplikowanie-warstwy> [Shift+Ctrl+D]) i zmieniamy jej nazwę na Biały filtr. [lp] 17. Warstwę Biały filtr wypełniamy za pomocą narzędzia Wypełnienie kubełkiem <wypelnienie> [Shift+B] kolorem #ffffff. [lp] 18. Zmniejsz krycie warstwy Biały filtr na 50%. (http://www.gimpuj.info/gallery/21370_15_03_09_7_17_48_0.png) [lp] 19. Utwórz nową warstwę (Warstwa -> Nowa warstwa... [Shift+Ctrl+N]) i nazwij ją Oświetlenie. [lp] 20. Na warstwie Owal2 wejdź w Warstwa -> Przezroczystość -> Kanał alfa na zaznaczenie i powróć do warstwy Oświetlenie. [lp] 21. Na kolor pierwszoplanowy ustaw #ffffff. [lp] 22. Wybierz narzędzie Gradient <gradient> [L] i jako gradient ustaw: Kolor pierwszoplanowy na przezroczystość i przeciągamy nim od górnej krawędzi guzika do dolnej. (http://www.gimpuj.info/gallery/21370_15_03_09_7_17_48_1.png) [lp] 23. Z duplikuj warstwę Oświetlenie (Warstwa -> Duplikuj warstwę <duplikowanie-warstwy> [Shift+Ctrl+D]) (http://www.gimpuj.info/gallery/21370_15_03_09_7_17_48_2.png) [lp] 24. Utwórz nową warstwę (Warstwa -> Nowa warstwa... [Shift+Ctrl+N]) i nazwij ją Czarny obrys. Przesuń ją na samą górę. [lp] 25. Wypełniamy warstwę Czarny obrys za pomocą narzędzia Wypełnienie kubełkiem <wypelnienie> [Shift+B] kolorem #000000. [lp] 26. Zmniejsz zaznaczenie (Zaznaczenie -> Zmniejsz...) o 1 px i wyczyść je (Edycja -> Wyczyść [Delete]). (http://www.gimpuj.info/gallery/21370_15_03_09_7_23_41_0.png) [lp] 27. Utwórz nową warstwę (Warstwa -> Nowa warstwa... [Shift+Ctrl+N]) i nazwij ją Biały obrys. [lp] 28. Warstwę Biały obrys wypełnij za pomocą narzędzia Wypełnienie kubełkiem <wypelnienie> [Shift+B] kolorem #ffffff. [lp] 29. Zmniejsz zaznaczenie (Zaznaczenie -> Zmniejsz...) o 1 px, wyczyść (Edycja -> Wyczyść [Delete]) i usuń je (Zaznaczenie -> Nic [Shift+Ctrl+A]). [lp] 30. Zmieniamy tryb krycia warstwy Czarny obrys na Połączenie ziarna, a krycie na 50%. (http://www.gimpuj.info/gallery/21370_15_03_09_7_23_41_1.png) [lp] 31. Na warstwie Owal2 wejdź w Warstwa -> Przezroczytsość -> Kanał alfa na zaznaczenie. [lp] 32. Zmniejsz zaznaczenie (Zaznaczenie -> Zmniejsz...) o 1 px i odwróć (Zaznaczenie -> Odwróć [Ctrl+I]). [lp] 33. Na warstwie Owal2 wyczyść zaznaczenie (Edycja -> Wyczyść [Delete]) i usuń zaznaczenie (Zaznaczenie -> Nic [Shift+Ctrl+A]). (http://www.gimpuj.info/gallery/21370_15_03_09_7_23_41_2.png) [lp] 34. Teraz na warstwie Owal2 wejdź w Filtry -> Światło i cień -> Rzucanie cienia i ustaw poniższe opcje. (http://www.gimpuj.info/gallery/21370_15_03_09_7_23_41_3.png) (http://www.gimpuj.info/gallery/21370_15_03_09_7_23_41_4.png) [lp] 35. Wybierz narzędzie Tekst <tekst> [T], czcionkę Tahoma, rozmiar na 12 px i odznacz Wygładzanie. (http://www.gimpuj.info/gallery/4_17_07_10_8_32_58.png) [lp] Koniec Miłego GIMP-owania :). Tytuł: Odp: Przycisk menu Wiadomość wysłana przez: dzialo9 on 05.08.2007, 15:01:43 (http://www.gimpuj.info/replacement.png) Tytuł: Odp: Przycisk menu w stylu maca Wiadomość wysłana przez: Severius on 21.12.2007, 14:51:50 fajne
(http://www.gimpuj.info/replacement.png) Tytuł: Odp: Przycisk menu w stylu maca Wiadomość wysłana przez: gawrozek on 17.02.2008, 17:23:55 dzięki wielkie
(http://www.gimpuj.info/gallery/8521_17_02_08_4_22_49.jpg) (http://www.gimpuj.info/) Tytuł: Odp: Przycisk menu w stylu maca Wiadomość wysłana przez: Drobbek on 26.05.2008, 21:08:47 Jestem nowym użytkownikiem super tutek, świetne forum etc. :D Oto moja praca:
Tytuł: Odp: Przycisk menu w stylu maca Wiadomość wysłana przez: Yanke$ on 23.11.2008, 13:40:57 Fajny tutorial, tylko paru zdjęć nie widać (chyba).
Mój efekt. (http://www.gimpuj.info/gallery/17706_23_11_08_12_39_44.png) Tytuł: Odp: Przycisk menu w stylu maca Wiadomość wysłana przez: Qba_ on 21.02.2009, 10:07:20 Fajny efekt:
(http://www.gimpuj.info/replacement.png) Tytuł: Odp: Przycisk menu w stylu maca Wiadomość wysłana przez: Taos on 07.03.2009, 21:40:26 od pkt 30 zacząłem sie gubic :/
edit: Miło by było gdyby go dostosować do najnowszej wersji + obrazki krok po kroku jaki się otrzymuje efekt Tytuł: Odp: Przycisk menu w stylu Maca Wiadomość wysłana przez: Ranrwein on 20.07.2009, 10:58:49 Fajne, Przyda się Moje :)
(http://fotozrzut.pl/zdjecia/c6e72c8778.png) (http://fotozrzut.pl/) Tytuł: Odp: Przycisk menu w stylu Maca Wiadomość wysłana przez: Terrqge on 21.07.2009, 15:43:24 Fajny tutek, mały a cieszy :).
(http://www.gimpuj.info/replacement.png) Tytuł: Odp: Przycisk menu w stylu Maca Wiadomość wysłana przez: -LeWy- on 14.01.2010, 10:54:09 Ładny button. Co prawda nie jest on "przestrzenny", ale... jest schludny i prosty :P
Efekt mojej pracy: (http://images35.fotosik.pl/102/add27f4b878664d5.gif) (http://www.fotosik.pl) Tytuł: Odp: Przycisk menu w stylu Maca Wiadomość wysłana przez: Koli on 02.03.2010, 17:38:37 Na początek chciałbym wszystkich przywitać, więc Witam wszystkich ;) (Pierwszy post)
Jest to pierwsza moja praca w Gimpie więc wiem że nie jest dobra... i coś pewnie nie tak zrobiłem. Ale od czegoś trzeba zacząć. Tytuł: Odp: Przycisk menu w stylu Maca Wiadomość wysłana przez: noss on 18.04.2010, 20:05:36 Witaj noss, mam problem z Twoim poradnikiem "Przycisk menu w w stylu Maca". Mianowicie gdy chcę pomalować warstwę biały filtr na biało, to malują mi się takie paski, a nie cały obszar przycisku. Robiłem wszystko po kolei jak w poradniku. Próbowałem parę razy, ale ciągle tak samo. Co mam robić, malować tak pasek po pasku, czy coś robię źle? Pozdrawiam! W którym konkretnie punkcie Ci nie wychodzi? W oryginale wypełniałem za pomocą skrótu "CTRL + ," lub "CTRL + .", ewentualnie przeciągając myszką kolor z narzędziówki na warstwę lub zaznaczenie. Przy dostosowywaniu tutorialu do nowszej wersji Gimpa pewnie wkradł się błąd aby wypełniać kubełkiem, co w niektórych przypadkach daje różne efekty. Jeśli będziesz nadal zainteresowany, to przerobie tutorial i wprowadzę ewentualne poprawki. Tytuł: Odp: Przycisk menu w stylu Maca Wiadomość wysłana przez: Fuzion on 30.06.2010, 15:18:12 A to moje
(http://i48.tinypic.com/if5rnk.png) Tytuł: Odp: Przycisk menu w stylu Maca Wiadomość wysłana przez: Yomoto122 on 15.07.2010, 19:15:53 Trochę stary temat, ale.
O to mój efekt: (http://www.gimpuj.info/replacement.png) A co do tutka 10/10.Dobrze opisany i zrozumiały. Tytuł: Odp: Przycisk menu w stylu Maca Wiadomość wysłana przez: Igor96 on 21.10.2012, 13:15:48 Witam wszystkich, jestem nowy :) gdy zabrałem się za pisanie strony postanowiłem że jakieś buttony wykonam sam i jakoś przedzieram się przez tego Gimpa.
Fajny tut, ale jak wstawiam na stronę ten button to pojawia mi się razem z białym tłem, może mi ktoś powiedzieć jak to usunąć? Tytuł: Odp: Przycisk menu w stylu Maca Wiadomość wysłana przez: davlasq on 21.10.2012, 13:50:00 Albo zapisałeś go z białą warstwą tło, w takim przypadku musisz ją usunąć (chyba, że nie zapisałeś XCFa, wtedy po prostu usuwasz tło np. różdżką, było o tym wiele razy na forum). Albo zapisałeś obraz w jpg, który nie obsługuje przezroczystości, w takim razie musisz usunąć tło i zapisać w png.
Tytuł: Odp: Przycisk menu w stylu Maca Wiadomość wysłana przez: Igor96 on 21.10.2012, 14:53:29 Dzięki wielkie!
Tytuł: Odp: Przycisk menu w stylu Maca Wiadomość wysłana przez: piotr311 on 12.12.2012, 10:43:38 dzięki wielkie :) przyda się na pewno
|