Geckos - Un éditeur de cartes

47 réponses, 24241 vues



Geckos




http://www.github.com/gulix/geckos




 




Geckos est un éditeur de carte comme peut l'être Magic Set Editor : à partir d'un template, on peut créer une infinité de cartes reprenant un style identique. Et on peut bien sûr créer ses propres templates.




 


 




Geckos est un projet d'outil à destination des joueurs, que ce soit pour des cartes de profils, de sorts, de compétences, pour des jeux de figurines, de rôles, de plateau, voire même pour autre chose (cartes d'invitation, ...). Basé sur des technologies accessibles et open-source, il a pour objectif de l'être aussi (open-source et accessible).




 




Ayant beaucoup manipulé et trituré Magic Set Editor, j'en étais arrivé à découvrir quelques limites agaçantes, et une ergonomie pas toujours au top. Geckos est, en quelque sorte, ma réponse à ces limites. De plus, Geckos est 100% Web, et peut donc être utilisé depuis n'importe quelle machine disposant d'un navigateur moderne : ordinateur sous Windows, Linux, Mac, ChromeOS ou autre, Tablette voire même Smartphone !




 




Geckos travaille avec des templates. Ceux-ci permettent de définir les données qui définiront chaque carte, ainsi que la manière dont la carte va être générée. On charge / copie le code du template dans l'interface, et il ne reste plus qu'à ajouter les cartes et les éditer. Les images des cartes sont ensuite générées, et on peut les utiliser à notre convenance. Sachant que des exports évolués sont prévus (archives zip, documents pdf, ...). Il est bien sûr possible de sauver son travail pour le réutiliser plus tard.




 




Geckos est un produit très jeune, dont la première Alpha sort tout juste : https://github.com/Gulix/geckos/releases/tag/v0.0.1




 




Qu'est-ce que cela signifie ? Que les fonctionnalités de base, validant mon idée, fonctionnent. Ce n'est pas encore totalement exploitable, mais l'objectif de cette Alpha (et la suivante) est de mettre en place les fondations, pour ensuite s'étendre. Une béta bien plus complète verra ensuite le jour, avant que le produit final ne soit disponible. Mais le produit continuera à évoluer, au gré des besoins, des envies.




 




Le gros morceau des templates sera aussi la cible d'un gros travail. J'ai déjà prévu de passer mes templates pour Magic Set Editor sous Geckos. Et je serai ravi de voir de nouveaux templates pour d'autres jeux, d'aider à les concevoir voire de les faire. Geckos possèdera aussi un mode "jeu unique", qui permettra par exemple à un éditeur d'héberger une version de Geckos à l'image de son jeu, avec ses propres templates.




 




Bref, pleins de belles choses.




Pour que tout se concrétise, il faudra que le projet intéresse du monde bien sûr. Sur github, les Issues permettent de centraliser les demandes, les bugs, de répondre aux questions. Il ne faudra pas hésiter à l'utiliser pour pousser vos souhaits d'évolution favoris.




 




Vous êtes développeur et intéressé par le projet : c'est open-source, github peut vous permettre de développer vos évolutions et de les intégrer au projet.




Vous êtes designer et avez envie de faire des cartes : posez vos questions sur les méthodes de création des templates et aidez-moi à enrichir le wiki




Vous êtes anglophobe : le projet est prévu pour passer multilingue à plus ou moins court terme




Vous voulez tester le bouzin : http://gulix.github.io/geckos/




 


(Modification du message : 13-06-2016, 11:56 par Gulix.)

Ah tiens ca m’intéresse ca. Faut que je regarde de plus pres...


Je vais tester ça :)



N'hésitez pas à me remonter le moindre souci, ou la moindre interrogation.




J'ai prévu de faire un tuto ce weekend sur la création d'un template simple, de A à Z. Donc si je peux intégrer des trucs demandés dedans.



Alors ca mon cher Gulix, je te félicite 100 fois, je viens de dl et je vais tester, mais y a pas de exe? J'ai plein de template de cartes que j'ai fait pour tes tests.



Alors, non, il n'y a pas d'exe. C'est d'ailleurs le but : ne pas dépendre d'une plateforme (un exe fonctionnera généralement sous windows, mais quid de Linux, MacOs, ChromeOS ou les tablettes ?)




 




Pour les templates, n'hésite pas à les mettre à dispo. Il s'agit de code Json indiquant les champs à remplir, et comment est construite la carte. Pour cette dernière partie (la partie graphique), ça se base sur FabricJS. Ce qui marche avec ce framework marchera dans Geckos.




Il ne faut pas hésiter à partir du template existant pour expérimenter.




Le Wiki est aussi là pour guider, et va être étoffé au fur et à mesure de l'avancement du projet.




 




Pour ce qui est des templates, un répertoire va être créé dans l'arborescence du projet pour les stocker.



