*Author

Scaredgirl

  • Guest
Re: Coding: How to make the map? https://elementscommunity.org/forum/index.php?topic=9317.msg212361#msg212361
« Reply #48 on: November 29, 2010, 07:37:12 am »
I see a fourth option, using SVG. It's a vector graphic format (like Flash) that use tags like HTML and that can be styled with basic (but special) CSS, and it work with most browsers (as always, not with IE 8 and past, but it should work with the future IE 9). With the HTML 5 buzz and general browsers standardization, it could prove to be a robust and nice alternative to Flash. And, being XML based, the SVG could be modified easily, and even generated. I tested SVG a bit some times ago, and with minimum knowledge of the SVG language, I made this sample : http://helltgivre.free.fr/isoplus/isoplussvg.php (don't work with IE unless you install the Adobe SVG Viewer).

An other option is to dynamically generate a picture of the map with a programming language, and maybe add interactivity with HTML image map.


Speaking of coding, most, if not all, the round management, and all stuff happening in WoE could be tracked automatically with a proper interface. But that's an other topic...
Pretty cool stuff. That's definitely one very nice option. I have almost zero experience with SVG myself, so I guess I need to look into that a bit more.


Since Planplan is already picked for this job, maybe he can give us the answer here on which language is he planning to use. I'm sure people could then step in and help, if help is needed in any part of the coding (writing boring functions, organizing database and whatnot).
I completely forgot this. Well anyway, just to reiterate my case for flash here's the link for the sample.

http://samplemap.hostwebs.com/ (http://samplemap.hostwebs.com/)

Try clicking on hex #1, 2, 3, 4. (I temporarily stopped after reading the above post). The data on the left (lore/info/players) changes as you click a location. Data is dynamically updated through xml (notepad-editable) so modifying/updating player lists and location information and even images is easy (copy-paste-edit). New features can be easily implemented and you don't even need the coder around to do it. Also, this flash swf file is currently only 60KB.
Looks pretty good. Having a data window there on the left might work.

But from a usability standpoint, there's a major problem.

Lets say I want to get all the information from one hex. That would require ridiculous amounts of clicking. Instead of the accordion navigation, why not just have all the information in one window? And if there's not enough space, you could have all the data in shorter from, and the ability to click for more information. For example instead of listing all the players, you only list how many there are. And if you click the number, it shows who they are.

homoaddictus

  • Guest
Re: Coding: How to make the map? https://elementscommunity.org/forum/index.php?topic=9317.msg212368#msg212368
« Reply #49 on: November 29, 2010, 08:04:42 am »
Looks pretty good. Having a data window there on the left might work.

But from a usability standpoint, there's a major problem.

Lets say I want to get all the information from one hex. That would require ridiculous amounts of clicking. Instead of the accordion navigation, why not just have all the information in one window? And if there's not enough space, you could have all the data in shorter from, and the ability to click for more information. For example instead of listing all the players, you only list how many there are. And if you click the number, it shows who they are.
Yeah, you're right it does take a lot of clicks to see everything. One reason I used the accordion was I thought descriptive text per location would be long and to minimize the size of the swf file.  I'll get rid of the accordion and see what i can fit in there. I guess a clickable image that links to a forum post would do for the lore so there will space left for the info and player trees. I will update this when i make progress.

Daxx

  • Guest
Re: Coding: How to make the map? https://elementscommunity.org/forum/index.php?topic=9317.msg212388#msg212388
« Reply #50 on: November 29, 2010, 08:55:40 am »
Since Planplan is already picked for this job, maybe he can give us the answer here on which language is he planning to use. I'm sure people could then step in and help, if help is needed in any part of the coding (writing boring functions, organizing database and whatnot).
I completely forgot this. Well anyway, just to reiterate my case for flash here's the link for the sample.

http://samplemap.hostwebs.com/ (http://samplemap.hostwebs.com/)

Try clicking on hex #1, 2, 3, 4. (I temporarily stopped after reading the above post). The data on the left (lore/info/players) changes as you click a location. Data is dynamically updated through xml (notepad-editable) so modifying/updating player lists and location information and even images is easy (copy-paste-edit). New features can be easily implemented and you don't even need the coder around to do it. Also, this flash swf file is currently only 60KB.
This looks incredibly useful, even in a bare-bones state. I can immediately think of a million features I'd like to add, but as it is it looks fantastic.

Offline Planplan

  • Jr. Member
  • **
  • Posts: 130
  • Country: fr
  • Reputation Power: 8
  • Planplan is a Spark waiting for a buff.
