L’histoire de l’application InkEdit et de l’initiative ‘Web Ink’

| 2 commentaires

Philippe Majerus est un ancien Microsoft MVP spécialisé dans les Windows Mobile et Tablet PC qui par le passé m’avait beaucoup suivi et aidé dans la compréhension des Technologie Tablet PC. Aujourd’hui, j’aimerais vous présenter une de ses initiative nommée InkPaint, l’historique de sa construction, comment les technologie de l’encre numérique (Windows Ink) désormais consolidées et exposées dans la Mise à jour anniversaire de Windows 10 peuvent être une réelle alternative à l’interaction au sein d’un matériel Windows.

Un peu d’Histoire ou plutôt d’historique

Philippe Majerus programme depuis la fin des années 80. Au départ sur Commodore 64/128 et ensuite sur PC MS-DOS et Windows. Il a toujours eu un intérêt pour les nouvelles technologies. Il a plongé dans le web dès le milieu des années 90, avec le scripting côté client en Dynamic HTML et ActiveX, et, dès 1996, côté serveur avec les Active Server Pages (ASP Classic). Puis passé aux technologies mobiles et embarquées, et retourné à la programmation native, mais cette fois sur Pocket PC / Windows CE dès le début des années 2000.

Spécialisé dans les versions de Windows pour appareils mobiles, lorsque fin 2002, Microsoft lança, avec quelques fabricants d’ordinateurs portables, Windows XP Tablet PC Edition. Cette version de Windows NT, développée spécialement pour les ordinateurs au format tablette avec stylet, apportait plusieurs nouveautés pour l’informatique mobile et le début des interfaces naturelles…

Ayant été chargé de préparer et présenter les premiers séminaires pour développeurs Tablet PC pour Microsoft EMEA, Il a eu la  la chance de pouvoir prendre le temps d’apprendre à fond les possibilités de cette nouvelle plateforme. Les écrans tactiles n’étaient pas encore aussi confortables que ceux d’aujourd’hui (résistifs et non capacitifs), et les Tablet PCs ciblaient avant tout le marché des professionnels mobiles, pas seulement à l’extérieur, mais aussi dans les bureaux – les « corridor warriors », qui passent une bonne partie de leurs journées en réunion, ou les médecins en hôpital qui passent d’une chambre à une autre.
La majeure partie des améliorations étaient tournées sur la prise de notes et le remplissage de formulaires, à l’époque encore exclusivement fait sur papier. Les Tablet PCs proposaient la première interface naturelle avant l’heure : écrire au stylo sur un écran. La plus importante des nouveautés de cette version était la standardisation d’un format d’encre numérique.

Digital Ink

Windows XP Tablet PC Edition n’était pas le premier système informatique à supporter l’écriture manuscrite, Windows for Pen Computing 1.0 apportait déjà les bases de l’écriture manuscrite et reconnaissance d’écriture pour Windows 3.1 dès 1992, et Windows for Pen Computing 2.0, pour Windows 95.

La nouveauté de cette 3ème génération était qu’au lieu de capturer les mouvements du stylet pour en faire une image, et ensuite utiliser cette image pour systématiquement convertir l’écriture manuscrite en texte dactylographié, cette version redonnait à l’écriture manuscrite ses lettres de noblesse. Tout comme les formats ASCII et Unicode permirent au texte dactylographié d’être standardisé et transportable d’une application à l’autre et d’un système informatique à l’autre, le nouveau format d’encre numérique permit au texte manuscrit d’être standardisé.
Capturée et conservée sous forme d’historique des déplacements du stylo, l’encre peut ensuite être convertie de manière bien plus fiable si l’objectif final est du texte dactylographié, mais ce format permet surtout d’afficher et de traiter l’encre telle quelle dans toutes les applications voulant supporter le format manuscrit.

Enfin la capture d’encre numérique n’était plus une simple étape vers le texte dactylographié pour compenser l’absence d’un clavier, ou produire une image, mais pouvait être une finalité en soi. Une application de bloc-notes pouvait fonctionner comme un vrai bloc-notes, conservant des notes prises à la main, des croquis, etc… tout en permettant de rechercher dans ses notes, de copier/coller des phrases d’une application à une autre, et de les partager par le réseau informatique.

