Staré hry a časopisy, Retrogaming

 
Staré hry :: DJ OldGames

Téma   Dungeon Mapper

vytvoril: dj, 08.11.2013, 21:08
modifikoval: dj, 15.04.2021, 08:28
Home-made nástroj na vytváranie štýlových máp pre dungeony priamo v prehliadači. V článku sa chcem podeliť o tento editor máp, na ktorom aktuálne pracujem a samozrejme zapojiť Vás aj do hromadného testovania. Mapovaniu zdar...

DJ's Dungeon Mapper

www.oldgames.sk/dungeon-mapper/

 

Kreslenie máp k dungeon-crawlerom, alebo všeobecne k RPG hrám bola vždy moja obľúbená činnosť. Najčastejšie používanými nástrojmi pri mapovaní sú u mňa zrejme ceruzka a štvorčekovaný papier, predovšetkým preto, že to bolo najjednoduchšie a zároveň prehlbovalo atmosféru blúdenia zatuchlými kobkami vytváraním niečoho hmatateľného. Takýchto fyzických pripomienok svojich virtuálnych zážitkov mám plný šuflík. Problémom mapovania v takejto forme bola jednoznačne editovateľnosť. Pri potrebe niečo zmeniť, prípadne opraviť chybu mi časom pod rukami vznikali neprehľadné mazanice a nutnosť v neskorších fázach mapu nanovo prekresliť.


Už len ten problém na samotnom začiatku, predo mnou na počítači nová kobka, na stole čistý štvorčekovaný papier formátu A4. Po rozvážnom zanalyzovaní možného rozloženia mapy zapichujem ceruzku niekde do stredu a ako tak postupujem, je mi jasné, že som trafil zrovna nejaký okraj a mapa bude pokračovať na druhej strane papiera. Grrrr...

 

Ale nie o tom som chcel, bude to tu o kreslení virtuálnych máp na počítači a nástrojov k tomu používaných.

