Jak vytvoriť GB

Za tento navod ďakujeme moderátorovi s travian fora.

Jelikož se zavedl nový systém GP, přináším i nový návod. Mezi hlavní změny patří přidání ikony pro posun mapy o sedm políček najednou, možnost editovat formát pozadí surovinových polí a rozdílné obrázky budov při stavbě budovy z 0. úrovně na 1. úroveň.



Všechny dotazy pište do tématu Kompletní návod na tvorbu grafických balíků - dotazy



Z čeho se skládá GP...

Grafické balíky (grafic pack)-dále GP, se zkládají ze souboru
css(kaskádový styl) a obrázků,které výsledně vidíte ve hře. Kaskádové
styly (css) slouží k tomu,abyste definovali,na kterém místě bude který
obrázek a kde na stránkce bude jaká barva.Kdo nerozumí kaskádovým
stylům,nemusí se obávat,vystačí si i s tím,že bude upravovat jenom
obrázky. Upravit tedy můžeme celé barevné schéma stránek nebo jenom
budovy.

V GP se setkáme s dvěma formáty obrázků: gif a jpeg. Gif má oproti
jpegu tu výhodu, že do něj lze kreslit tzv. průhlednou barvou nebo se
některá z jeho barev dá nastavit jako průhledná. V místech, kde bude
tato barva, bude tedy vidět pozadí za obrázkem. Dále dokáže formát gif
pojmout sekvenci obrázků jdoucích po sobě. Můžeme tedy mít statický
(nehýbající se) ale i animovaný (hýbající se) obrázek. To nám napomůže
při tvorbě animovaných budov ale i kterých koliv jiných obrázků.



Pro začátek

Stáhněte si základní GP (po přihlášení do hry v levém menu klikněte na
profil,poté na grafický balík a dole na odkaz "Stáhnout" nebo přímo zde )a uložte si ho do počítače na místo, o kterém víte, kde je.
Rozbalte jej pomocí některého z archivačních programů (Winzip , Total Commander ,a další) do nějaké složky. Měly by se vám rozbalit složka img a dva soubory kaskádových stylů unx.css a gp_check.css. Nyní máte stažené informace o celém barevném prostředí Travianu.

Pro naši další práci se vám bude hodit několik málo programů na úpravu
a tvorbu obrázků, animací a css. Pro úravu obrázků mohu vřele doporučit
Adobe Photoshop,z freewarových pak GIMP. Na tvorbu a úpravy animací (gif) doporučuji Macromedia Fireworks nebo freewarový Gif animator.
A pro úpravu css můžete použít i obyčejný poznámkový blok nebo např.
Style Master. Používání těchto programů je někdy celkem složité, a
proto se jím nebudu zde zabývat. O rady s používáním se popř. obraťtě
na mé ICQ nebo mail nebo ještě lépe na fórum.



Pitva GP

Jak jsem již, psal v souboru unx.css najdete v kódování css informace o barvách a o tom, který obrázek se přiřadí kterému domu nebo místu na stránce. Soubor gp_check.css je neméně důležitý. Ten tu je kvůli ověřování GP v profilu. BEZ NĚHO BY OVĚŘENÍ NEPROBĚHLO! Podíváme se,co najdeme ve složce img.

Po otevření složky najdeme další dvě podsložky (cz, un) a obrázek gp_preview.gif). Gp_preview.gif
se zobrazí v profilu pod záložkou Grafický balík pokud je přístupová
cesta správná. Do našich dvou složek jsou rozmístěny všechny obrázky
nadpisů, budov a ikonek. V každé složce dále naleznete další podsložky.
V následujícím výpise bude napsáno,v které složce je jaká podsložka a
co v ní najdete



cz

• a - loga travianu a travianu plus
  
• b - všechna tlačítka (buttons)
  
• f - ikony a smajlíci fóra ve hře
  
• msg - pozadí-blok ve zprávách
  
• t1 - nadpisy na hlavních stránkách travianu, pozadí návodu
  
• t2 - nadpisy v registraci účtu
  

un

• a - pozadí návodu, ikonky (štíty a meče bojů, kolečka aktivity hráčů,...)
  
• g - budovy, podklad vesnice, surovinová pole
  
  
  
  • s - čísla úrovní surovinových polí
    


• l - ikony horního menu ve hře (přehled vesnice, centrum vesnice, mapa,...), několik dalších obrázků
  
• m - poklady map, vesnice, mapy, obrázky přírody
  
• m - obrázky upgradů, zatim nevím k čemu sloužící
  
• r - ikony surovin a dalších blbostí
  
• u - ikony všech vojenských jednotek a bojovníků
  
• u2 - Obrázky bojových jednotek v návodu
  

Podrobný seznam souborů najdete v příloze