Les premiers appareils des fabricants partenaires utilisaient tous des capteurs Wacom pour le stylo. Les Tablet PCs avec technologie Wacom Penabled furent en quelque sorte les ancêtres des Cintiq Companion – des tablettes pures ou des portables convertibles avec une tablette graphique haut de gamme intégrée dans l’écran. Cela n’est bien évidemment pas passé inaperçu auprès des amis graphistes et artistes, et tous se sont essayés à dessiner sur les modèles dont Philippe disposait pour tester le kit de développement.

Convaincu que l’avenir de l’ordinateur personnel était une machine hybride polyvalente, utilisable au clavier et à la souris, au stylo comme les Tablet PCs, et plus tard en tactile comme les Pocket PCs, ses ordinateurs portables à partir de cette année ont toujours été des Tablet PC convertibles, et l’idée de traiter l’écriture manuscrite en tant que telle est devenue une considération pour tout logiciel.

Courant 2005, il avait déjà essayé de pousser le support de l’encre numérique sur le Web en ajoutant le support pour des billets manuscrits dans son blog personnel. Le code côté serveur était capable de traiter le format d’encre numérique, tel que changer la couleur de mots suite à une recherche de l’utilisateur, et afficher le texte dans la page Web en VML ou en GIF selon le navigateur. Malheureusement les composants système Tablet PC n’étaient pas prévus pour fonctionner dans le contexte d’un serveur Web, et si le concept était réussi et même fonctionnel, les problèmes de gestion de ressources sur le serveur rendaient son utilisation pratiquement impossible.

Web Ink

En discutant avec Axelle Bouet sur les possibilités des technologies de communications unifiées (téléphonie, visioconférences, présentation et partage d’applications) pour son activité, ils ont évoqué la possibilité de faire des sessions de dédicace en direct. Les technologies WebRTC qui rendront possible de véritables sessions de collaboration en ligne sans plug-in étant encore peu disponibles, cela a relancé l’idée de supporter l’encre numérique sur le Web, cette fois pour présenter des dessins en « replay ».

Philippe a réalisé un petit test pour voir si cela était possible proprement avec les technologies actuelles, et il a donc reprogrammé d’une part un petit logiciel pour enregistrer l’encre, et d’autre part le support de l’encre numérique côté serveur Web. Cette fois le format vectoriel propriétaire de Internet Explorer de l’époque a laissé place au SVG, et il n’a pas utilisé les composants Tablet PC qui provoquaient des problèmes lorsqu’ils étaient utilisés dans une application Web.

Il a donc programmé un contrôle ASP.net, InkPresenter, capable d’afficher l’encre dans une page HTML. Une application Web est alors capable de contrôler tous les aspects de l’encre numérique dans son format standardisé par le Tablet PC, et de générer le code HTML+SVG pour l’afficher dans une page Web.

Pouvoir afficher de l’encre en vectoriel est un bon début, encore faut-il avoir de l’encre à afficher. Or tous les programmes de dessins classiques capturent les mouvements du stylo pour en faire soit des images bitmaps, soit des vecteurs. Il nous fallait capturer un dessin en encre numérique et il n’y avait pas d’outil disponible pour cela.

La petite application de capture d’encre appelée InkPad leur avait permis de valider l’ensemble du système – de la capture de l’encre avec rendu en temps réel pour dessiner confortablement, jusqu’à son affichage sur un site Web.

L’ensemble fonctionnait plutôt bien, et le fait de conserver le dessin en format encre numérique jusque sur le serveur Web permettait déjà de l’afficher en vectoriel et de le transformer en PNG pour permettre le téléchargement des dessins par les visiteurs.

Le format d’encre numérique conservant non pas le rendu visuel, mais les informations de mouvement du stylo, l’ajout d’animation pour montrer l’évolution du dessin fut comparativement triviale. En plus de générer les éléments SVG représentants les tracés, il a suffi de contrôler leur affichage dans le navigateur via Javascript et CSS avec des animations basées sur l’ordre et la vitesse des tracés.

Ce qui se voulait être juste un test de faisabilité d’affichage d’encre numérique sur le web avec les technologies modernes était finalement devenu un système complet d’affichage et de « replay ».

Les contrôles InkPresenter et AnimatedInkPresenter pour ASP.net apportent donc la possibilité d’intégrer des dessins en encre numérique et des animations de leur élaboration directement sur des pages web.

InkPad était en fait plus limité dans les outils de dessin qu’il proposait que ce que InkPresenter et AnimatedInkPresenter supportaient… Il nous fallait à présent un outil de dessin un peu plus élaboré…

psychee01

InkEdit