Pri vytváraní máp vo virtuálnej podobe som vyskúšal už množstvo softvéru, bohužiaľ žiadny mi zatiaľ "nesadol" a nakoniec som aj tak skončil vo fotošope, kde som nebol ničím obmedzený. Nutne dodávam, že mapy som v tomto grafickom programe robil už z pripravených podkladov, či už z máp urobených na papier, z "nedokonalých" automáp v hre (Evil's Doom), alebo vytváraním mapy sveta spájaním obrázkov z hry (Dragonflight).

 

V príslušnej téme v diskusii sme taktiež riešili rôzne nástroje, množstvo hráčov vytvára mapy v tabuľkovom procesore - Exceli a vôbec to nevyzerá zle (viď mapy od Quida), ale ja som si na to proste zvyknúť nemohol. V poslednej dobe som skúšal Grid Cartographer Pro, ale tiež som to vzdal. Na webe sa už pár rokov vyskytuje celkom praktický nástroj Dungeon Crawl Map Editor, pre kreslenie máp priamo v browseri. Veľkou výhodou je jeho nenáročnosť, dá sa prakticky použiť pri mapovaní, ale chýba mi tam možnosť poznámkovať a viac funkcií. Týmto programom som sa aj inšpiroval pri návrhu toho vlastného:

 

Dungeon Mapper

Tož to je to, čomu sa v posledných dňoch voľnočasovo venujem. Snažím sa vytvoriť niečo praktického, použiteľného pre všetkých, čo si radi vytvárajú vlastné mapy k dungeonom a predovšetkých chcem, aby tie výsledné produkty dobre vyzerali.

 

Aktuálnu verziu nájdete na: www.oldgames.sk/dungeon-mapper/

 

Mapa by mala mať svoj jednoduchý a prehľadný, schématický štýl, jedným z cieľov je aj to, aby dobre vyzerala v čierno-bielych farbách, prípadne vytlačená na čb tlačiarni. Ďalšou dôležitou vecou bola možnosť poznámkovania mapy aspoň dvoma typmi značiek a automatické vytváranie legendy. Jedna značka pre poznámku je teda klasické koliesko s viditeľným ľubovoľným dvojznakových označením a ďalšia je "excelovského typu" teda malý červený štvorček v rohu tak aby neprekážal značkám na danom políčku. Poznámky sú samozrejme viditeľné aj ako tooltipy nad kurzorom.

 

Zopár technických: pre tento editor značne využívam jQuery a jQuery UI, samotná oblasť mapy je tvorená kockami (html elementmi typu span) celkovo v ôsmych vrstvách nad sebou, čo znamená, že pri väčších mapách to môže trošku zlenivieť. Každé políčko môže mať svoj obrázok, pre ktorý využívam background-image v CSS.  Nie som schopný zistiť, prečo prehliadač Google Chrome nevie zobraziť viac obrázkových pozadí v elemetoch "nad sebou", a preto zatiaľ v Chome nevidno čo je nakreslené (aj keď to tam je) - používajte teda Firefox a Explorer. Podporuje všetky moderné prehliadače.

Vrstvy - layers: snažil som sa ich urobiť tak, aby sa dali jednotlivé prvky kombinovať a jednoducho tak vytvoriť nové s použitím čo najmenšieho počtu nástrojov, príklad - ak chcem nakresliť dvere priechodzie jedným smerom, použijem v jednej vrstve ikonku dverí a v druhej šípku, podobne pri jednosmernej stene, nie je potrebné mať pre každý typ vlastný nástroj.

Viditeľných vrstiev je 6, zoradené od najspodnejšej:

  • GRID - podklad, mriežka mapy, mám tam zatiaľ zopár farebných možností
  • FLOOR - pre kreslenie podkladov v zmysle celého "hrubého" štvorcového políčka
  • FLOOR MARKERS - značky nad vrstvou FLOOR, teda v zmysle štvorca
  • WALL - podklad v zmysle "tenkej jednorozmernej" steny, využíva sa aj pre ohraničovanie štvorcových stien, čo vyzerá pekne
  • WALL MARKERS - značky nad vrstvou WALL, teda v zmysle čiary
  • NOTES - poznámky

Export / Import (save/load pre lokálne použitie): mapa aj s poznámkami sa uchováva ako textový reťazec, drobnou nevýhodou je nutnosť nepoužívať v texte poznámok niektoré špeciálne znaky - oddeľovače (^ | ;), uložíte si ju teda systémom copy-paste do akéhokoľvek textového súboru v notepade. Neskôr pribudne možnosť uloženia na server a prepojenie mapy priamo s hrou na stránkach OldGames.sk, ale dôležité je v prvom rade to, aby editor fungoval aj offline.

Ovládanie myšou: zatiaľ využívam dve tlačidlá - ľavým sa kreslí vybraným nástrojom (umožňuje aj držanie a pohyb), stlačenie pravého tlačidla znamená zmazanie políčka v aktuálnej vrstve (neumožňuje držanie a pohyb).

Osi a číslovanie políčok: toto bol často problém ostatných editorov, ktoré políčka nečíslujú vôbec, alebo majú osi napevno. Väčšina dungeonov má pritom interne sieť mapy fixne očíslovanú a niektoré to dokážu hráčom presne povedať na akom políčku sa nachádza (MM1 a kúzlo Locate). Pridal som teda možnosť nastaviť si číslovanie oboch osí od ľubovoľného čísla a tiež reverzne.

 

 » Download - Dungeon Mapper Offline verzia (zip)

 

Tak teda skúšajte, testujte (dúfam že je ovládanie dostatočne intuitívne) a pripomienkujte v diskusii, snáď sa mi z toho podarí vytvoriť zmysluplný Dungeon Mapper ;-)

Nástroje v toolbare tiež budem dopĺňať, takže nech sa páči, sem s návrhmi, ktoré by som mal ešte nakresliť...

 

Update 4/2021: Po dlhom čase som opäť nakukol do pravekých zdrojákov a pridal do programu niekoľko nových funkcií. Za zmienku stojí napríklad možnosť vybrať akúkoľvek obdĺžnikovú časť mapy a presúvať ju so všetkými vrstvami aj poznámkami. Tiež mi neustále chýbali ďalšie grafické prvky / nástroje a preto som namiesto kreslenia nových pixelových ikoniek využil dostupnú free knižnicu FontAwesome. Už to síce nie je pixel-perfect ale ikony fungujú ako fonty, čo prináša veľa nových možností, vrátanie zmeny farby, alebo zapnutia animácie - rotácie. Ikoniek je veľká hromada - aktuálne niečo cez 1600 a používam všetky čo sú free, teda aj brandové, preto je pri výbere aj možnosť vyľadávať podľa classname, ktorý sa zobrazuje v tooltipe...

