J’ai pu passer une journée au MTC (Microsoft Technical Center) pour une présentation de WPF (Windows Presentation Foundation) et Silverlight, par le biais d’une mise en application rapide de Blend, l’outil de création d’interfaces riches intégré à la suite Expression.
Petit tour d’horizon des outils Microsoft :
- Silverlight est un plug-in cross-platform qui permet de jouer des animations sur le web. Il se veut un concurrent direct de Flash sur le web, mais avec encore des parts de marché très faibles.
- WCF Windows Communication Foundation : des technos .NET d’infrastructure articulées autour des services web.
- WCS Windows Card Space (anciennement InfoCard) : composant de .NET3 qui vise à simplifier la gestion des identités et profils des utilisateurs sur le net. L’idée serait d’utiliser un seul et même profil pour tous services online nécessitant une authentification, allant des services publics aux services privés.
- WF Workflow Foundation : représente le modèle de programmation, le moteur et les outils permettant de créer des applications dotées de fonctionnalités de workflow sous Windows.
- WPF Windows Presentation Foundation est comparable à AIR d’Adobe (Adobe Integrated Runtime) puisqu’il permet de créer des applications de bureau, sauf qu’il n’est pas cross-platform : il ne crée que des applications pour Windows.
WPF est aussi là pour sortir WinForm du marché, malgré des entreprises récalcitrantes, car le passage de l’un à l’autre devrait entrainer des changements d’architecture conséquents d’après les témoignages de quelques développeurs .NET que j’ai pu rencontrer.
Il est d’ailleurs important de différencier la notion de RIA chez Microsoft et chez Adobe :
- Rich Internet Application chez Adobe
- Rich Interactive Application chez Microsoft
Si bien que WPF est une application RIA pour Microsoft mais pas pour Adobe, quand SilverLight et Flash permettent de faire des RIA pour les deux… voilà pourquoi la notion des uns et autres peut être subtile.
Avec cette palette d’outils, Microsoft n’avait pas vraiment prêté attention aux métiers du design avant ces deux dernières années. L’éditeur tente de se racheter en proposant Blend, bientôt dans sa version 3, qui se veut un outil destiné à la fois aux graphistes et aux développeurs (à qui on pourra toutefois conseiller de continuer à travailler sous Visual Studio pour manque de debugger sérieux par exemple). D’autres produits complémentaires sont disponibles :
- Expression Design présenté comme le compagnon de Blend. C’est un éditeur graphique qui nous a été présenté comme un Illustrator léger (donc de dessin vectoriel). Il permet bien sûr d’intégrer du bitmap et de réaliser des interfaces web, mais n’a pas été non plus annoncé comme un concurrent de Photoshop.
- Expression Encoder : qui permet d’utiliser la vidéo dans SilverLight et WPF, notamment en HD et aussi d’intégrer des modèles 3D directement depuis les fichiers natifs des gros logiciels du marché.
Preuve que Microsoft veut tirer partie des leçons du passé, il ne délaisse pas les concepteurs non plus en sortant prochainement SketchFlow sous la forme d’un module de Blend. SketchFlow est sensé intégrer réellement la phase de conception et de prototypage dans le flux de production. L’idée semble plutôt bonne si la réutilisation est possible, au contraire d’un soft comme Axure, très pratique, mais qui ne peut pas être intégré.
Une manière de travailler différente ?
Microsoft indique que grâce aux outils de sa suite Expression, développeurs et intégrateurs ne se marchent plus sur les pieds, mais au contraire, peuvent travailler de concert sur la même application et les mêmes éléments, révolutionnant ainsi la chaine de travail que l’on connait.
Malheureusement, je n’ai pas pu le tester car nous nous sommes concentrés surtout sur l’aspect créatif de l’outil en le comparant souvent à Flash.
Toutefois, il est certain que Visual Studio est bien intégré à Blend si bien qu’il est très facile de passer de l’un à l’autre. Contrairement à MXML sur Flex, XAML n’est orienté que vers la présentation, aucun code exécutable n’y est inséré, si bien que le designer n’intervient pas sur les mêmes fichiers que le développeur. Le designer doit par contre faire référence aux bons gestionnaire d’événements qui seront codés par le développeur.
Il est certain qu’Adobe ne communique pas aussi précisément sur les interactions designer/developper, mais cela ne signifie pas qu’il n’est pas possible de faire travailler ces deux profils en même temps sur le projet. On se souviendra en effet de la manière dont il est possible de faire travailler un développeur sur des fichiers .as et le designer sur les .fla en même temps grâce à la POO.
Blend
Ce qu’on peut dire au premier abord, c’est que l’interface ne répond pas aux codes visuels auxquels les graphistes sont habitués : tout l’environnement étant créé en vectoriel, les boutons, palettes et champs ont un aspect un peu plus grossier que dans Flash ou Photoshop par exemple.
L’ergonomie du produit est aussi complètement différente et nécessite une remise en question de ses habitudes de travail. C’est un outil à la fois de design et développement. On pourrait le comparer à un Flash « light » embarqué dans un Flex. La seule réponse d’Adobe à ce sujet est Flash Catalyst qui est attendu dans les prochains mois.
Après cette journée de prise en main, il m’apparait que Blend est plus un outil dédié à la création d’interfaces animées et conviviales qu’un produit concurrent de Flash. En effet, l’édition graphique est moins aisée (c’est aussi peut-être une question d’habitude, il est vrai) et il est impossible de faire de l’animation image par image. Tout est interpolation. D’ailleurs le storyboard (équivalent de la timeline) n’est visible qu’à la demande alors que c’est l’élément central sur Flash.
Dans ce contexte d’utilisation, on peut tout de même dire que Microsoft a étudié son sujet en proposant des raccourcis certains là où il faut systématiquement coder sous Flash, comme par exemple :
- centrage systématique de la scène en deux clics,
- placement des éléments en automatique : leurs dimensions seront calculées en fonction de la place restante dans leur colonne d’appartenance,
- création de colonne et rangée sur la scène pour définir le comportement des éléments s’y trouvant. C’est, entre autre, pour cette raison que Blend semble être un logiciel de mise en page.
L’édition XAML est disponible à tout moment, un peu comme dans les éditeurs tels que DreamWeaver où l’on peut avoir une vision wysiwyg et codée.
XAML est une formalisation du graphisme en plaçant les éléments dans l’espace et en décrivant leur propriétés graphiques (dégradé, forme, contour, …). A ce titre il est très différent de MXLM.
Cette petite journée m’a paru d’abord décevante, car je n’ai pas pu vérifier les allégations de Microsoft et je suis toujours impatient de découvrir de quelle manière ils font travailler des métiers si différents de concert. Toutefois, à travers Blend, j’ai pu constater que l’éditeur a tout de même pas mal réfléchi son produit.
De plus, l’arrivée d’autres modules comme SketchFlow ne ferait que resserrer les maillons de la chaine de production tout en permettant une intégration continue fluide. Rendez-vous donc prochainement pour vérifier de plus prêt.
Quelques exemples Silverlight en ligne
Xavier Maurin
29 mai 2009
Bonjour,
Merci pour cet article, très complet sur les framework PHP. Les exemples d’architecture viennent bien illustrer le propos.
Je voudrais réagir au sujet de votre article sur les technologies Microsoft et sa suite logicielle Expression.
Etant développeur WPF / Silverlight depuis 2 ans, je commence à avoir pas mal de recul sur la technologie et les outils mis à disposition.
Je ne suis pas d’accord avec votre analyse sur un certain nombre de points.
Silverlight est bien plus qu’un plug-in permettant de jouer des animations sur une page web. Il s’agit d’une technologie pour le developpement de Rich Internet Application. D’ailleurs, contrairement à ce que vous dites, Redmond fait bien le distingo Rich Desktop Application pour WPF et Rich Internet Application pour Silverlight.
La couche graphique de Silverlight est effectivement vectorielle et permet comme flash de réaliser du graphisme animé. Mais il est avant tout un framework permettant de concevoir des applications web, avec des librairies de widgets standards et étendues (cf. http://www.codeplex.com). Microsoft le positionne depuis sa version 2.0 et plus encore avec sa version 3.0 comme la technologie de développement d’applications LOB (Line Of Business). De plus en plus d’éditeurs sont en train de remplacer leurs clients ASP.NET (webforms) par des applications Silverlight. A noter aussi depuis la version 3.0 la présence du mode « Out Of Browser » qui permet de déployer l’application Silverlight sur le poste client et de l’exécuter en dehors du navigateur web, à l’instar d’Adobe AIR.
Le modèle de programmation de Silverlight est commun avec WPF et tend à s’en rapprocher de plus en plus avec la 3.0 : support de la 3D, databinding complet, dictionnaires de styles, etc.
Expression Blend est présenté (souvent à tort) comme un outil pour le graphiste (au sens « concepteur de la couche présentation de l’interface »), le développeur selon vous ayant tout intérêt à rester sous Visual Studio.
La réalité est toute autre… Expression Blend est un outil prévu pour la collaboration entre le designer graphique et le concepteur d’IHM. Le designer prend en charge toute la présentation des objets de l’interface (choix des couleurs, intégration d’icônes, animations…), le concepteur d’IHM doit lui assurer la structure de l’IHM (Layout des objets, Data binding = relation entre les objets graphiques et le modèle de données, etc.).
D’après mon expérience, dans un process de développement intégré graphiste/developpeur, le développeur a tout intérêt à travailler sous Blend. L’éditeur graphique XAML dans Visual Studio (non de code Cider) étant une catastrophe (reconnue par Redmond d’ailleurs). Ils ont d’ailleurs corrigé le tir dans Visual Studio 2010.
Expression Blend et Visual Studio fonctionnent parfaitement de concert, le développeur ouvre sa Solution .NET dans les deux applications et peut basculer allègrement de l’une à l’autre.
Je ne saurais donc que trop conseiller à un développeur de concevoir son IHM sous Expression Blend et de développer le code-behind sous Visual Studio. Et bien sûr, le debug se fait sous Visual Studio, pour mettre des points d’arrêt dans le code, debugguer en pas à pas, etc.
Enfin, SketchFlow est un outil très prometteur qui permet de travailler en mode « studio » de manière très intégrée et de faire intervenir sur un outil commun des profils de graphiste, ergonome et développeur. C’est un outil très précieux notamment en UCD (Conception Centrée Utilisateur).
Xavier MAURIN
Yan Paquis
29 mai 2009
Merci pour toutes ces précisions Xavier qui viennent plus que compléter cette journée de premier contact avec Blend.
Lors de cette journée, nous n’avons malheureusement pas pu avoir accès à toutes ces informations et notamment aux possibilités de collaboration entre développeurs, ergonomes et graphistes par exemple. C’est pourquoi ce billet peut vous paraitre aussi incomplet, voir erroné. Il s’agit bien d’une première impression suite à une journée sur laquelle nous nous sommes concentrés sur les fonctionnalités de design et où les autres points, notamment le développement et le partage des tâches ont été mentionnés.
En ce sens, le ressenti est donc plus un comparatif entre Flash/Flex et Blend. J’ai eu le sentiment qu’on retrouve un peu des deux dans Blend, mais sans pouvoir réellement juger de l’intérêt complet au niveau de la chaine de production. Bien au contraire, en temps qu’ancien flasher, je fus même déçu de ne pas retrouver certaines possibilités d’animations offertes par flash (image par image et dégradé de forme par exemple) et de ne pas en trouver de nouvelles.
Et concernant SketchFlow, il n’a été qu’évoqué. Le discours de présentation était certes fort alléchant, mais sans l’avoir vu fonctionner, je ne peux que me poser la question de sa réelle puissance (mais ne demande qu’à en être convaincu :) )
Un double merci donc pour ces précisions.
Yan
Etiennesdg
1 juin 2009
Bonjour,
Merci pour avoir cité mon portfolio! j’attend avec impatiente silverlight 3 pour le mètre à jour et ajouter des fonctionalités. j’ai décidé que je ne testerai pas la beta par manque de temp.
a+