InkPad avait permis de tester la collecte de tracés depuis une tablette Wacom, mais sans aucun contrôle sur l’épaisseur des traits, leurs couleurs, la gestion de la pression du stylo, etc… Il fallait un logiciel pour qu’Axelle puisse dessiner sur une tablette graphique et conserver le dessin dans son format d’encre numérique.

InkEdit débuta donc comme remplacement de InkPad pour le dessin, l’objectif était de faire une petite application très simple à utiliser, à l’interface proche de celle de Windows Paint pour pouvoir être immédiatement utilisable par tous, et n’exposant que les propriétés de l’encre supportées par tous les logiciels compatibles avec l’écriture manuscrite, tels que Microsoft OneNote et Word.

InkEdit se base entièrement sur le format de l’encre, il est capable d’ouvrir et d’enregistrer des fichiers .isf (Ink Serialized Format) qui n’est autre que le format de persistance portable de l’encre numérique. Le logiciel supporte également le copier/coller et le glisser/déplacer avec les autres programmes compatibles avec l’écriture manuscrite.

Côté outils, la version actuelle propose simplement de sélectionner parmi les 3 outils de base – gomme, stylo et surligneur (qui n’est pas très utile pour le dessin, mais a un statut particulier dans l’encre numérique) – et permet de modifier l’épaisseur du trait, sa sensibilité à la pression, sa couleur, et sa transparence.

Il est possible de faire un outil plus évolué pour le dessin en encre numérique, mais InkEdit nous permet déjà de compléter la chaîne. Les dessins sont élaborés et conservés en format encre numérique de la pointe du stylo sur la tablette jusque dans la page Web, et offrent déjà une expérience nouvelle pour les visiteurs du site.
Et cela ouvre déjà la porte à d’autres possibilités à expérimenter, telles que envoyer l’encre directement au fil de sa capture depuis InkEdit au serveur web et ensuite aux navigateurs pour afficher l’élaboration d’un dessin en direct… les prémices de Live Ink.

inkedit

InkEdit devient en fait InkPaint (UWP)

Après avoir passé en revue les différentes plateformes Ink depuis le Tablet PC pour tester les fonctionnalités et compatibilités entre elles, les essais logiciels sont les suivants:

  • InkPad est un mini éditeur utilisant les composants WinXP Tablet PC Edition,
  • InkEdit est un petit logiciel de dessin de bureau en .NET framework utilisant les classes ink d’Avalon/WPF,
  • InkPaint est un programme de dessin en Windows 10 Utilisant l’interface Moderne utilisant les classes ink de Universal Windows Platform.

De ce fait, Inkpaint est désormais le logiciel débouchant sur les travaux de l’écriture numérique de Philippe MAJERUS et de son transport au sein de technologies web

  • InkPaint est une appli UWP de dessin en Windows Ink actuellement en Preview, la version actuelle est compatible avec toutes les versions de Windows 10 depuis Threshold 1 jusqu’à Redstone 1, mais l’objectif est bien entendu de rapidement ajouter les nouvelles fonctionnalités crayon et règle de Redstone1 (tout en conservant une version compatible Threshold 1-2 pour ceux qui n’auront pas mis à jour).
  • C’est encore une toute première preview et pas encore satisfaisante pour une distribution ouverte au public, mais déjà utilisable et avec quelques fonctionnalités non disponibles dans les autres applications UWP similaires.
    • Ouverture et enregistrement des fichiers Windows Ink natifs (ISF / .wnk)
    • Exportation en PNG avec transparence, mais surtout en SVG pour affichage vectoriel sur le Web
    • Copier/Coller des traits d’encre compatible avec MS Office et les autres applis compatible Ink
    • Configuration avancés de pointes de stylo, y compris balance et angle
  • InkPaint fonctionnera à terme également sur téléphones Windows 10 Mobile, en tactile ou avec stylo le jour où Microsoft integrera sa technologie PixelSense dans ses téléphones. Il sera d’abord disponible sur Windows 10 Desktop (PCs, Tablets et convertibles), mais il fonctionne sur Windows Mobile, HoloLens, et Windows IoT… juste besoins d’adaptations ergonomiques de l’interface.
  • Voir Inkpaint sur le Windows Store (disponibilité imminente): https://www.microsoft.com/store/apps/9nblggh4vww6
  • Voir une présentation du logiciel sur majerus.net :  http://www.majerus.net/InkPaint/

inkpaint_uwp

Détails sur la publication Live ou  non sur un site web

