Forum graficzne Burning-Brushes.pl

Tutoriale graficzne i materialy => Pozostałe tutoriale => Wątek zaczęty przez: Eldi w Luty 15, 2011, 11:38:16

Tytuł: Ozdobne napisy bez wykorzystania programów graficznych
Wiadomość wysłana przez: Eldi w Luty 15, 2011, 11:38:16
Obiecać obiecałam, więc wiadomo, obietnicy trzeba dotrzymać. Jak to starożytni mawiali, pacta sunt servanda, czyli umów należy dotrzymywać, a umowa to nic innego jak obietnica wykonania pewnego świadczenia. A świadczenie.. ups, zagalopowałam się, celem tego tutoriala nie jest przybliżanie prawa rzymskiego, ale coś całkiem innego.

W tym tutorialu przedstawię dwa sposoby wykonywania napisów. Przy czym warto zaznaczyć, że nie potrzeba do tego żadnych programów! Żeby nie było niespodzianki, od razu pokazuję, jakie mniej więcej mają być efekty:
I metoda: (https://burning-brushes.pl/proxy.php?request=http%3A%2F%2Fimg.burning-brushes.pl%2Fimages%2F129775sxs.gif&hash=0bd02c7ca3042ebe231d5c6399f4f3f697e8c1cb)
II metoda: (https://burning-brushes.pl/proxy.php?request=http%3A%2F%2Fimg.burning-brushes.pl%2Fimages%2Fcooltext50.gif&hash=e7b1fd7f5b81595c39cb32c2f7f4d407b9beb7a1)

I
0. Najpierw szukamy tzw glittera, którym chcemy pokryć napis, a co za tym idzie- osiągnąć dany efekt. Żeby go znaleźć, przeważnie starczy wklepać w google frazę "glitterowe tła". Niestety, takie rzeczy znajduje się na "sweetaśnych blogaskach", więc wskazane jest zabezpieczenie mózgu, by się nie stopił od nadmiaru "sweetaśności"^^
Znalazłam trochę na chomiku, całkiem przyzwoite:
http://chomikuj.pl/jagoda44/T*c5*81A+GLITTEROWE, przy czym tu bym ominęła raczej pliki o nazwie 566.jpg, anigif(1).gif
http://chomikuj.pl/koliber67/WSZYSTKO+DO+ZDJ*c4*98*c4*86+++*e2*96*ba/t*c5*82a/T*c5*82a+glitterowe
Uprzedzając jakiekolwiek pytania: tak, można użyć [teoretycznie] każdej grafiki, do pokrycia napisu. Nie musi to być glitter, może być np fragment samodzielnie wykonanego gradientu, jakiś wzorek, etc etc. Grunt, żeby było w miarę, hym, jednolite [aby nie było takiego efektu, że napis jest "podzielony" na kawałki] i miało raczej niewielkie rozmiary. Jakie? Do tego można samemu dojść, przeglądając te "tła". Rozmiarów jest wiele, więc nie będę wyliczać.
1. Ok, mamy swoje tło, którym chcemy pokryć napis. Co teraz? Wchodzimy tutaj: http://linuxenvy.com/bprentice/Banners/Banners.html
Wszystko pięknie, ładnie, jest lista czcionek, ale co z tego, skoro nie wiadomo, jak one wyglądają, czyż nie? Problemowi łatwo zaradzić, na dole jest taki link, Font Examples... Au, był. No nic, może to chwilowa awaria, kaprys czy jak to tam zwać :< W każdym razie, powinna być tam całkiem ładna lista dostępnych na tej stronie czcionek, umożliwiająca ich podgląd.
(https://burning-brushes.pl/proxy.php?request=http%3A%2F%2Fimg.burning-brushes.pl%2Fimages%2Fobrazek.jpg&hash=948c20c9e73d86323581e3c8b14098337c1ad75c)
Macie screen, jak to u mnie wygląda, więc na wszelki wypadek wyjaśnię co do czego, by nie było wątpliwości ^^
Banner text, wiadomo, wpisujemy tu swój własny tekst, przy czym przypomnę, że bardzo rzadko można znaleźć tu czcionkę, która obsługuje polskie znaki. A jak ma jeden polski znak to nie ma innego.
Font size, wiadomo, rozmiar czcionki, wg uznania. Z border size nigdy nie eksperymentowałam, ale ostatecznie nie ma znaczenia, bo w polu background size musi być wybrana opcja transparent. Text color, teoretycznie można sobie ustawiać jakieś kolory, ale po co, skoro pokryjemy to czymś innym? No, chyba, że otrzymany efekt w zupełności jest zadowalający, to wtedy owszem, można się tymi kolorami bawić. Przy czym warto zauważyć, że choć do wyboru jest zaledwie kilka barw, to pod linkiem Color Chart znajduje się ładna paleta, z dokładnym rozpisaniem wartości liczbowych tych kolorów. Tak więc można spokojnie wykroczyć poza rozwijaną listę ^^
User type, w sumie nawet nie wiem do czego to jest, więc zostawiam w spokoju tak, jak jest.
2. Skoro już wszystko mamy ustawione, to klikamy na "Submit", po czym przeniesie nas na stronę z napisem "Your banner is here". Wiadomo, klikamy na "here" i możemy cieszyć się swoim "bannerem".
Mój wygląda w tej chwili tak:
(https://burning-brushes.pl/proxy.php?request=http%3A%2F%2Fimg.burning-brushes.pl%2Fimages%2F1297757169.gif&hash=d3ccb7514148db9aba540e8500785c6944ebe4df)
Au, pewnie na tym ciemnym tle słabo będzie go widać ;x No ale przynajmniej widzicie to, co tu najważniejsze: napis jest na przezroczystym tle.
W razie czego, żeby było lepiej widać, podrzucam jeszcze link wygenerowany przez tę stronę: http://linuxenvy.com/bprentice/Banners/129775716924324.gif
Napis zapisujemy, tak jak jest, w formacie .gif, ew możemy skopiować tylko link.
A i byłabym zapomniała, jeśli efekt się nie podoba- po prostu się cofamy, zmieniamy rozmiar czy samą czcionkę i znowu generujemy banner.
3. To, co do tej pory robiliśmy, było proste, łatwe i przyjemne. Teraz trzeba trochę się napracować ^^
Wchodzimy tutaj:
http://www.imagemagick.org/MagickStudio/scripts/MagickStudio.cgi
Na dzień dobry mamy taki ekran:
(https://burning-brushes.pl/proxy.php?request=http%3A%2F%2Fimg.burning-brushes.pl%2Fimages%2Fobrazecmc.jpg&hash=0ea605e6629d5918b3396d3dc722c084cea27256)
Albo w polu filename wskazujemy ścieżkę do naszego napisu, znajdującego się na dysku, ale też w polu URL wklejamy link, wygenerowany przez LinuxevyBanner. Klikamy View.
4. Kolejny ekran wygląda tak:
(https://burning-brushes.pl/proxy.php?request=http%3A%2F%2Fimg.burning-brushes.pl%2Fimages%2Fobrazejgj.jpg&hash=c3397deff3b3df3ced64c4894bc443599970d07b)
No ładnie, tyle zakładek, można się w tym pogubić. szczerze mówiąc, sama nie za bardzo pamiętam, co i jak, ale zaraz odświeżę pamięć : D
Dobra, już wiem, przechodzimy do zakładki composite.
Wszystkie ustawienia muszą być takie tak tu:
(https://burning-brushes.pl/proxy.php?request=http%3A%2F%2Fimg.burning-brushes.pl%2Fimages%2Fobrazegdg.jpg&hash=143122ab9fae8faf388c1bf14566e66badc5d0ff)
Na dobrą sprawę zmieniamy tylko w polu Compose, z SrcOver czy tak SrcOut, już nie pamiętam, na In.
Uwaga: nie wolno o tym zapomnieć. Zjeżdżamy jeszcze w dół strony i zaznaczamy tam pole "tile across(...)". Żeby nie było wątpliwości:
(https://burning-brushes.pl/proxy.php?request=http%3A%2F%2Fimg.burning-brushes.pl%2Fimages%2Fobrazeuuu.jpg&hash=e886f55a1662eb72fe503805bcc86780c581459a)
Oczywiście w polu filename/url dajemy ścieżkę/link do tła, które sobie upatrzyliśmy [ja wybrałam to:http://img.burning-brushes.pl/?v=to19.gif ; o dziwo, tu mi ładnie miga, na kompie migać nie chce, chyba, że otworzę plik, napis pewnie też nie będzie migał. Ale zobaczymy].
No i klikamy composite.
5. Przeniosło nas do znanej już zakładki View, gdzie można podejrzeć, jak w danej chwili wygląda nasze dzieło. Sądząc po tym, co widzimy, to już koniec, ale nie do końca. Przechodzimy teraz do output.
Ups, najpierw zrobiłam screena, a potem dopiero pomyślałam o zmianie : D no nic, na razie widzimy to:
(https://burning-brushes.pl/proxy.php?request=http%3A%2F%2Fimg.burning-brushes.pl%2Fimages%2Fobrazekqk.jpg&hash=8baaf112a8562659bce56aa75809f0df5b452375)
O czym trzeba pamiętać?
Format:gif [bez zmian]
Dispose:none [zmiana z undefined]
Delay: 10[tu akurat jest bez zmian, ale kiedyś mi się chyba wartości zmieniły.
To co jest poniżej całkiem pomijamy. Klikamy output.
6. No i w zasadzie to koniec, bo wyświetla się już końcowy efekt, czyli coś takiego:
(https://burning-brushes.pl/proxy.php?request=http%3A%2F%2Fimg.burning-brushes.pl%2Fimages%2Fobrazebyb.jpg&hash=2ddc6b75663c9f4a22c669de18d9e693f3d0a6fb)
Ja zwykle klikam na to największe, bez numeru i po prostu wtedy zapisuję.

Wykonanie takiego czegoś to góra 5 minut, pod warunkiem, że na pewno wie się, czego się chce. Niestety, nie można powiedzieć, że robienie tutoriala zajmuje 5 minut, bo znacznie więcej, ale co tam : D
Jak z pewnością zauważyliście, jest tam też wiele innych zakładek, do których nawet nie zaglądałam. Jeśli macie ochotę, proszę bardzo, zerknijcie tam, może osiągniecie jeszcze lepszy efekt.

II
Wykonanie tego jest o wiele łatwiejsze, nie potrzeba żadnych materiałów. Wszystko, od A do Z generuje ten skrypt.
1. Wchodzimy tu: http://cooltext.com/ . Jak ktoś się dobrze rozejrzy, to zobaczy, że można tu wygenerować także buttony. Ale do rzeczy. Mamy taką stronę i co dalej?
(https://burning-brushes.pl/proxy.php?request=http%3A%2F%2Fimg.burning-brushes.pl%2Fimages%2Fobrazeqdq.jpg&hash=02000d2cf054852e931ca9005bf9892d1f495d6c)
Ni mniej, ni więcej, tylko klikamy na interesujący nas efekt. Ja wybrałam tu swój ulubiony, czyli płonący [3 od góry w 1 kolumnie od lewej].
2. Przeniosło nas tu:
(https://burning-brushes.pl/proxy.php?request=http%3A%2F%2Fimg.burning-brushes.pl%2Fimages%2Fobrazefyf.jpg&hash=a0994860b609e37352be3598297e2d670b42b0dc)
W pierwszym polu, wiadomo, wpisujemy własny tekst. Później, czcionka [zauważę, że stąd można ściągnąć całkiem niezłe czcionki]. Użyję tu jednej ze swoich ulubionych, czyli VTC Tribal. Jak się do niej dostać? Klikamy na widniejący napis "Agate"[domyślna czcionka w tym efekcie], potem, w ukazujących się Font Categories wybieramy Gothic. 2 Czcionka od dołu to jest właśnie to VTC Tribal. Klikamy na nią.
3. Wróciliśmy do strony z naszym napisem. Zdecydowanie lepiej będzie wyglądał tu czarny kolor czcionki, więc klik na czerwone pole, klik na czarny kolor w pokazującym się okienku:
(https://burning-brushes.pl/proxy.php?request=http%3A%2F%2Fimg.burning-brushes.pl%2Fimages%2Fobrazeygy.jpg&hash=d92c327fcf343dd39138413fcb0f7aa0e0150b0c)
No i je zamykamy przy pomocy krzyżyka. Jako, że od razu widać efekty, możemy stwierdzić, że już jest znacznie lepiej, nieprawdaż? Ale to nie koniec.
Został jeszcze Flame Angle. Tu już w zasadzie wg uznania, warto też pamiętać, że jeśli wybierze się zbyt duży kąt nachylenia, to po prostu... wywieje płomień z jednej strony ramki i pokaże się z drugiej. Ja ustawiam zwykle na 45, ładny efekt, płomienia nie przenosi na drugą stronę.
No i klikamy Render. W zasadzie to już koniec, trzeba tylko zapisać dzieło. Moje wygląda tak:
(https://burning-brushes.pl/proxy.php?request=http%3A%2F%2Fimg.burning-brushes.pl%2Fimages%2Fcooltext50.gif&hash=e7b1fd7f5b81595c39cb32c2f7f4d407b9beb7a1)

Na koniec pokażę jeszcze wersję napisu dla spaceartystów : D
(https://burning-brushes.pl/proxy.php?request=http%3A%2F%2Fimg.burning-brushes.pl%2Fimages%2Fcooltext50.png&hash=24b76125dba879b7a9c73ff12e8d8cd754852116)
W wykonaniu tego nie ma żadnej filozofii, po prostu wybiera się ten efekt [3 od dołu, w 3 kolumnie od lewej], ustawienia pozostawić takie, jakie są, tylko ewentualnie pobawić się czcionką, jej rozmiarem no i oczywiście wpisać swój tekst.



Na koniec mogę tylko życzyć miłej zabawy z tymi generatorami, bo przecież używając zawartych w nich opcji, można osiągnąć rozmaite efekty.














Tutorial wykonany tylko i wyłącznie dla Burning Brushes.
Tytuł: Odp: Ozdobne napisy bez wykorzystania programów graficznych
Wiadomość wysłana przez: Abik w Luty 15, 2011, 15:32:44
Dzięki, nie wiedziałem w ogóle o tej stronce, przydatny gadżet :D
nieźle to opisałaś kurcze, dobra robota!
Tytuł: Odp: Ozdobne napisy bez wykorzystania programów graficznych
Wiadomość wysłana przez: Eldi w Luty 15, 2011, 15:39:14
To teraz wiesz ; ) sama nie używam tego od.. ohoho, nie wiem jak dawna. 2 lata? Nie mówiąc już o tym, że i tak rzadko z tego korzystałam. Cud, że zachowało się w zakładkach ^^
I jak widać, nie tylko Ty masz grafomańskie zapędy : D

Cieszę się, że się podoba ; )
Tytuł: Odp: Ozdobne napisy bez wykorzystania programów graficznych
Wiadomość wysłana przez: Sympatyk w Luty 15, 2011, 16:49:13
Efekt "NOVA" widziałem w jednym avku ale sądziłem, że sam zrobił :)