Po prohledání složek GP by ste se měli začít trochu orientovat i v css
souboru. Podle názvů obrázků naleznete který příkaz patří ke které
budově a místu. Rozebírat zde celé css by nemělo smysl. V příloze
najdete odkaz na css s českými poznámkami, které vás navedou, které
vlastnosti patří ke kterým částem a místům na stránkách.



Úprava obrázků

GIF

Jako první se podíváme na gify, kterých je v GP asi nejvíc. Jak jsem
již zmínil, nespornou výhodou gifů je jejich možnost průhlednosti.
Další výhodou je, že gif může být statický, ale i animovaný
(pohyblivý). Každý obrázek je obdélníkový. I když nejsou jeho strany
vidět, samotný obrázek je nějaký obdélník. Pokud tedy chceme, aby se na
mapě zobrazil jenom domeček a ten zbytek byl průhledný a bylo vidět
pozadí, použijeme gif. V travianu se využívá tzv. překrývání. Kdy
podkladem je pozadí vesnice a to je poté překrýváno budovami, které
mají definovanou přesnou pozici na podkladu.

Gif, stejně jako většina formátů obrázků, je bitmapový. Tzn, že pokud
byste si gif zvětšily, zjistíte, že je složen ze čtverečků. Každý
čtvereček má nějakou barvu a ty nám dohromady vytváří mozaiku,která při
dostatečném zmenšení vytváří obrázek.



V dobrém editoru by se vám po otevření gifu měla průhledná část
zobrazit jako šedobílá šachovnice. V jiných programech se může zobrazit
jako bílá barva. Závisí to též někdy na nastavení programu. Pomocí
editoru obrázku si tedy otevřeme požadovaný obrázek (ikona, domek, ...)
a začneme ho upravovat (překreslíme, dokreslíme, apod.). Popis úpravy a
návody na jednotlivé programy najdete časem v přílohách.

Důležité je, že obrázek, který upravíte a budete
chtít nahradit za nějaký původní, musíte uložit do stejné složky pod
stejným názvem!!!

Jak jsem již psal, v css je uložena informace, na který obrazec má být
použit který obrázek (název). Pokud byste tedy vaše díla ukládali pod
jiné názvy, prohlížeč by bral z GP původní soubory, které jsou
nadefinovány v css.

ANIMACE

Animace (animovaný obrázek) je sled za sebou jdoucích samostatných
nepohyblivých obrázků. Je to jakýsi pás obrázků, které když přehrajete
rychle za sebou, tak vám utvoří pohyb. Na tom se zakládá i dnešní
animace filmová. Webové animace jsou ve formátu gif a dnes i flash. V
travianu je použit pouze gif. Proto pokud chcete vytvořit animaci,
musíte vytvořit několik obrázků, které jsou stejné, jen se vždy na
dalším snímku nějaký kousek posune a po přehrání nám vytvoří souvislý
pohyb. Opět použití programů bude popsáno v přílohách.



JPEG

Posledním typem jsou jpegy. Jsou to statické obrázky. Jsou použity na
pozadí vesnic apod. Jejich překreslování a změna je podobná jako u
gifů. Zde neni moc co rozepisovat.





Kaskádové styly v travianu

Kaskádový styl je text v určitém jazyce. Pro normálního člověka se zdá
jako slátanina divné angličtiny v dvojitých závorkách. Jazyk
kaskádových stylů využívají především webdesignéři. V jednotlivých
částech jsou podle kódu stránek nastaveny barvy, šířky, obrázky a
parametry stránek ve hře. Pro ty, kdo by se chtěli začít zajímat o css,
skvělá příručka se nachází na stránkách Jak psát web.

Vy, kteří se vyznáte i v kaskádových stylech jistě velmi lehce
proniknete do definic travianu. Malá potíž je v tom, že nekteré barvy
nejsou definovatelné v našem css a jsou staticky nastaveny v kódu
stránek. Takéž některé obrázky lze překreslit, ale nelze změnit jejich
formát nebo název, protože odkazy na ně nejsou v definovatelném css. To
se projeví nejvíce v přeměně statických obrázku na animované (níže).

Rozpis css a jeho odkazů bude v příloze.



Změna statických ikon na animované

Vytvoření a podstatu gifu jsme si již vysvětlili. Pokud jste si však
stáhnuli základní GP, všimli jste si, že budovy se nehýbají, a
dozajista budete v budoucnu chtít, aby se hýbali. Možnosti jsou dvě.
Buďto si můžete stáhnout již hotový animovaný GP nebo si vlastní
vytvořit.

Pokud budete vytvářet animované budovy ze statických obrázků jejich
klonováním a drobnámi změnami některých jejich částí, budete muset
taktéž zajít do souboru cz.css a vždy si vyhledat odkaz s daným
obrázkem a přepsat u něho příponu z jpg na gif (jelikož jpegy jsou
pouze statické, kdežto gify mohou být i animované). Proto doporučuji
začátečníkům, aby si stáhli již hotové animované GP a pouze upravovali
animace, aby se nemuseli vrtat hned v css. Stáhnout si můžete GP od
Prasete nebo si vybrat jeden z uvedených přímo zde na fóru.



