Cet article a été publié par Fabien Grenet sur le blog qu'il a tenu entre 2008 et 2016. Pour des question de référencement (SEO), lorsque l'agence nospoon a été créé, il a été décidé de transformer le blog de Fabien en site pour l'agence. Tous les articles ont ainsi été conservés, mais n'engagent pas l'agence quant aux contenus qui sont abordés.

Prototypage iPad & iPhone : ayez le réflexe AppCooker !

Nous sommes amenés dans le cadre de notre activité à travailler sur des questions de design d’interface et d’interaction. Lorsqu’il s’agit de projets d’App iPad ou iPhone, je préconise et applique une approche de prototypage fonctionnel agile qui permet d’arriver rapidement à un résultat tangible et exploitable par les équipes métiers et techniques.

En effet nous sommes convaincus que permettre à tous les acteurs projets, techniques ou métier, de toucher l’interface et interagir avec le plus tôt possible est le meilleur moyen pour s’assurer de son adéquation (l’expérience tend d’ailleurs à me donner raison). Vous me direz que c’est l’essence même des méthodes agiles comme par exemple SCRUM, c’est vrai, mais l’approche que nous défendons va plus loin car elle est applicable à n’importe quelle méthode de gestion de projet, agile ou non !

Nous utilisons à cette fin l’excellente App iPad AppCooker et allons détailler en quoi ce réflexe est source de valeur ajoutée pour vos projets iPad & iPhone.

 

AppCooker – le pitch.

AppCooker est éditée par Hot Apps Factory, une jeune société française (cocorico) créée par Xavier Veyrat et Johann Fradj dont une interview fera l’objet d’un prochain billet.

AppCooker est un studio de conception tout en un sur iPad qui accompagne le porteur du projet de l’idée à sa concrétisation en lui donnant les moyens de rendre tangible sa vision à l’aide de maquettes et de plusieurs outils allant de la création de l’icône à la définition du pricing en passant par la structuration de l’idée. AppCooker permet de produire des maquettes fonctionnelles riches afin de valider sur un prototype dynamique l’ergonomie, les principes de navigation, l’architecture de l’information, … en résumé les choix de design d’interface et d’interaction, avant de passer la main aux graphistes et développeurs.

Un prototype avec AppCooker, c’est simple comme bonjour.

Pour le professionnel de l’ergonomie des interfaces tactiles que je suis, la qualité de l’interface d’AppCooker a été une très bonne surprise et un vrai plaisir. Nos deux compères l’ont particulièrement réussie, et si quelques ajustements pourraient la rendre encore plus efficace (je pinaille), sa courbe d’apprentissage est très rapide.

La bibliothèque de composants graphique est très complète et permet de créer des maquettes tant en HiFi qu’en LoFi dans lesquelles il est bien sur possible d’inclure des images et des formes géométriques voire des crayonnés.

AppCooker - bibliothèque de composants

Le bandeau supérieur, appelé transformation bar, permet de rapidement modifier la mise en forme de l’élément avec précision, ce dernier pouvant bien sur être également manipulé directement sur l’écran. Dans ce cas là, un certain nombre de mécanismes dont le but est d’aider à positionner ou redimensionner précisément le composant se mettent en marche (grille invisible, quadrillage visuel dynamique, …).

AppCooker - transformation bar

Le bandeau inférieur, appelé property bar, permet quand à lui de personnaliser les options de l’élément sélectionné. Par exemple ajouter un bouton «retour» au bandeau de titre, plusieurs lignes dans une liste déroulante, l’écran cible d’un lien actif, …

AppCooker - property bar 2 AppCooker - property bar

Ainsi, en disposant sur l’écran des éléments puis en les personnalisant vous pouvez rapidement créer plusieurs écrans (incluant le support de la rotation portrait / paysage) et définir les liens entre eux de manière à rendre vos maquettes dynamiques. Car en effet tout l’intérêt d’AppCooker réside pour moi dans sa capacité à générer une maquette (quasi) dynamique manipulable grâce à un mode player intégré !

AppCooker - Player

Sachez cependant que le player ne permet aujourd’hui que de faire des transition d’un écran à l’autre via des liens prédéfinis mais pas encore de manipuler l’ensemble des éléments composant un écran comme sur une vraie maquette dynamique. Cependant, cette fonctionnalité fait partie de la roadmap d’AppCooker qui ne l’oublions pas est actuellement proposée en version intermédiaire à prix réduit. D’ailleurs quand je voit ce que propose et permet de faire la version intermédiaire, je suis sur que la version finale va beaucoup faire parler d’elle… Bref, pour en revenir au player et aux maquettes dynamiques, je vous assure que permettre à son client de manipuler les esquisses d’interfaces que vous lui proposez est priceless, même avec les limitations actuelles d’AppCooker !

Enfin, HotAppsFactory proposait jusqu’à il y a peu un player iPhone-iPad gratuit (AppTaster) mais celui-ci a été retiré de l’AppStore à la demande d’Apple. Rassurez vous, il va bientôt renaître de ces cendres et c’est une excellente nouvelle car ce player constitue selon moi le second effet kisskool de cette App génialissime. En effet, grâce à lui vous pourrez réaliser vos maquettes, les transmettre à votre client coté métier (par exemple) qui pourra les tester en réel et vous faire son feedback directement via la fonctionnalité intégrée à l’App !

 

AppCooker viewer AppCooker - Player feedback

 

QU’APPORTE LE PROTOTYPAGE AGILE AVEC APPCOOKER ?

Le prototypage agile avec AppCooker vous permet de proposer très rapidement des éléments concrets de l’interface de l’App que vous élaborez, de les faire tester immédiatement et de les adapter dans la foulée en vue de fournir aux graphistes et développeurs un produit fini qui ne nécessitera que peu d’ajustements.

AppCooker utilisée dans un atelier de conception regroupant des équipes métiers et techniques (voire des utilisateurs) permet de co-construire les bases d’une App avec la certitude que le dessin sert le dessein et que chacun s’y retrouve.

AppCooker utilisée par les chefs de projets métiers leur permet de reprendre la main sur la conception, habituellement déléguée à des équipes type AMOA voire directement DSI, en ayant à disposition un outil facilitant le dialogue avec les équipes techniques.

AppCooker utilisée par les chefs de projet techniques leur permet de faire abstraction de la technique pour se focaliser sur l’interface et son utilisabilité, les principes de navigation, … En effet, tout ce qui est possible dans AppCooker est réalisable en xCode.

AppCooker utilisée par des designers leur permet de faire abstraction du graphisme pour se concentrer sur l’architecture de l’information et l’interactivité de l’App et de pouvoir concevoir des maquettes dynamiques et manipulables en réduisant les biais cognitifs ce qui est un véritable plus pour les projets tactiles.

 

Bref, que des bonnes raisons de l’utiliser, quelque soit votre workflow de conception – production. Vous êtes bien sur libre d’avoir ou non le réflexe AppCooker pour vos futurs projets iPad & iPhone, je vous encourage cependant vivement à faire un essai qui j’en suis sur achèvera de vous convaincre. Et si jamais vous ne voulez pas dépenser les 20€ que coûte cette merveilleuse App, contactez moi afin que je vienne vous faire une démo.. avec ça vous n’avez plus aucune d’excuse !



 

Le magazine

Découvrez nos derniers articles sur la communication, l'identité et image de marque, le marketing digital, l'innovation & cie.

 

Votre projet

Vous avez un projet, un besoin, une question ?

Contactez-nous et discutons-en de vive-voix !