Dessine-moi un mouton avec un écran interactif

L’écran interactif permet et favorise la collaboration. Toutes les phases de « dessin » d’un projet sont intéressants à partager, en grand, sur un écran à savoir :

• - Le choix de structure
• - Les couleurs
• - Les images
• - Les messages

Les nouveaux outils d’annotation et de Design :

Les outils se sont démocratisés d’une part, et multipliés d’autre part. Alors que les logiciels de design étaient exclusivement installés sur les ordinateurs. Nous pouvons aujourd’hui compter, sur des logiciels en ligne, qui deviennent de plus en plus performants, ou sur les applications, installées sur les tablettes et les smartphones.
Outre leur variété, il est notable que presque tous les outils se mettent à la portée de leurs utilisateurs, cela les rend accessibles aux non-initiés ou aux faiblement initiés.
Avec les Ecrans interactifs, on dispose également de beaucoup de systèmes d’annotations numériques. Ce que l’on faisait avant à la main, sur des ébauches imprimées, on est capable maintenant de le faire en numérique.

Du dessin de Structure (WireFrame) à la  Maquette  , puis au Prototype

Quelle est donc la différence ? Bien que ce ne soit pas la seule procédure de conception d'un site ou d'une application, le processus de conception traditionnel suit ces trois étapes.

Dessin de Structure (WireFrame)

Les wireframes sont comme le schéma directeur de votre projet. Vous les créez très tôt, généralement lors de la première étape (ou de la deuxième, si vous préférez faire des croquis d'abord), et vous consacrez du temps uniquement à répondre aux questions cruciales de mise en page, de structure et d'organisation avant que l'équipe ne se concentre sur les détails visuels.
C'est pourquoi les wireframes sont de faible fidélité. Il y a un temps et un lieu pour tout, et les détails visuels et techniques doivent être décidés plus tard, après que le format et la structure aient été solidifiés.
Cela ne veut pas dire que les wireframes ne doivent pas se préoccuper du tout de l'aspect visuel - il suffit d'avoir suffisamment de détails pour visualiser la disposition générale et l'espace nécessaire pour les catégories d'éléments (comme une barre latérale, une navigation en haut de page, un pied de page, un contenu primaire, etc.)
Cette méthode permet à l'équipe de se concentrer uniquement sur les décisions générales avant de se plonger dans les détails. Les avantages des wireframes sont les mêmes que ceux des plans pour n'importe quel support : ils permettent de planifier correctement avant d'aller de l'avant, réduisant ainsi le risque de devoir faire marche arrière parce que quelque chose a été manqué.
En outre, les wireframes peuvent être partagés avec toute l'équipe pour que tout le monde soit sur la même longueur d'onde. Si vous utilisez un outil spécialisé dans l'élaboration de grilles ou de prototypes, différents membres de l'équipe peuvent modifier ou commenter le même document, ce qui encourage la collaboration dès le début.

Exemple de Wireframe de site Internet

De plus, les wireframes peuvent être montrés aux parties prenantes qui veulent voir les résultats dès le début, et révéler les modifications potentielles avant de perdre du temps à les développer davantage.
En raison de la faible fidélité des images filaires, il existe plus de méthodes pratiques pour les construire que pour les autres phases. Examinons-en quelques-unes.

Logiciel de Croquis

A l'ancienne. Dessinez simplement ce qui vous passe par la tête, mais ne vous laissez pas trop emporter par les détails. C'est très bien pour un Wireframe dans une situation comme le brainstorming.  Les écrans interactifs sont fournis avec un logiciel d’annotation, et Microsoft intègre dans Windows 10 un logiciel appelé « WhiteBoard »

Logiciel de présentation

Si vous faites un montage spécifique pour une présentation, vous pouvez l'intégrer dans un logiciel comme PowerPoint. La structure des diapositives facilite la réflexion sur votre conception en termes de pages, mais là encore, cette option manque d'interactivité. Les logiciels de présentation sont cependant très familiers. A un moment ou un autre, pratiquement tout le monde a eu l’occasion d’en manipuler un.

Logiciels de conception graphique

Les avantages de ces logiciels sont des fonctions simplifiées pour le traitement des images, comme la possibilité de glisser-déposer et la facilité avec laquelle il est possible d'ajouter de l'interactivité en quelques clics.
L’équipe de ecran-interactif.net a testé plusieurs de ces logiciels, elle a vérifié leur compatibilité avec les écrans du marché.
Nous avons testé et noté 3 outils de prototypage d’images sur un écran interactif Easypitch. Ils ont été évalués sur 4 critères incontournables dans tout travail de création design.