Re: Coding: How to make the map? https://elementscommunity.org/forum/index.php?topic=9317.msg212413#msg212413
« Reply #51 on: November 29, 2010, 10:54:35 am »
Just finished a small naive test with SVG generation of an hexagonal map : http://helltgivre.free.fr/elements/hexmap/hexmap.php
It's not optimized at all, but work great. For those who are interested, here also the (small) CSS : http://helltgivre.free.fr/elements/hexmap/svg.css

Look like Google made a small Javascript + Flash tool to allow SVG to fallback to Flash if not supported.

Since Planplan is already picked for this job, maybe he can give us the answer here on which language is he planning to use. I'm sure people could then step in and help, if help is needed in any part of the coding (writing boring functions, organizing database and whatnot).
I'm not the only one choosing. We have different options, each with pros and cons. I tend to prefer technology that don't rely on paid software (like Flash), but sometimes they could be the best choice.
Also, I don't mind working with someone else.

I completely forgot this. Well anyway, just to reiterate my case for flash here's the link for the sample.
http://samplemap.hostwebs.com/ (http://samplemap.hostwebs.com/)
Try clicking on hex #1, 2, 3, 4. (I temporarily stopped after reading the above post). The data on the left (lore/info/players) changes as you click a location. Data is dynamically updated through xml (notepad-editable) so modifying/updating player lists and location information and even images is easy (copy-paste-edit). New features can be easily implemented and you don't even need the coder around to do it. Also, this flash swf file is currently only 60KB.
Pretty good work, maybe you should take a look at my card generator codes, you might give me precious advice ! :P
Love the XML stuff, but maybe it could prove a bit painful at the long run to use a raw file like this. When movers need to update positions, they can't update it at the same time. I think having a user interface to update a database, and, when the round finish, why not generate the new XML from the database.
Also, all map data are public ? Or some public and some others private/tied to account or element ?

Daxx

  • Guest
Re: Coding: How to make the map? https://elementscommunity.org/forum/index.php?topic=9317.msg212414#msg212414
« Reply #52 on: November 29, 2010, 11:03:24 am »
I would quite like some of the map data to be private in some way. If there's not an elegant solution to this, I don't see why we can't just have the private data be added to each user's character sheet or the Element's private forums rather than the map itself.

Scaredgirl

  • Guest
Re: Coding: How to make the map? https://elementscommunity.org/forum/index.php?topic=9317.msg212422#msg212422
« Reply #53 on: November 29, 2010, 11:31:13 am »
Just finished a small naive test with SVG generation of an hexagonal map : http://helltgivre.free.fr/elements/hexmap/hexmap.php
It's not optimized at all, but work great. For those who are interested, here also the (small) CSS : http://helltgivre.free.fr/elements/hexmap/svg.css
That map looks boring. I mean it has only one terrain, snow, and all hexes are empty. I think we need to make it more exciting.


Seriously though.. I can see the huge potential. Simply put, it's perfect. I was hoping to have some kind of hover effect because it's the fastest way to get the information you need. The less clicking, the better.

To get the project moving forward, I am now officially making SVG our map technology of choice. "Coding Wars" are now over. I would like to thank everyone who participated by posting suggestions and their custom made map codes. Unfortunately we can only pick one. Hopefully you guys didn't waste too much time, and if you did, I hope you at least had fun doing so (or learned something useful in the process).


The map project will now be moved to private forums to avoid ruining the surprise. It will still be visible to all WoE Organizers, but others will have to wait for beta.

Planplan will be in charge of the technical production of the map. He may do it solo, or with a team, whatever works best. So Planplan, just let me know how you want to do it, and how non-coders can maybe help you with the process.

And even if you don't make it to the map coding team, don't worry, there will probably be other coding jobs available very soon.


Now lets form a line and slowly walk to the private forums, letting this topic die in peace. Thank you.

homoaddictus

  • Guest
Re: Coding: How to make the map? https://elementscommunity.org/forum/index.php?topic=9317.msg213477#msg213477
« Reply #54 on: November 30, 2010, 08:57:26 am »
@Planplan I would love to see those deck generator codes myself. :D


@All The sample was really just barebones and was just to show that Flash can maintain its ease of customization without making the swf file too large. I was planning to make the data come out when you hover instead of clicking on it and of course some animation to go with it. As Planplan pointed out, XML generated from a database would surely be the best option to use for data in the final design. Since it's already decided, I'm scrapping the flash idea and will wait anxiously for the completed svg map. And we all know that with Planplan making it, the final map is sure to be epic :)

 

blarg: