[FAIT] [Storytelling] Créer un tuto animé et attractif pour Framabag

#1

Publié originellement sur: http://participer.framasoft.org/storytelling-creer-un-tuto-anime-et-attractif-pour-framabag/
Framabag est un outil qui permet de concerver des articles de blog et de les lire agréablement n’importe par la suite. Mais cette utilisation du web est peu connue. Il faudrait en mettre en scène les applications et la simplicité, afin d’aider les gens à s’emparer de cet outil libre.

Mission :

  1. Concevoir un tutoriel court et amusant pour donner envie d'utiliser Framabag
  2. le réaliser sous forme de diaporama, de BD ou d'animation vidéo.
  3. Réaliser le fruit de son labeur dans la joie et l'allégresse !

Prérequis

  • Rédactionnel, humour et storytelling
  • Bidouillage de diaporama, pdf ou captation d'écran.
[FAIT] [rédaction] Un article pour Framabag
#2

Je vais y jeter un oeil, car ce wallabag m’intrigue depuis un moment…
Par contre je ne suis pas un dieu du graphisme, je vais voir ce que je peux faire en diaporama…
Que ca n’empêche pas quelqu’un d’autre de regarder non plus, je mettrai mes avancées dans ce post pour éviter qu’on doublonne!

#3

Ben voilà, super ! Tu me dis quand tu fais des avancées :wink:

#4

Pour la petite info:

J’ai pu tester aujourd’hui Framabag, via le portail, l’appli Android et un Kindle. J’ai bien compris le principe, et ca tourne bien! :smile:
J’ai commencé à préparer un texte de présentation. J’ai la trame globale, il faut que je refasse une passe dessus (d’ici la semaine prochaine si tout se passe bien).
Mon idée pour l’instant est de partir plutôt en mode BD, en me basant sur Gégé. (oui parce que, il ne faut pas me filer un crayon pour dessiner, ca peut rendre aveugle… :dizzy_face: ). Soit en mode planche “classique”, soit en profitant de strut pour animer les transitions; ce n’est pas encore tranché (les idées sont les bienvenues).
Je partirais plutôt sur un dialogue entre deux personnages, un qui expliquerait à l’autre qui n’y connaît rien l’intérêt du framabag (en placant quelques blagounettes par ci par là).

Je fais un jet avec ca, je le publierai sur ce post quand j’ai pu le terminer. Je tiens au courant de la suite!

2 Likes
#5

Alors que ce soit en BD ou en strut.io, tout cela flaire bon de chez bon bon !
Utilise l’outil qui te va le mieux, on saura le mettre en valeur :wink:
Merci beaucoup à toi et il me tarde de voir tout cela !

#6

Hey, cool. Merci @Pyves pour ton aide.

Si t’as la moindre question sur Framabag / wallabag, n’hésite pas.

1 Like
#7

Merci @nicosomb pour la proposition, je n’hésiterai pas :smile:

Petit point sur mes avancées: Je me suis fait un “prototype” avec le GG. J’ai mis ce que j’ai fait ici pour vous donner une idée:
https://public.neverhood.fr/Framasoft/Prototype_Framabag_Presentation/#/
Je vais travailler un peu plus le dialogue au fur et à mesure, ajouter un ou deux screenshots/schémas simples et puis je verrai a animer un peu les dessins en utilisant strut.io.

J’ai un peu peur qu’il y ait trop de dialogue… Qu’en pensez-vous? n’hésitez pas à être critiques ou à proposer des variantes, j’en suis très friand et je ne mords pas! (tant que c’est constructif :wink: )

3 Likes
#8

Salut @Pyves ! Déjà, je trouve que c’est un beau travail et une super base pour avancer.
Comme tu le dis, je trouve pour l’instant que ça manque de screenshots (en mode “tu cliques ici, tu fais ça, et c’est tout-beau-tout-magique” )… Et certaines pages ont beaucoup de texte… mais je sais pas si c’est possible de synthétiser ou de diviser (histoire de pas être trop “verbeux” d’une part, mais surtout pour pouvoir inclure l’animation dans un blog et qu’elle y soit plus petite, donc lisible même si elle est pas en pleine page…)

M’enfin tout ça c’est du pinaillage.
Tu me dis si tu veux que j’essaie de me pencher plus précisément sur les textes à scinder ou synthétiser, je peux tenter de voir cela.

#9

même Windows Phone, c’est dire…

:stuck_out_tongue_winking_eye:

#10

@Pouhiou Merci de te proposer! Je devrais pouvoir m’en occuper : J’ai déjà pris des screenshots ce weekend, et j’ai déjà une idée du découpage des slides (les bulles des slides 4+5 devraient être éclatées dans plusieurs slides pour éviter de surcharger). J’espère trouver le bon équilibre entre nombre de slide et facilité de lecture :sweat_smile:

Je vais faire ca un de ces soirs ou vendredi, je tiens au courant. (Je me suis rendu compte hier que strut.io ne marchait pas sous mon Firefox sous Linux, allez savoir pourquoi… je vais faire ca sous windows du coup. :expressionless: )

@SpF : … :smirk:

1 Like
#11

