De l’ergonomie aux bonnes méthodes de développement de vos applications Windows 8

12/02/2013

De l’ergonomie aux bonnes méthodes de développement de vos applications Windows 8Microsoft TechDays - Session du mardi 12 février 2013

ExpertisesDéveloppementMaintenance

ExpertisesInfogéranceTransformationMaintenance critique

BYOD & mobilitéCloudPortail & collaborationMise en production

Microsoft Tech.days 2013

SommaireOsiatis et Windows 8

Ergonomie et design

L’agilité gage de réussite

L’atelier de développement

O’MyBoard, Retour d’expérience

Fév. 2013P. 3

1

2

3

4

5

Microsoft Tech.days 2013Fév. 2013P. 4

1.Osiatis et Windows 8


Osiatis et Windows 8

Un engagement fort auprès de Microsoft

Osiatis intègre le cercleMicrosoft Apps Circle Windows 8…

1



Windows 8, de nouveaux concepts…

Une nouvelle conception de la navigation Interface Windows ex « Modern UI » Des règles de design et d’ergonomie imposées Zoom sémantique

L’intégration de l’application à l’OS Contrats de recherche, paramètres, « charm bar »

Un cœur commun aux systèmes W8 & WP8

1



O’MyBoard, un tableau virtuel 1


2.Ergonomie et design

Fév. 2013P. 8


Démarche « Mobile First »

Fév. 2013P. 9

Ergonomie et design

Le design mobile s’impose dans chaque projet

2



Fév. 2013P. 10

Ergonomie et design

Penser « mobile » Révolution des comportements, des habitudes

Reformatage des réflexes et des usages

Design mobile, une conception d’interfaces par l’usage

Conception / Développement & Design 2 métiers Osiatis a fait le choix de travailler avec des spécialistes du design :

2


Fév. 2013 Microsoft Tech.days 2013P. 11

Ergonomie et design

La révolution mobile et ses conséquences sur le design d’interface

Interface

Mobinaute

Contenus & Fonctionnalités Terminal mobile

3 Un Œil

Un Pouce

4 Less is More

1Du WIMPAu TOUCH

2L’objet & la Métaphore

2


Du WIMP au TOUCH

Fév. 2013P. 12

Ergonomie et design

L’interface homme machineWindows Icônes Menus Pointeurs

Tap Double Tap Drag Flick

2


Du WIMP au TOUCH

Fév. 2013P. 13

Ergonomie et design

L’interactivité avec le « métal »

Nouvelles possibilités GPS / Boussole Accéléromètre / Gyroscope Lumière ambiante Vidéo – Photo / double caméra (avant-arrière) Connexion avec d’autres appareils (bluetooth, airmedia…) Live tiles

2


L’objet et la métaphore

Fév. 2013P. 14

Ergonomie et design2


Un Œil / un pouce

Fév. 2013P. 15

Ergonomie et design

Mieux

Meilleur

OK

Mieux

Meilleur

OK

Mieux

L’usager dans ses environnements

2


Less is more

Fév. 2013P. 16

Ergonomie et design

Interface WindowsLe contenu au cœur de l’application

Synthétiser au maximum Les contenus Les fonctionnalités

2


3.L’agilité gage de réussite

Fév. 2013P. 17


Le manifeste Agile

Fév. 2013P. 18


Un style de développement itératif centré sur les personnes et mettant l’accent sur la satisfaction du client à travers l’intégration

continue d’un logiciel entièrement fonctionnel.

3



O’MyBoard, un outil interneObjectif Utiliser sur une tablette Windows 8 le tableau virtuel des post-its

permettant de suivre l’avancée du projet dans le cadre d’une démarche agile.

Gestion des projetsGestion des User StoriesGestion des SprintsGestion des tâchesGestion des ressourcesRecherche

Outil utilisé chez Osiatis pour le suivi des projets

3


Le design intégré en Méthode AgileUne itération Design ? NON : du Design dans chaque itération !

Fév. 2013P. 20

L’agilité gage de réussite3

Le designest une tâche


Le design intégré en Méthode Agile

Wire Frame + Story Board

Fév. 2013P. 21

L’agilité gage de réussite3



Wire Frame de la User Story« Création d’une nouvelle colonne »

3


Une étape indispensable

Même les applications les plus simples nécessitent un sketchingLes interactions avec l’utilisateur doivent être naturellesToutes les interactions doivent être prévues

Fév. 2013P. 23


Sketcher c’est prévoir, et prévoir c’est gérer…

3


4.L’atelier de développement

Fév. 2013P. 24


Microsoft Blend pour Visual Studio 2012Animation, Visual States, TransitionsStyles et GroupStylesTemplate editing, LayoutData BindingControl creationProperty editing

Fév. 2013P. 25

L'atelier de développement

Utilisez Blend pour concevoir des applications pour le Windows Store

4


Choix technologiques

Choix du langage et de l’architecture XAML/C# vs HTML5/CSS3/JS Framework MVVM

Séparation des responsabilités Architecture en couches

Code partagé (W8 / WP8) Code commun dans les « Portable libraries »

Fév. 2013P. 26


L’architecture et le respect des normes de développementGage de la qualité

4


HTML5 / CSS3 / Javascript

Fév. 2013P. 27


IntelliSense avancé dans Visual Studio Mode Debug Design dans Blend Prise en main rapide

Pour les développeurs Web

4


XAML / C#

Fév. 2013P. 28


Techno similaire aux développementsSilverlight, WPF, Windows Phone

Toute la puissance de .NetBinding, Attached et Dependency Properties,…

Architectures en couchesSéparation des responsabilitésPattern MVVM

Possibilité de partager du codeWindows 8 / Windows Phone 8API Cross Platform

4


5.O’MyBoard, retour d’expérience

Fév. 2013 Microsoft Tech.days 2013P. 30


Pour bien démarrer son projet Windows 8

Les questions clés ?

Cible Windows 8 RT et/ou Windows 8 Pro ?

Comment déployer / diffuser l’application ?

Quelle connexion avec le SI ?

Choix du langage et de l’architecture ?

5



Dans le respect des Guidelines pour les applications Windows Store

Les étapes franchies…

Drag & Drop dans ListView / GridView Persistance des données Base de démonstration initiale Contrat de recherche Prise de photos Les mentions légales La suite

SQLite, échanges de données sans fil, Back-office…

5



Centre de développement - applications du Windows Store

Recette, validation et déploiement sur le store

Chaque fin de sprint :Kit de certification pour le Windows Store– Corriger les erreurs éventuelles du rapport

Recette par les utilisateurs pilotes

Produire les descriptions, copies d’écrans et les mentions légales pour le Windows Store

Générer les packages pour les architectures ciblées Uploader les informations sur le site

5



Documents

De l’ergonomie aux bonnes méthodes de développement de vos applications Windows 8