Výsledná realizace GP v praxi

Pokud jste tedy již vše upravili a připravili, stačí již pouze
aktivovat GP. V profilu pod záložkou Grafický balík (obrázek viz výše)
najdete políčko Cesta:. Sem napíšete přístupovou cestu ke složce s GP.
Možnosti realizace GP jsou dvě:

• Realizace z pevného disku
  
• Realizace z webového prostoru
  

Nevýhodou realizace z pevného disku oproti realizaci z webového
prostoru je, že přístupová cesta z pevného disku platí pouze u vás
doma. Pokud byste chtěli, aby se vám GP spouštěl i na jiných
počítačích, museli byste na každém vytvořit stejné složky a na stejné
místo uložit GP. Jinak by se vám načetl základní GP. Pokud tedy chcete,
aby GP fungoval vždy a všude, když se přihlásíte do travianu,
doporučuji realizaci z webového prostoru.

REALIZACE Z PEVNÉHO DISKU

Pokud chceme, aby se nám načítal GP z disku, tedy z našeho domácího počítače, cesta bude začínat file://.Následuje přístupová cesta ke složce s GP. Pokud jsem si uložil složku s GP například na disk C:/ do složky Hry, bude přístupová cesta file://C:/Hry. Ve výsledku to funguje tak, že počítač se podívá a zjistí, že podle file:// se má podívat do počítače a podle C:/Hry na disk C do složky Hry, kde nalezne složku img a soubory unx.css a gp_check.css. Jak jsem již říkal, soubor un3.css
tam nemusí být, v reálu není používán. Důležité je tedy napsat cestu do
složky, kde je složka s obrázky a css soubor. Nyní už stačí provést
test stisknutím tlačítka Test a následně potvrdit tlačítkem Aktivovat.

Při úspěšném testu by se vám měl nad tlačítky zobrazit barevný obrázek
s nápisem. Pokud se však zobrazí červený obrázek, je něco v nepořádku.
Nejprve zkuste na začátek přístupové cesty napsat file:/// místo file:// (tedy tři lomítka místo dvou). Pokud to nepomůže, mrkněte do travian faq.

REALIZACE Z WEBOVÉHO PROSTORU

Realizace z webového prostoru je o něco složitější. Pro to, aby se vám
GP z webu načetl, musíte nejprve nějaký mít, popř. u někoho mít daný GP
uložený. První variantou jsou již hotové GP, které majitelé uveřejňují
na svých webech a je možno přímo opsat jejich přístupovou cestu a zadat
ji v profilu. Pokud si však vytvoříte vlastní GP a budete ho chtít dát
na web, musíte si nejdříve zřídit vlastní webový prostor. V dnešní době
existuje kromě placených prostorů i mnoho freehostingů (webových
prostorů zdarma). Jsou sice o poznání menší, ale pro naše účely zatim
postačí. Pro příklad uveďme Webzdarma(50-150 MB), Internetové centrum(250 MB) nebo Hostuju(1000 MB). Pro zřízení prostoru se stačí na některém z daných servrů zaregistrovat (získáte tím přístupové jméno a heslo).

Poté už stačí pouze pomocí některého z FTP klientů (Total Commander, FTP Commander nebo Clear FTP), které slouží k přenosu dat z počítače na internet (na webový prostor), přenést GP.

Pro příklad: Svůj GP jsem si uložil do složky travian. Tuto složku jsem nahrál na své stránky, které mají adresu http://travian.hostuju.cz. Do přístupové cesty tedy napíšu http://travian.hostuju.cz/travian.

Všem, kteří budete ukládat svá díla
na web, doporučuji psát všechny složky malými písmeny. Dělá to někdy
neplechu, když složka začíná velkým písmenem...



Rozdílné prohlížeče

Jelikož mnoho z nás již dávno nepoužívá Windowsem implementovaný
Internet Explorer, musím zde zmínit i ostatní prohlížeče. Ve všech,
kromě IE6 a nižším, mohou vzniknout problémy s realizací GP. Velmi
intuitivně jsou návody pro instalaci GP do ostatních prohlížečů popsány
v travian faq.





Máme tedy probráno vše základní od začátku až po konec. V přílohách se
budu více věnovat css a později i návodům na jednotlivé programy. S
jakýmikoliv dotazy se prosím obracejte na fótum do místnosti dotazů k tomuto tématu nebo přímo na můj mail a ICQ. A
nezapomeňte na to, že co jste nevyrobili vy, nevydávejte za své a
alespoň vždy uveďte,že jste animace přebrali, protože dodržení cizích ©
je otázkou cti každého tvůrce!