Dot.Blog

C#, XAML, Xamarin, UWP/Android/iOS

Des ressources gratuites pour Windows Phone 7

[new:30/11/2011]Avec l’arrivée des Smartphones Nokia sous WP7, il est temps de ressortir les idées mises en attente ces derniers mois... WP7 devrait enfin décoller et connaitre le succès qu’il mérite. Sketcher, mocker prototyper des applications WP7 n’est pas toujours évident faute de bien maitriser ce format d’affichage un peu particulier. Mais justement, il s’agit là de préliminaires indispensables pour se rendre compte si tout est ok. Et si on s’aidait de quelques ressources gratuites pour mener à bien cette étape ?

Des ressources gratuites orientées prototypage

WP7 étant sorti il y a déjà quelques temps, l’avantage de cette petite pose avant le succès a été de permettre à plein de gens de proposer des ressources de toutes sortes. De la formation aux livres techniques en passant par de nombreuses ressources gratuites sur le Web.

L’arrivée des nouveaux modèles Nokia qui va marquer le vrai grand retour sur la scène de WP7 (sans oublier de nombreuses autres marques qui, stimulées par ces évènements, vont aussi proposer des modèles intéressants), il est donc temps de ressortir du tiroir les idées notées pour créer des applications Windows Phone et, cette fois-ci, de passer à l’acte et de les réaliser !

Les applications pour les Smartphones restent malgré tout modestes, ce n’est donc pas le code qui fait problème. Mais plutôt l’esthétique globale, l’enchainement des opérations, la bonne utilisation de l’espace de ces écrans aux dimensions inhabituelles pour un développeur et même un designer.

Tout le succès d’une application, et j’en parle depuis longtemps, tient souvent à son seul design...

Si cela est vrai sur le Web ou en desktop, cela l’est encore plus pour les Smartphones en raison de la manipulation uniquement tactile et des dimensions qui restent assez petites des écrans (sans oublier la taille d’un gros doigt de camionneur qui, lui aussi, a le droit d’avoir un Smartphone ! Sourire).

Pour mettre en place une application WP7 il est donc IN-DIS-PEN-SABLE (l’ai-je dis assez fort ?) de prototyper le visuel bien plus que le code.

Moins on a de place, plus on a de contraintes techniques, plus il faut faire simple et élégant.

Et faire simple est souvent ce qu’il y a de plus compliqué !

Ainsi, croire que développer pour WP7 est chose facile parce qu’il existe peu de variations possibles dans les formes, parce que l’espace est réduit et qu’on n’affiche pas grand chose à la fois est une erreur de jugement souvent fatidique.

Concevoir une bonne application pour WP7 réclame beaucoup d’art et de test du visuel, des enchainements des écrans, de la disposition des textes, des bons contrôles à utiliser.

Et pour cela il faut passer par une étape de mockup, de prototypage ou de wireframing. C’est vraiment le seul moyen de se faire une bonne idée de la conception générale de l’application avant de se lancer sous Blend et VS.

Or, il est assez fastidieux de redessiner un Smartphone fidèle en termes d’espace et de forme, tout autant que refaire sous Photoshop un clavier rigoureusement identique pour simuler une frappe et voir s’il reste assez place visuellement.

Pour toute cette phase d’essais visuels on utilisera des techniques variées :

  • découpage (créer des caches, faire glisser des bouts de papier pour simuler le contrôle Pivot ou Panorama par exemple)
  • sketching au crayon (sur un fond fidèle en terme d’espace et de taille)
  • Simulation visuelle sous Photoshop, Illustrator ou Design
  • etc...

 

Plus vous serez proche de la réalité, plus vous (le designer, le panel de testeurs...) serez capable de fixer les grandes mais aussi les petites lignes de votre mise en page, donc de la logique de l’application.

Si vous voulez réussir une application WP7 vous devez ainsi vous débarrasser de l’approche code-first pour vous investir, comme le fait Apple, dans une approche design-first.

Et pour se lancer, mieux vaut s’aider des nombreuses ressources gratuites qu’on trouve sur le Web !

Il en existe de toutes sortes, comme celles que j’ai citées plus haut : des patrons à imprimer et à découper, des fond simples pour sketcher directement au crayon, des dessins complets pour simuler un visuel en couleur respectant les proportions et les dimensions d’un Smartphone, etc.

Voici une petite sélection de ces ressources qui sauront vous aider...

(cliquez sur l’image pour accéder à la ressource).

 

Windows phone 7 Wireframe Stencil for Omnigraffle

Modèle de fond WP7 pour le sketching au crayon

Modèle WP7 pour Visio

Gabarits WP7

Kit UX WP7 vectoriel

Modèles Photoshop WP7

Modèles Powerpoint WP7

Modèles à découper WP7

Modèles XAML pour WP7 (projet CodePlex)

Download XAML based Design Templates for Windows Phone 7

Un Smartphone entièrement réalisé sous Photoshop (à réutiliser)

Le HTC Mondrian en Photoshop

L’émulateur WP7 dessiner sous Photoshop

Modèles HTC sous Photoshop

Contrôles, Panorama et clavier WP7 à découper pour simulations

(On peut télécharger l’image ou bien le “bmml” fichier au format du logiciel Balsamiq Mockup)

Guide de design de l’UI et des interactions pour WP7

Boutons de téléchargement depuis le Marketplace pour application WP7

Icônes minimalistes

Conclusion

Les plus attentifs auront remarqué que certains liens sont à '”tiroir” et qu’on débouche sur d’autres téléchargements gratuits de ressources...

Vous voici armez pour bien débuter, ne reste plus qu’à trouver la bonne idée pour la sketcher et en faire un block buster sur le Marketplace !

Le plus difficile est de trouver une idée assez simple pour tenir dans le format d’un Smartphone (qu’il s’agisse de l’interface ou du code) mais qui soit assez complexe et spécialisée (avec de vrais morceaux de savoir-faire dedans) pour ne pas retrouver dix copies de l’application la semaine suivante sur le marketplace... Ce dont MS se fiche, c’est à l’auteur de faire respecter ses droits...

Et en matière de droits international, ce ne sont pas que les quelques centaines d’euros que vous aurez engrangés qui vous permettront de vous payer des dépôts internationaux de marques et encore moins des avocats et leurs avoués pour défendre vos copyrights aux USA ou en Russie ou dans des coins encore plus paumés !

C’est là le vrai piège du développement sous Smartphone, et cela est vrai chez Google et chez Apple aussi : si votre appli contient une super bonne idée mais qu’elle est facile à copier, vous n’en tirerez aucun bénéfice substantiel car vous serez copié immédiatement et que les market places en tout genre s’en moquent superbement (au contraire ça fait monter le compteur des applis proposées, nouveau cheval de bataille entre le protagonistes).

Pour ne pas être le dindon de la farce, je vous conseille ainsi de bien respecter cet impératif : un bon soft, une bonne idée, mais quelque chose de très difficile à copier. Sinon, cela ne vous rapportera rien (au marketplace, si, ne serait-ce que l’abonnement annuel que vous aurez acquitté !)...

Notre monde libéral est une jungle sans loi, en tout cas pour les petits qui se font avoir à tous les coups. Et même une entreprise de taille honorable est un “petit” sur l’échiquier mondial des voyous...

Alors blindez votre idée, et quand vous en tiendrez une qui répond aux critères, testez bien son visuel et son UX. L’utilisateur juge en quelques secondes !

Bon sketching !

(et stay tuned...)

blog comments powered by Disqus