REMIX 08 Paris

Comme promis, voici mes notes du Remix 08 qui vient de se tenir aujourd'hui à Paris.

Plus exacement de la session "Soyez créateur de différences" adressée aux designers et développeurs. Le tout animé par Dick Lantim et d'autres intervenants.

Introduction

• Microsoft veut apporter sa valeur ajoutée sur :
• Expérience utilisateur : Silverlight 2, IE 8, Expression Studio
• Serveurs Web
• Services Web
• Monétisation : AdServer, …

L’outillage du créatif

Il y a 3 univers aujourd’hui : PC, Web et Mobile, interconnectés via Internet. Deux interfaces sont demandées:

RDA

Rich Desktop Application, avec de nouveaux besoins comme l’accès à une base locale, un déploiement et une mise à jour faciles.
Le RDA, chez Microsoft, c’est Windows Presentation Foundation. Ca tourne sur le Framework .NET et associe les designers et les développeurs au travers de Visual Studio et Expression.
Démonstration de quelques applications WPF.

RIA

Rich Internet Application. Réactif et facile à déployer, multi-navigateur.
D’un point de vue visuel et interactivité, on demande la même chose à RIA et RDA. Par contre Silverlight ne sait pas accéder à une base de données directement ou aux ressources système.
RIA pourrait même dire Riche Interactive Application grâce à WPF et Silverlight puisque l'on fait à peu près la même chose.
Microsoft vient d'annoncer la prochaine disponibilité de Silverlight sur mobiles: Windows Mobile et Symbian. Il y a donc unification des plateformes.

Disponibilités

.NET 3.5 et WPF sont disponibles
Silverlight 1 est disponible.
Expression Blend 2.5 est en preview et prend en charge Silverlight 2.

XAML est le langage qui permet aux développeurs et designers de s'interfacer. Les deux travaillent sur le même XAML de manière différente.

Démo: création d'une application Silverlight 2 avec Expression Blend 2.5. Ajout d'une vidéo en tant que fond de la TextBox (ce qu'il faut faire dans le XAML car Blend 2.5 ne sait pas encore prendre en charge une VisualBrush). Lancement de Visual Studio 2008 pour continuer le travail.

Silverlight est multi-plateforme

• IE, Firefox, Safari
• Windows, Macintosh et bientôt Linux (c'est Novell qui développe)
• Windows Mobile, Symbian S60 (prévus pour la fin de l'année).

L'installation du plugin se fait en un clic (avec redémarrage du navigateur pour Firefox). Des postes d'entreprise sans privilège peuvent installer le plugin si l'administrateur l'autorise (en une fois pour tout le réseau).
Le plugin est téléchargé à raison de 1.5 millions de téléchargements par jour.

Collaboration designer-développeur

Elle se fait grâce à:

• XAML
• Styles et templates
• DataBinding
• Même structure de projet entre Visual Studio et Expression Blend

Démo: création d'une apparence en tant que ListBox dans Expression Design, export en XAML (Canvas XAML WPF), ouverture dans Expression Blend. Ajout d'un fichier XML décrivant les produits. Une ListBox est créée dans Blend par databinding et l'on travaille sur son template pour obtenir ce qui avait été créé. La ListBox est complètement restylée, y compris la barre de défilement.

Manipulation d'objets 3D

Moteur 3D: oui en WPF, non en Silverlight.
Ce que l'on peut faire en Silverlight, c'est afficher des vidéos de 3D ou simuler la 3D par des transformations.
ZAM 3D (génération d'objets 3D manipulables en WPF) et Swift3D (génération de vidéos de scènes 3D utilisables en Silverlight)

Expression Encoder 2

C'est principalement le même que le 1, avec quelques améliorations.
Silverlight Streaming est une plateforme permettant de publier gratuitement 10 Go de contenu à streamer. On peut demander à publier notre vidéo sur Silverlight Streaming  directement depuis Expression Encoder. On obtient alors direcement le snippet HTML à insérer dans une page Web pour y placer la vidéo.

Deep zoom

Technologie rachetée par Microsoft et intégrée à Silverlight. Permet d'afficher une image énorme en zoomant dessus. Les pixels nécessaires sont chargés au fur et à mesure, comme sur les systèmes de cartographie actuellement en ligne.
L'outil "Deep Zoom Composer" permet de composer des images, puis d'exporter.
Un contrôle MultiScaleImage permet d'afficher l'image dans une application Silverlight.
Une option "connexion" lors de l'export permet de conserver des images indépendantes, et ainsi de les manipuler en JavaScript.
Cela peut aussi s'héberger sur Silverlight Streaming.

Indexation

Le problème des applications RIA comme celles créées avec Silverlight c'est qu'elles sont mal indexables, puisque les crawlers (web bots) ne voient que du texte.
Plusieurs solutions possibles:

• statique: transformer le XAML en HTML
• dynamique: détection du crawler, on lui fournit une page de liens générée pour lui, et on génère dynamiquement les pages correspondantes

L'ergonomie Web

On ne peut parler d'ergonomie que pour un utilisateur donné, à un instant t, pour un objectif donné.
Il est édifiant de voir comment des utilisateurs utilisent réellement des interfaces qui avaient été pensées pour être ergonomiques: ils utlisent les concepts qu'ils connaissent (mots cliquables, barre de navigation en haut, ...).

Plusieurs exemples d'étude d'ergonomie avec des réalisations Silverlight sont donnés:

• M6 Replay
• catalogue cdiscount. CDiscount génère grâce à Silverlight son catalogue dynamiquement à partir de sa base de données: le catalogue est ainsi synchrone avec la base, ce qui n'était pas le cas quand il était en Flash.
• Constellation pour la promotion de destinations de tourisme.

Nouveautés IE8

• Activities: permet d'associer des actions à une sélection sur la page. Il suffit d'ajouter un fichier GetMap.xml.
• WebSlices: récupération d'une partie d'information de page et affichage dans la barre des favoris. Cela permet la mémorisation rapide de l'information d'un site tiers. Pour le mettre en oeuvre il faut utiliser des noms de classes spéciaux dans le HTML de la page à rendre publiable en tant que WebSlice.