Bon je suis pas fan fan ^^ C'est plus le graphisme qui pêche à mon sens. Après je n'ai pas trop compris comment mettre une image et comment remplir la carte, par rapport à un Magic Set Editor très beau graphiquement et très intuitif. Le seul défaut de MSE c'est que je n'ai pas trouvé comment incorporer une image ailleurs que l'endroit prévu !


Citation :
il y a 37 minutes, LuciusForge a dit :




Bon je suis pas fan fan ^^ C'est plus le graphisme qui pêche à mon sens.




Le graphisme de la page en général, ou celui de la carte ? Pour la page en général, ce sera sans doute revu, mais j'ai pas de designer web sous la main pour l'instant (et je me concentre sur les fonctionnalités d'abord).




 




Pour la carte, je pars sur un modèle simple en démo de l'alpha, pour présenter un cas simple facile à dériver. Dans la partie supérieure (Template) se trouve tout le code décrivant la carte. En le modifiant, tu peux modifier le rendu de la carte (c'est d'ailleurs l'objectif).




 



Citation :
il y a 37 minutes, LuciusForge a dit :




Après je n'ai pas trop compris comment mettre une image et comment remplir la carte, par rapport à un Magic Set Editor très beau graphiquement et très intuitif.




Alors, en effet, je n'ai pas repris l'optique de Magic Set Editor de modifier directement sur l'image de la carte. Pourquoi ? Pour avoir plus de libertés (et parce que c'est vraiment coton aussi). Par exemple, en faisant une carte pour Warhammer Quest Silver Tower (ce que je suis en train de faire), tu peux définir un champ "Nombre d'armes", et faire en sorte que ça modifie en conséquence l'aspect de la carte. C'est plus propre d'avoir ce champ à côté (Editable Fields) qu'en combo quelque part sur la carte (je trouve).




 




Pour l'image, dans l'exemple, c'est le champ "Miniature's Image" qui gère ça. Tu charges une image, elle apparaît sur la carte.




 



Citation :
il y a 37 minutes, LuciusForge a dit :




Le seul défaut de MSE c'est que je n'ai pas trouvé comment incorporer une image ailleurs que l'endroit prévu !




En le poussant dans ses retranchements, il a bien plus de défauts que ça ^^. Mais il est aussi bien plus mûr comme produit.




 




Après, mettre une image ailleurs que prévu, ce n'est ni le but de Geckos, ni le but de Magic Set Editor. Ces programmes visent à rendre plus aisé la création de cartes personnalisées, sans utiliser de logiciel à la Photoshop. Donc c'est cadré, mais ça permet de garder une certaine homogénéité.




 




Pour Geckos, disons qu'une image du web t'intéresse, et que tu veux la mettre en bas à droite de la carte.




Rajoute ce code dans la section canvasFields du Template, entre l'accolade et le crochet fermant à la tout fin, après le "?isHealthDisplayed" :




 



Code :
{"type":"rect","width":330,"height":40,"left":5,"top":450,"fill":"#B1E29E","stroke":"#000000","visible":"?isHealthDisplayed"},
{"type":"image","width":50,"height": 50, "src": "https://upload.wikimedia.org/wikipedia/commons/d/d4/Gecko_de_la_Gomera_(Tarentola_gomerensis).JPG", "left":290,"top":450}



 




J'ai remis la ligne avec "?isHealthDisplayed" histoire de préciser où placer ce code. En gros, la deuxième ligne indique :




-> que je place une image de 50*50




-> la source de l'image (url ou dataurl)




-> sa position sur la carte




 




C'est assez simple, puisqu'on rajoute des blocs d'éléments sur le template. Mais toutes les cartes utilisant ce template auront cette image. Que tu peux bien sûr remplir avec une variable pour qu'elle soit modifiée par l'utilisateur.




 




Une fois le template modifié, il faut valider ses modifications avec le bouton SET.




 




Le Wiki reprendra pleins d'exemples et de tutos au fur et à mesure.


(Modification du message : 10-06-2016, 16:13 par Gulix.)


Oula je suis bien incapable de taper du code ^^ Pas grave j'ai réussi à faire ce que je voulais sous MSE :




 




[Image: Carnotaure.jpg][Image: Drak%25C3%25B4n.jpg]



[Image: Protoceratops.jpg][Image: Tric%25C3%25A9ratops.jpg]



[Image: B%25C3%25A9b%25C3%25A9%2BIguanodon.jpg][Image: B%25C3%25A9b%25C3%25A9%2BSpinosaurus.jpg]



Bonjour et bonne semaine !




Les Geckos ont travaillé ce week-end et produit un tutoriel complet pour concevoir une carte de A à Z : https://github.com/Gulix/geckos/wiki/Tutorial01

Le tutoriel est pour l'instant en anglais, mais il est prévu de le traduire.




 




@Lucius : C'est comme ça que j'ai mis la main dans la création de cartes via Magic Set Editor : utilisation des templates Magic basiques pour faire de cartes "Gormiti / Song of Blades & Heroes". Vois où ça m'a mené ^^.