12-02-2017, 15:38:40
Bonjour, je reviens après quelques mois (cf : http://forum.primtux.fr/viewtopic.php?id=714) avec une version béta de mon éditeur Wysiwyg d'illustrations interactives.
Les objectifs derrière cet éditeur et son développement :
- créer des illustrations interactives avec toujours le même gabarit : une légende contenant des indices titrés et un descriptif pour une zone de l'illustration.
- permettre des zooms sur les zones décrites
- avoir un contenu responsive (vu que le contenu est pleinement vectoriel, pourquoi s'en priver)
- être simple d'utilisation et productif pour enrichir une illustration à vocation pédagogique.
- utilisation hors ligne et intégré dans une distribution via un paquet .deb
La version de démo (qui sera mise à jour à chaque incrément) est disponible ici : https://mothsart.github.io/labo/frontend...ctive_svg/
Ca fonctionne ainsi :
1. On glisse et on dépose (ou on choisi via son explorateur de fichiers) son fichier svg statique. (si possible sans animation et javascript)
On arrive sur une interface nous permettant d'éditer ce fichier.
Un exemple est disponible : https://mothsart.github.io/labo/frontend...nt.min.svg
2. On ajoute des indices dans la légende. Ces derniers s'affichent également sur notre illustration.
3. On les positionnes au gré de nos envies (en restant appuyé sur le clic gauche) sur l'indice à déplacer.
4. Chaque clic sur un indice ouvre une zone supplémentaire permettant d'attribuer une couleur, un titre, une description ainsi que le pourcentage de zoom.
5. L'accès au bouton "show" nous permet de visualiser le rendu final. (avec les animations sur les indices si le zoom a été paramètré).
6. Il est possible de changer l'odre de nos indices et d'en supprimer ainsi que de les afficher ou non. (pratique si l'on ne veut se concentrer que sur un éventail précis)
6. Le bouton save permet de convertir notre travail en un fichier html. (équivalent au mode "rendu")
7. Si l'on veut repartir d'une feuille blanche, il suffit de cliquer sur "Delete".
Le soft est encore a ses balbutiements mais j'ai besoin d'avoir des retours sur l'ergonomie afin de le stabiliser.
Evolution en vue d'une version 1.0 : peu de débordement afin de livrer dans 10 jours max (fin de mes vacances)
- changement ergonomique important : la zone d'édition au clic sur un indice ne sera plus en bas à droite mais disponible via une menu déroulant sur l'indice lui même.
(J'ai déjà chargé des amis de tester l'interface sans aide et le point bloquant se trouvait à ce niveau)
- affichage du titre et de la description sur le rendu.
- export potable
- I18n : un applicatif en français et anglais
- Une masse de bugs subtiles à résoudre pour un produit stable.
Evolution en vue d'une version 2.0 (rien n'est figé dans le marbre)
- Menu option :
- gérer avec précision les temps d'animation (zoom, apparition de la description)
- mode "rendu tuiles" : permet de voir d'un coup d'oeil l'aperçu après zoom de l'ensemble des indices.
- une vrai gestion de l'historique de modification et bouton "annuler" et "rétablir" (undo/redo).
- un format d'édition.
- des raccourcis clavier
- la création d'un nouvelle indice lui attribut une couleur par défaut (un random sur une liste de couleurs non présente)
- des vérifications
- réflexion sur un usage avec une interface tactile
Les objectifs derrière cet éditeur et son développement :
- créer des illustrations interactives avec toujours le même gabarit : une légende contenant des indices titrés et un descriptif pour une zone de l'illustration.
- permettre des zooms sur les zones décrites
- avoir un contenu responsive (vu que le contenu est pleinement vectoriel, pourquoi s'en priver)
- être simple d'utilisation et productif pour enrichir une illustration à vocation pédagogique.
- utilisation hors ligne et intégré dans une distribution via un paquet .deb
La version de démo (qui sera mise à jour à chaque incrément) est disponible ici : https://mothsart.github.io/labo/frontend...ctive_svg/
Ca fonctionne ainsi :
1. On glisse et on dépose (ou on choisi via son explorateur de fichiers) son fichier svg statique. (si possible sans animation et javascript)
On arrive sur une interface nous permettant d'éditer ce fichier.
Un exemple est disponible : https://mothsart.github.io/labo/frontend...nt.min.svg
2. On ajoute des indices dans la légende. Ces derniers s'affichent également sur notre illustration.
3. On les positionnes au gré de nos envies (en restant appuyé sur le clic gauche) sur l'indice à déplacer.
4. Chaque clic sur un indice ouvre une zone supplémentaire permettant d'attribuer une couleur, un titre, une description ainsi que le pourcentage de zoom.
5. L'accès au bouton "show" nous permet de visualiser le rendu final. (avec les animations sur les indices si le zoom a été paramètré).
6. Il est possible de changer l'odre de nos indices et d'en supprimer ainsi que de les afficher ou non. (pratique si l'on ne veut se concentrer que sur un éventail précis)
6. Le bouton save permet de convertir notre travail en un fichier html. (équivalent au mode "rendu")
7. Si l'on veut repartir d'une feuille blanche, il suffit de cliquer sur "Delete".
Le soft est encore a ses balbutiements mais j'ai besoin d'avoir des retours sur l'ergonomie afin de le stabiliser.
Evolution en vue d'une version 1.0 : peu de débordement afin de livrer dans 10 jours max (fin de mes vacances)
- changement ergonomique important : la zone d'édition au clic sur un indice ne sera plus en bas à droite mais disponible via une menu déroulant sur l'indice lui même.
(J'ai déjà chargé des amis de tester l'interface sans aide et le point bloquant se trouvait à ce niveau)
- affichage du titre et de la description sur le rendu.
- export potable
- I18n : un applicatif en français et anglais
- Une masse de bugs subtiles à résoudre pour un produit stable.
Evolution en vue d'une version 2.0 (rien n'est figé dans le marbre)
- Menu option :
- gérer avec précision les temps d'animation (zoom, apparition de la description)
- mode "rendu tuiles" : permet de voir d'un coup d'oeil l'aperçu après zoom de l'ensemble des indices.
- une vrai gestion de l'historique de modification et bouton "annuler" et "rétablir" (undo/redo).
- un format d'édition.
- des raccourcis clavier
- la création d'un nouvelle indice lui attribut une couleur par défaut (un random sur une liste de couleurs non présente)
- des vérifications
- réflexion sur un usage avec une interface tactile