Web Ink sont des classes ASP.net pour l’encre sur le Web, basé sur Avalon/WPF mais avec un rendu en SVG pour les pages Web, et avec des extensions spécifiques pour supporter les nouvelles fonctionnalités de déformation des pointes de stylo de l’encre UWP, et même déjà le rendu des traits de crayon de UWP qui arrivent dans la Anniversary Update de Windows 10 le 29 Juillet 2016.

Web Ink nécessite donc un  .NET framework complet, donc il n’est pas pas compatible ASP.net Core sur Linux ou autre: Windows Server est obligatoire pour l’instant. Bien que cela soit possible a long terme, Philippe n’utilise les classes d’Avalon/WPF que pour relire les données d’encre sérialisées ISF, si il réimplémente le parser, son code de rendu SVG pourrait devenir compatible .NET Core et donc portable sur autres serveurs.

Pour plus de détails, il est préférable de le contacter directement : http://www.majerus.net/Contact/

InkPaint sur Hololens (screenshot)

09AB450F-A3F2-4842-85C2-438DF0D049C7

 

2 Commentaires

  1. Merci pour ce topo. Je n’ai pas bien compris un truc : est-ce que cette technologie permet de capturer l’encre, depuis une page web et enregistrer la résultante comme sous OneNote ?

    • La capture d’encre sur une page Web sans plugin est encore problématique, les technologies Web sont bien loin des performances que DirectInk permet d’obtenir dans une application Windows locale.

      D’un côté, il y a une application locale pour la capture de l’encre, InkPaint, qui permet de profiter de plus de paramètres de personnalisation de l’encre que des applications orientées prise de note comme OneNote. L’application peut être utilisées toute seule, et fonctionne comme un programme de dessin pour l’encre numérique, avec des effets avancés pour la calligraphie et le dessin. Elle a simplement la particularité d’enregistrer ses fichiers en format Windows Ink au lieu d’un format propriétaire. Cette application est développée autour du format Windows Ink, et permet par ailleurs le copier/coller avec OneNote 2016 en conservant les traits sous forme d’encre.

      Coté Web, un site utilisant WebInk peut afficher l’encre dans des pages Web, directement depuis le format encre d’origine (pas d’exportation spécifique préalable coté client nécessaire). À nouveau, WebInk peut être utilisé indépendamment de InkPaint pour afficher de l’encre venant de n’importe quelle application, directement depuis la sérialisation binaire de Windows Ink (WISPINK/ISF).

      Par exemple, une application métier pour une société de livraison à domicile, qui utilise un contrôle de capture d’encre pour récolter les signatures des destinataires et les stocker dans une base de données (en encre numérique, pas convertie en image), peut utiliser WebInk pour afficher ces signatures sur les pages web de suivis des colis. L’encre est alors affichée en qualité vectorielle, bien meilleur que les conversions en images habituelles, et pouvant s’adapter dynamiquement aux diverses tailles d’écran.

      Un usage possible est bien évidemment de combiner les deux, en utilisant directement les fichiers enregistrés par InkPaint dans une page Web utilisant WebInk. Cela permet alors d’utiliser directement des textes manuscrits avec des effets calligraphiques, ou des dessins réalisés au crayon et encre, dessinés avec l’application InkPaint, et les afficher en qualité vectorielle sur un site web. Encore un fois, le résultat est alors bien meilleur que des dessins convertis en images, et parfait pour des illustrations redimensionnées dynamiquement.

      Comme WebInk est une technologie ASP.net utilisant le format Windows Ink, l’encre peut être traitée coté serveur avant son affichage, par exemple pour en modifier la couleur ou l’épaisseur pour mettre en surbrillance les mots correspondants à une recherche de l’utilisateur. Lors de son affichage dans une page Web, le rendu utilise le standard SVG, l’encre peut par conséquent également être manipulée par la page coté client via CSS et/ou JavaScript. Cela permet d’adapter l’encre à la charte graphique du site ou de faire des effets d’animation.

      Pour ce qui est de pouvoir capturer de l’encre depuis une page Web, j’ai un début de solution qui permet de récupérer du Windows Ink coté serveur, mais sans supporter ni tous les effets ni les performances de Windows Ink.

      Plus d’infos sur InkPaint et lien pour téléchargement : http://www.majerus.net/inkpaint/
      Pages de démo pour tester WebInk en affichant de l’encre à partir de fichiers Windows Ink : http://www.inkpaint.majerus.net/

Laisser un commentaire

Champs Requis *.


Social Media Auto Publish Powered By : XYZScripts.com