23 października 2013

706: Zrób to sam: Kursor z elementu obrazka


W dzisiejszym tutorialu przybliżę zagadnienie tworzenia kursora z fragmentu wybranego przez siebie obrazka.
Posłużę się artem UnidColor z deviantArtu, całość napisana jest zaś pod korzystanie z GIMPa.


  1. Zaczynamy od otworzenia obrazka, skopiowanie warstwy tła i wklejenie jej jako nowa warstwa. (Edycja → Wklej jako → Nowa warstwa, nie zaś za pomocą opcji „duplikuj warstwę”.) Po powieleniu – kasujemy warstwę tła. 


  2. Teraz narzędziem kadrowania (bądź za pomocą zaznaczenia i komendy „kadruj według zaznaczenia”) wyznaczamy ten fragment obrazka, który naprawdę nas interesuje.


  3. Przy pomocy narzędzi inteligentnego zaznaczania oraz nożyczek (opis tychże znajduje się tutaj) usuwamy zbędne tło. Jeśli zawodzą narzędzia zaznaczania – pomagamy sobie ścieżkami (druga część tutorialu do GIMPa) oraz gumką. 


  4. Po usunięciu koloru usuwamy również resztę pozostałych „zanieczyszczeń”. Pomóc w tym może stworzenie warstwy wypełnionej czernią i podłożenie je pod właściwą warstwę z obrazkiem na którym pracujemy. Całość nie musi być idealnie równa – po zmniejszeniu nie widać defektów aż tak bardzo.


  5. Nadchodzi czas na zmniejszenie naszego kursora do pożądanego rozmiaru – w tym celu wybieramy opcję Obraz → Skaluj obraz.


  6. Zmniejszony? Tworzymy nową warstwę, w prawym górnym rogu zaznaczamy sam narożnik i wypełniamy go takim kolorem, jaki ma mieć nasza „strzałka”. Teraz dowolnie zmniejszamy krycie warstwy.


  7. To już prawie koniec – usuwamy pomocniczą czarną warstwę, a następnie przy pomocy Obraz → Połącz widoczne warstwy (przycięta do obrazu) sklejamy obrazek w całość. 

  8. Możemy też pobawić się poziomami, koloryzacją, czy kontrastem – jednak to już wedle własnego uznania.

  9. Obrazek zapisujemy w formacie .png. Teraz wystarczy zalinkować go w jakimś serwisie hostingowym (na przykład imageshack, tinypic, czy imgur).

  10. Uzyskany link podstawiamy do kodu: cursor: url("adres obrazka"), url("adres obrazka"), auto; i wklejamy na końcu każdego z okienek z kodem smoczej ramki.

Gotowe!
Klikając w obrazek - powiększacie go sobie.
Gdyby ktoś chciał zajrzeć do reszty moich gimpowych poradników, to mamy tu przepis na znak wodny, forumową sygnaturę, a także pierwszą i drugą część opisu narzędziówki programu.

Zobacz też:


Smocza pani

Brak komentarzy:

Prześlij komentarz

Twój komentarz będzie widoczny po akceptacji administratorki gazetki.