Hry súvisiace s touto témou (0)


Počet príspevkov : 7 / 57
Zoradené   
 zobrazených: 7 [ 51-57/57 ]   «predchádzajúce 01 nasledujúce»
Crash Crash   | Výborně 12.11.2013, 14:12:41     Odpovedať   edit   delete
Velmi chvályhodný počin , taky jsem už pár mapovacích softwarů zkoušel a zatím jsem nenarazil na nic co by mi sedlo. V podstatě se mi nakonec nejvíc zamlouval ten Excel, ale protože doma mám OpenOffice a ty jak na potvoru neobsahují "volné malování" ohraničení buněk, takže ani tady jsem neuspěl.

Takže se určitě těším, nevím sice kdy to vyzkouším, ale určitě to vyzkouším. ;-)
David Kulhan David Kulhan   |  11.11.2013, 07:51:57     Odpovedať   edit   delete
Veeeery nice !
Tomas Dzamko Tomas Dzamko   |  10.11.2013, 03:21:53     Odpovedať   edit   delete
Rovnako je problem ked si posuvam mapu a omylom vyjdem mimo range. Vtedy mi to zmaze content. Bud nech to nepovoli posunut alebo nech nemaze content.
Birthdeath Birthdeath   | Bravo 10.11.2013, 01:12:42     Odpovedať   edit   delete
Úžasná vec, môžem už vopred povedať že toto bude mať ohromný úspech. Zatiaľ som chyby nepostrehol, ale mám nápad na zlepšenie: pre hry bez fixnej mapy (Wizardry 6-7 napr.) by bolo dobré mať niekde možnosť aktivovať akúsi "nekonečnú" mapu, kde by po zaplnení akéhokoľvek políčka v poslednom stĺpci resp. riadku sa automaticky zväčšila mapa o 1 políčko v tom smere.
Karol Karol   |  09.11.2013, 15:26:58     Odpovedať   edit   delete
wow, naozaj dopilovana pomocka. 100 krat lepsie ako sa trapit mapovanim prostrednictvom ad-hoc excelov ci narychlo urobenych alternativ.
Super!
DJ DJ   | Editor 09.11.2013, 11:53:18     Odpovedať   edit   delete
Zobraziť Odpoveď na príspevok od Richmond:
Ano prioritou je offline verzia, t.j. je to javascriptova aplikacia pre browser, nepotrebuje byt online. Zabudol som to pri pisani clanku pridat do textu, takze to napravujem. Mas tam odkaz na stiahnutie kompletnych zdrojakov, cize offline verzia.
Staci spustit index.html v browseri.
Richmond Richmond   | Editor 09.11.2013, 11:11:18     Odpovedať   edit   delete
Vypadá to dobře! Bude to včetně offline verze?
 zobrazených: 7 [ 51-57/57 ]   «predchádzajúce 01 nasledujúce»

Retrogaming merch - HV 1701.cz
 možnosti podpory
🍺 Buy me a beer
 hľadaj v časopisoch
 hľadaj všade
 posledne pridané hry
Tomb Raider II, 22.02.2024
Joust, 24.11.2023
Fortress of Dr. Radiaki, The, 01.10.2023
Rampage, 23.09.2023
Lost Vikings 2: Norse by Norsewest, 03.07.2023
Falcon, 03.05.2023
Metal Gear, 18.10.2022
Clock Tower, 26.09.2022
RoboCop 2, 09.05.2022
Ztracený ostrov, 01.05.2022
[ viac ]
 diskmagy
 Narsil
 Pařeniště
 KLAN
 PC Engine
 Bonus
 follow / sharing
 štatistiky
 Hry :: 1271
 Prílohy :: 8235
 Komentáre :: 7766
[ viac ]
Copyright © 2018 DJ, design & code by DJ
| OldGames | Online Hry | Časopisy | Diskmagy | Zberateľstvo | Diskusné fórum | Galérie obrázkov | Prílohy | PC hry | Mapa stránok | Odkazy | Kontakty |
| RSS-všetko | RSS-hry | RSS České hry | RSS-komentáre | RSS-diskusia | RSS-časopisy | RSS-prílohy | Facebook | Twitter |
 | Divinity: Original Sin | The Bard's Tale | Might & Magic X: Legacy | Legend of Grimrock II | King's Bounty: The Legend | Dune 2000 | Fix-It Felix Jr. online | DOSBox