Lire une bande dessinée, chouette ! Sur un écran de téléphone, un peu moins.
Kumiko est un petit outil qui détecte les cases sur une page de bande dessinée, et fournit ces informations à un lecteur « case par case ». Plus besoin de zoomer à la main pour lire les bulles.
Vous voulez voir, essayer ?
xkcd, par Randall Munroe, #208 — CC BY‑NC 2.5.
Des exemples sont proposés sur le site de démo, essayez de lire xkcd ou Pepper&Carott case par case !
Essayez aussi d’envoyer vos propres images pour voir comment Kumiko s’en sort.
Le projet, sous licence AGPL, est codé en Python et fait bon usage de la bibliothèque de reconnaissance d’images OpenCV, pour l’instant principalement pour la détection de contours. Le lecteur case par case est basé sur du JavaScript dans le navigateur.
Au fur et à mesure, des modèles de pages existants sont ajoutés pour servir de tests de non‑régression. Kumiko pourra ainsi découper proprement toujours plus de cases.
Au plaisir de vos retours sur ce projet !
Aller plus loin
- Site de démo (660 clics)
- Informations et code source (136 clics)
- Modèles de pages de BD (121 clics)
# hummpfff
Posté par Psychofox (Mastodon) . Évalué à 5.
C'est rigolo mais c'est un peu nier l'importance des ellipses dans la bande dessinée.
[^] # Re: hummpfff
Posté par nicooo . Évalué à 1.
Hello,
Je ne savais pas ce qu'était l'ellipse en BD, donc j'ai jeté un œil.
Tu veux dire que parce qu'on ne lit qu'une case à la fois, on s'imagine moins bien ce qui passe entre les cases ?
[^] # Re: hummpfff
Posté par Ysabeau 🧶 (site web personnel, Mastodon) . Évalué à 8.
Il peut y avoir un effet comique qu'on perd du coup par exemple.
Sans parler du fait que la répartition des cases dans l'espace peut être importante, si on lit case par case, on perd cet effet, voire on perd du sens. Gotlib, s'en servait dans ses Rubriques à brac par exemple, notamment celle sur la girafe. On perd aussi ce qui peut être dans les marges.
« Tak ne veut pas quʼon pense à lui, il veut quʼon pense », Terry Pratchett, Déraillé.
[^] # Re: hummpfff
Posté par nicooo . Évalué à 5.
Je suis bien d'accord avec vous deux ! L'idéal reste de voir les pages une à une telles qu'elles ont été pensées et organisées. Et pour ma part, en version papier. :)
Les auteur.ices de BD ne manquent pas d'imagination pour leurs structures de pages, et on ne va pas leur en vouloir.
Pour ce qui est des marges, c'est effectivement un point d'amélioration. Pour le moment Kumiko a tendance à exclure tout ce qui n'est pas une case (lettrage en marge découpé en autant de lettres, ignorées car trop petites).
[^] # Re: hummpfff
Posté par Ysabeau 🧶 (site web personnel, Mastodon) . Évalué à 4. Dernière modification le 17 décembre 2020 à 14:42.
Je pense que l'outil est surtout fait pour du "cartoon" américain.
On pourrait, par exemple, aussi l'utiliser à des fins ludiques ou pédagogiques avec des "bd" faites uniquement pour le téléphone mobile :
Principe à affiner.
« Tak ne veut pas quʼon pense à lui, il veut quʼon pense », Terry Pratchett, Déraillé.
[^] # Re: hummpfff
Posté par nicooo . Évalué à 3.
C'est une fort bonne idée, merci !
Il faudrait alors avoir un mode d'affichage "case seule" pour éviter que le ratio de l'écran ne permette de voir un bout de case suivante, et donc de réponse :)
[^] # Re: hummpfff
Posté par Letho . Évalué à 10.
Je plussoie énergiquement.
Par exemple l'excellente (vraiment) BD « Imbattable » base tout son effet comique dessus. C'est un super héros qui joue du fait de pouvoir agir entre les différentes cases, ce qui brise autant la temporalité que le quatrième mur. Difficile de l'adapter à un écran de mobile, donc ;)
https://www.dupuis.com/imbattable/bd/imbattable-tome-1-justice-et-legumes-frais/70978
Mais l'outil reste chouette, ceci dit.
[^] # Re: hummpfff
Posté par nicooo . Évalué à 2.
Merci pour l'exemple d'Imbattable, à tester !
Note que si deux cases sont reliées par un élément graphique d'une certaine taille (pas juste un filet entre deux bulles par exemple), les deux cases sont détectées comme une seule, ce qui permet de visualiser le tout correctement.
[^] # Re: hummpfff
Posté par Letho . Évalué à 5.
Le truc, c'est que pour Imbattable, l'unité de lecture est vraiment la page.
Pour un exemple assez frappant, tu peux aller regarder les quelques pages disponibles sur le lien que j'ai posté : il y a un strip où le héros retrouve un tableau volé, et le fait remonter ligne par ligne du bas vers le haut de la page.
Du point de vue des autres personnages, qui au contraire du héros n'ont pas conscience d'être dans une bande-dessinée, le tableau est rendu avant d'avoir été retrouvé.
Après, j'ai bien conscience qu'il s'agit du corner-case par excellence ;)
[^] # Re: hummpfff
Posté par nicooo . Évalué à 2.
Ah oui chouette exemple. Effectivement ça va être compliqué :)
[^] # Re: hummpfff
Posté par tao popus . Évalué à 9.
Fred, jouait énormément sur les cases et la page, notamment dans la bande dessinée Philémon ( années 60 à 80). Des bons exemples sont l'album « le Naufragé du A » (1968) ou « Simbabbad de Batbad » (1970). Les pages sont roulées avec leur cases, certaines sont en relief, le personnage passe d'une case à l'autre, etc…
Dans « Little Nemo in Slumberland » (1905) de winsor McCay, il y avait déjà des jeux avec les cases, notamment des cases rondes, ou une case encastrée dans une autre.
Tout ce qui est autour de l'OuBaPo ou encore Chris Ware, sont beaucoup de jeux de torsions des règles des BD. L'association propose des jeux dans le style de l'OuBaPo, (l'OuLiPo faisait aussi ça) où l'on crée des BD à partir de cases sur des planchettes séparées tirées au hazrd entre autre, mais on sort complétement du domaine de ce logiciel là .
[^] # Re: hummpfff
Posté par nicooo . Évalué à 2.
Merci pour tous ces exemples !
[^] # Re: hummpfff
Posté par Mathieu CLAUDEL (site web personnel) . Évalué à 6.
Un autre cas, qui est peut-être encore plus flagrant, car seul une version papier peut réellement être lue : la série des Julius Corentin Acquefacques dont un tome possède une case qui est un trou vers la case de la page suivante et précédente ou encore un tome qui se lit en mode "européen" et en mode "manga", …
[^] # Re: hummpfff
Posté par nicooo . Évalué à 2.
Génial ! En effet je vois pas de solution pour la case-trou ni pour le double sens de lecture :)
[^] # Re: hummpfff
Posté par Psychofox (Mastodon) . Évalué à 7. Dernière modification le 17 décembre 2020 à 17:01.
Le principe d'avoir des cases plus ou moins de tailles égales en BD, c'est justement pour l'auteur de pouvoir péter tout ça quand ça lui sent et qu'il veut exprimer quelque chose de différent. Ça peut se faire de diverses manières, changements de format, suppression du cadre, embriquement d'une case dans une autre, chevauchement, partie du dessin qui dépasse/sort d'une cas pour en chevaucher une autre…et j'en oublie sûrement.
Et dans les BD faites pour être lues en ligne on commence aussi à avoir des animations dans certaines case spécifiques voir entre des cases.
Ce qu'il se passe entre deux cases est parfois plus travaillé et important que les cases elles-mêmes.
C'est beaucoup mieux expliqué dans la BD L'Art Invisible de Scott McCloud (Understanding Comics - The invisible art en anglais) que je recommande chaudement.
[^] # Re: hummpfff
Posté par nicooo . Évalué à 3.
Yes, j'ai vu des BD au format numérique qui incluaient du son également, quand on arrive sur une certaine case. Sky is the limit.
Kumiko a une taille max (relative) pour ce qu'elle peut exclure entre deux cases. Si l'inter-case est bien rempli, les deux cases autour sont considérées et affichées comme une seule, permettant de voir entre les deux aussi.
[^] # Re: hummpfff
Posté par Wendigogo . Évalué à 5. Dernière modification le 17 décembre 2020 à 17:16.
Je me permets d'en remettre une couche dans ce fil de discussion :
Kumiko est une excellente idée mais il doit permettre de simplement "post-traiter" les découpages trouvés. Pour moi, cela implique les opérations suivantes :
- Modification de l'ordre de lecture des cases
- Redécoupage/fusion des cases trouvées
- Modification du niveau de zoom
- Ajout d'un délai pour passer aux cases suivantes automatiquement
Pour "Imbattable" par exemple, on pourrait imaginer une première lecture dans l'ordre chronologique, une seconde dans l'ordre du protagoniste principal (ou inversement) qui finirait sur la page entière. Plusieurs sens de lecture pourraient être proposés selon l'imagination des lecteurs etc.
La première partie de la vidéo de Ave!Comics illustre assez bien ce dont je parle : seoul_district_teaser.
Enfin, tu l'auras compris, ici je vois Kumiko comme un back-end, qui permettrait un pré-découpage servant de base, qu'il faudrait associer à un front-end pour permettre à un humain une "post-production" personnalisée, enregistrable et bien sûr partageable.
Enjoy !
[^] # Re: hummpfff
Posté par nicooo . Évalué à 6.
Bien d'accord !
On peut rêver, mais Kumiko ne saura probablement jamais tout faire parfaitement.
Cet outil de post-prod est dans la roadmap :)
[^] # Re: hummpfff
Posté par tao popus . Évalué à 4.
Je pense que tout ça doit être intégrable au format epub (de l'HTML5 avec toutes ses possibilités). Cela permettrait de le rendre utilisable avec une grande partie de lecteur epub et/ou dans un navigateur. Visiblement, la lecture de Kumiko passe déjà par un navigateur.
[^] # Re: hummpfff
Posté par nicooo . Évalué à 3.
Oui, la lecture se fait pour l'exemple dans le navigateur, avec un simple zoom sur chaque page, sur les cases successives.
Je ne connais pas bien epub mais ça vaudrait le coup de se pencher là-dessus, voir s'il y a déjà des fonctionnalités rendant possible la lecture case par case.
# Concept intéressant qui gagnerait beaucoup dans un lecteur complet
Posté par Uther Lightbringer . Évalué à 7.
J'aime beaucoup le principe. J’apprécie énormément que ça ne se contente pas d'afficher individuellement les cases les unes après les autres mais que ça déplace la vue sur la page complète : cela permet de ne pas faire disparaitre totalement la notion de cadrage. C'est bien de pouvoir alterner entre le mode page et case, mais l'IHM pour faire ça n'est pas pratique.
En fait l'idée gagnerait énormément intégrée dans un lecteur de BD complet pour tablette/téléphone. On aurait la possibilité de passer du mode case au mode page en pinçant/écartant deux doigts. Ça permettrait aussi de calculer les pages à venir pendant la lecture de la page en cours. En effet le temps de calcul et un peu long. S'il devait se produire à chaque page ça serait vite ennuyeux.
[^] # Re: Concept intéressant qui gagnerait beaucoup dans un lecteur complet
Posté par Wendigogo . Évalué à 5.
Ça me rappelle Ave!Comics qui intégrait une bibliothèque (au sens physique du terme) et un lecteur dynamique.
Le rendu était vraiment excellent et ça donnait "vie" aux pages.
L'inconvénient c'est que l'animation devait être faite à la main (je suppose au moins partiellement).
L'avantage c'est qu'elle n'était pas limitée à du case par case, ni à des format de cases particulier. Elle permettait aussi certains effets, comme afficher les bulles de contexte avant la case, ce qui mettait bien dans l'ambiance.
Bref, j'aurai adoré pouvoir faire ça sur les BDs de mon choix avec un frontend simple (je ne code qu'avec mes pieds).
J'espère que Kumiko permettra de reprendre les découpages et les modifier à terme. Car une automatisation de cette tâche de découpage est complexe et peut dégrader l'expérience de lecture, comme indiqué par les autres commentaires.
Pouvoir simplement définir un ordre de lecture des cases, un niveau de zoom par case et les fusionner/redécouper serait le top pour moi !
[^] # Re: Concept intéressant qui gagnerait beaucoup dans un lecteur complet
Posté par nicooo . Évalué à 3.
Yes, je pense qu'on va pas couper à cet outil d'édition ;)
[^] # Re: Concept intéressant qui gagnerait beaucoup dans un lecteur complet
Posté par Wendigogo . Évalué à 3.
Je me suis rappelé d'un article publié ici sur un outil de présentation dynamique : PAMPI.
Je ne sais pas s'il est possible de combiner les deux outils mais PAMPI utilise aussi Python comme langage de programmation et sort du HTML pour la visualisation.
Les possibilités sont très (trop probablement) évoluées pour une simple lecture de BD mais les différents effets auxquels j'avais pensés sont proposés. Il manque peut-être la possibilité de masquer une partie de l'image pour la faire apparaitre mais c'est peut-être aussi disponible.
Mes 0.02 cents.
[^] # Re: Concept intéressant qui gagnerait beaucoup dans un lecteur complet
Posté par nicooo . Évalué à 2.
Merci pour ton commentaire chaleureux, ravi que ça te plaise !
L'IHM est en effet très sommaire et devait juste servir à montrer les possibilités de la découpe de cases. Elle n'a pas forcément vocation à devenir un lecteur très abouti (on aura noté que le design n'est pas mon fort :p).
Je pense comme toi que Kumiko fera mieux son job si c'est un lecteur déjà bien fonctionnel qui intègre le résultat des découpes.
Tu aurais des noms de lecteurs de BD sympas à qui soumettre cette idée ?
# nextcloud
Posté par yuhl . Évalué à 5.
J'adore l'idée !!! Purée ça déchire !
Encore bravo pour cette réalisation qui me laisse pantois.
Ce que je vois comme nouveau défi:
[^] # Re: nextcloud
Posté par nicooo . Évalué à 2.
Merci pour les louanges :p
Sur les idées point par point :
nextcloud paraît en effet être une bonne base de stockage pour les BD. Je pense pas me lancer tout de suite là-dedans par contre, ça a l'air d'être du taf.
Note que tu peux enregistrer les pages HTML produites par Kumiko, elles sont indépendantes du site de démo (+ deux fichiers js et un css qui devraient s'enregistrer avec la page). Et donc les visionner en local dans ton navigateur, voire les publier sur un site à toi. Mais tout le monde n'a pas un tel hébergement.
Merci pour ces deux recos de lecteurs, je vais les contacter !
Bonne idée aussi de définir un standard, ce serait canon d'ouvrir ton .cbz avec n'importe quel lecteur un peu (avancé) et d'avoir la lecture case par case intégrée !
[^] # Re: nextcloud
Posté par xavier philippon . Évalué à 3. Dernière modification le 19 décembre 2020 à 06:47.
Je m’apprêtais à poster quand j'ai vu ce post.
La lecture d'une BD sur un écran de petite taille est toujours un casse tête.
Définir et ajouter un méta fichier qui indique l'emplacement des cases à Kumiko me semble une super idée.
Il suffirait de l'intégrer aux CBZ ou de le déposer à côté des PDF et fichiers plus difficilement modifiables.
On pourrait définir le sens de lecture, des transitions entre les cases avec des vues globales quand c'est nécessaire.
# Un peu simpliste
Posté par wismerhill . Évalué à 5.
C'est bien, mais c'est un peu basique.
Ça ne fonctionne que si le dessinateur fait des cases bien séparées et ne déborde pas (façon ligne claire de Hergé). Ce qui couvre une bonne partie de la production en bande dessinnée, mais tu va passer à côté des plus originales, où la page représente un tout.
Je vais prendre en exemple une webcomic que j'aime bien: https://unsoundedupdates.tumblr.com/
(attention spoiler, je vous recommande de le lire depuis le début 😉)
http://www.unsoundedcomic.com/comic/ch01/ch01_20.html
http://www.unsoundedcomic.com/comic/ch02/ch02_07.html
http://www.unsoundedcomic.com/comic/ch02/ch02_26.html
Et les hors-catégorie qui profitent du média web:
http://www.unsoundedcomic.com/comic/ch07/ch07_28.html (regardez les suivantes)
http://www.unsoundedcomic.com/comic/ch09/ch09_57.html
http://www.unsoundedcomic.com/comic/ch14/ch14_39.html (javascript nécessaire pour celle-ci)
[^] # Re: Un peu simpliste
Posté par nicooo . Évalué à 3. Dernière modification le 17 décembre 2020 à 20:44.
Kumiko avance à son propre rythme, un peu lambin pour une ninja si tu veux mon avis. :)
Merci pour les exemples d'unsoundedcomics.
La découpe a été améliorée pour ignorer les petits éléments graphiques entre les cases, afin de pouvoir les dissocier. Mais comme noté dans pas mal d'autres commentaires, il faut aussi veiller à ne pas trop les ignorer, car ils ont parfois toute leur importance !
C'est toute la difficulté du truc.
Je t'invite à jeter un œil aux améliorations récentes sur cet aspect : voici les "diffs visuels" des dernières versions concernées : v1.1 et v1.2.1.
Pour ce qui est des cases qui se chevauchent comme dans tes exemples, je pense qu'il faudra recourir à une détection de lignes dans l'image, quand la détection de contours ne suffit pas.
Plein d'idées pour la suite :)
[^] # Re: Un peu simpliste
Posté par Psychofox (Mastodon) . Évalué à 5.
Je viens de regarder cette partie, c'est quand même fâcheux de faire des transitions comme ça et d'obliger le lecteur à aller viser une flèche avec sa souris au lieu de pouvoir piloter avec les flèches de son clavier…
# Super idée
Posté par dtworld . Évalué à 3.
Même sur PC je suis pas fan ' mais bon il y a des BDs pas mal qui sont uniquement disponibles en ligne et pas en version papier.
J'aime beaucoup l'idée, par contre ça serait bien que ton soft fonctionne sur les autres types de background. Et ça doit pas être si compliqué (si ton background est plus ou moins uniforme bien sûr)… surtout que t’arrives déjà à automatiquement tout découper sur un background blanc, ce qui n'est pas si simple à faire (quand on a pas de notion de traitement d'images).
Bon courage pour la suite de ton projet !! :)
[^] # Re: Super idée
Posté par nicooo . Évalué à 2. Dernière modification le 19 décembre 2020 à 14:26.
Hello, et merci pour tes encouragements !
Je pense m'atteler prochainement à la détection de la couleur de fond, ce qui est en effet nécessaire dans certains cas (même minoritaires).
J'imagine bêtement prendre, en plus du blanc, la couleur du pixel {0,0} et voir le nombre de cases détectées en la considérant comme couleur de fond (et leur organisation dans l'espace, leur taille etc. pour voir si ça a du sens).
Si tu as des exemples n'hésite pas à les poster, je pourrai m'en servir pour tester !
[^] # Re: Super idée
Posté par dtworld . Évalué à 2.
Bonne idée =D ça devrait couvrir une bonne partie de cas !
Si tu as des exemples n'hésite pas à les poster, je pourrai m'en servir pour tester !
Je te laisse intégrer l'image suivante dans tes tests : https://www.drugsandwires.fail/wp-content/uploads/2015/03/page0003colour2.jpg. A mon avis t'as pas à trop modifier ton code pour que ça marche… et en même temps ça me semble pas être un cas si particulier que ça xD
[^] # Re: Super idée
Posté par nicooo . Évalué à 1.
Je viens de publier une détection basique pour les planches sur fond noir.
Ça marche pas mal pour Drugs & Wires ;)
# Question Triviale
Posté par Narmer . Évalué à 6.
Hello, vraiment je suis super content car un jour je m'étais dit ce serait bien qu'un outil me présente les case de mes mangas une à une ! Et toi tu l'as fait
Ma question est : est ce que ton algo fonctionne de droite à gauche comme les mangas?.
PS : D'ailleurs je suppose que le nom vient de la prononciation japonaise de comics ?
[^] # Re: Question Triviale
Posté par nicooo . Évalué à 4.
Content que ça plaise !
Je n'ai pas encore rajouté d'option pour numéroter les cases de droite à gauche pour le sens de lecture japonais, mais c'est prévu.
Ce sera fait très prochainement, avec une case à cocher sur le site de démo :)
[^] # Re: Question Triviale
Posté par nicooo . Évalué à 4.
C'est fait, testable sur le site de démo avec une case à cocher !
Et oui, Kumiko a été choisi à la fois pour la similitude phonétique avec "comic" prononcé à la japonaise, et avec "comic cutter" :)
[^] # Re: Question Triviale
Posté par Narmer . Évalué à 2.
Bravo nicooo pour l'implémentation éclair, je vais tester tout ça :) :)
Suivre le flux des commentaires
Note : les commentaires appartiennent à celles et ceux qui les ont postés. Nous n’en sommes pas responsables.