Et maintenant, si on faisait le même … Mais en anglais ? :heart_eyes:

1 Like
#12

@nicosomb : carrément! :slight_smile: je vais voir à faire une version anglaise après si ca vous intéresse. (je suis pas bilingue natif, mais je m’en sors pas trop mal).
Pour d’autres langues, à part l’allemand ou le chinois où j’ai des notions… ca sera difficile pour moi :no_mouth:

2 Likes
#13

Anglais / Français et on couvre à mon avis 98% des besoins de Framabag ! En tout cas, super boulot <3

1 Like
#14

On en a parlé sur les listes emails de l’asso… @Pyves, tu as des fans ! Je crois qu’on va t’en demander d’autres, une fois que tu auras achevé celui-ci :wink:

#15

Ouhlala j’ai une de ces pressions du coup… :sweat_smile:
Pas de soucis pour en refaire, avec plaisir! Attendez quand même le résultat final pour vous décider, des fois que vous soyez décus, on sait jamais! ("ah ben Pyves… en fait non, finalement laisse tomber, on va demander à qqn d’autre… " :wink: )

Sinon j’en profite pour demander, à tout hasard: pour l’instant j’ai réalisé les bulles avec Gégé. Mais on part plutôt sur un outil de slides et qu’on parle de localisation, ca serait peut etre plus simple de mettre du vrai texte dans les bulles (plutôt que de devoir se retaper la retouche de l’image pour changer un mot). J’ai cherché un peu pour trouver la même police d’écriture que sur Gégé, sans trop de succès pour l’instant.
Est-ce autorisé/possible de récupérer quelquepart la police d’écriture du Gégé?
Merci!

#16

Des nouvelles du front!
J’ai refait une version plus aboutie:
https://public.neverhood.fr/Framasoft/Prototype_Framabag_Presentation_v2/#/
(le zip de la présentation est téléchargeable ici: https://public.neverhood.fr/Framasoft/Prototype_Framabag_Presentation_v2.zip )

Au menu: Je suis resté sur RevealJS au final, c’était plus pratique à manier que strut.io sur l’instant. j’ai rajouté des screenshots, des animations, des liens. A noter qu’il est possible de le mettre en slideshow automatique en changeant une variable dans le fichier.

je vais voir prochainement à faire une version anglaise aussi, je tiens au courant.
Comme la 1ere fois, n’hésitez pas à me faire des retours! :smile:

1 Like
#17

Perso je suis fan et n’ai rien à redire. Je fais passer à l’asso mais c’est juste foutrement génial, ton boulot (oui, je serai dithyrambique si je veux, parce que nom de Zeus, c’est de la belle ouvrage !)

Si tu as besoin d’aide pour l’anglais, tu me fais simplement un pad avec tes textes en français, et je peux le faire passer au groupe Framalang. En une aprèm/journée, ce devrait être bouclé :wink:

Bravo et encore merci, et je vais faire passer cela à l’asso, et si tu as envie d’en faire un autre après la version anglaise de celui ci : y’a déjà une demande sur le forum !

#18

Merci, je suis ému :sob:
Plus sérieusement sinon, j’ai déjà pu bosser la partie anglaise et elle est quasi finalisée, ca ira! (pour ce coup ci; je garde l’idée framalang en tout cas!)

En passant, pour le côté “easter egg”: J’ai mis les liens un peu partout (dont un à moitié caché :smirk: ) , quand je mentionne un site/service. il suffit de cliquer et on arrive dessus. @Pouhiou , cela t’a-t-il paru intuitif?

Encore une petite relecture et je dois pouvoir mettre la version multilingue à dispo mercredi soir. En petite bonus track, j’ai mis un bouton de switch pour la langue en JS (ca m’a permis de découvrir le langage en passant :kissing_smiling_eyes: ). Au besoin, on peut faire aussi un HTML francais, un HTML anglais.

Dernière question: Comment ca se passe au niveau licence pour le contenu produit par la communauté framasoft? On est d’accord pour la licence libre (j’espère :smiley: ) mais laquelle? Si je mets en CC0, CC-BY, en licence beerware, ou en WTFPL ca convient? (c’est pour mettre une mention dans les sources si nécessaire)

Voila voila… des nouvelles très vite du coup!

PS: je vais jeter un oeil à Framapack plus tard
PS2: (et hop, ni vu ni connu, j’en profite pour moissonner des badges :innocent: )

2 Likes
#19

Super boulot @Pyves :slight_smile: C’est classe !

Petite suggestion : changer de thème pour qu’il n’y ait pas de différences entre le fond des slides et le fond des images.
Par exemple, j’aime bien le thème white: dans le header, changer

href=“css/theme/black.css”

en

href=“css/theme/white.css”

#20

@Pyves : à par le lien semi-caché, c’est très intuitif, oui.
Pour la licence, on veut du contenu libre ou de libre diffusion (donc éviter le NC ou le ND).
Toutes les licences que tu mentionnes fonctionnent (et tu peux même mettre plusieurs licence), sachant que là c’est selon ton propre choix.

Merci encore moultes fois et pingues moi dès que le multilingue est prêt :wink: