Le 14 septembre 2017, nous avons publié une version actualisée de notre Politique de confidentialité. En utilisant video2brain.com vous vous engagez à respecter ces documents mis à jour. Veuillez donc prendre quelques minutes pour les consulter.

Design UX : Le prototypage papier

Utiliser des kits d'interface

TESTEZ LINKEDIN LEARNING GRATUITEMENT ET SANS ENGAGEMENT

Tester maintenant Afficher tous les abonnements
Apprenez à créer des kits d'interface à partir de logiciels gratuits et de composants disponibles sur le web.
04:53

Transcription

Pour pouvoir préparer vos prototypes papier, vous allez mettre en place des kits d'interface, c'est-à-dire des collections de visuels que vous allez pouvoir ensuite imprimer, découper, coller, réarranger pour construire des maquettes de vos interfaces. Alors ces kits d'interface peuvent être des Templates, des modèles que vous allez trouver sur internet ou des logiciels que vous allez pouvoir installer et avec lesquels vous allez pouvoir réaliser vos interfaces Voici quelques exemples de sites web sur lesquels vous pouvez télécharger des kits d'interface gratuits, ici sur Pixshub vous allez pouvoir télécharger ce kit qui est destiné à simuler des interfaces iPhone, il s'agit ici de fichiers Illustrator. Une fois ces fichiers téléchargés et ouverts dans Illustrator, vous voyez que vous avez un document dans lequel vous avez les différents éléments d'interface, ici nous avons un clavier, différents types de claviers, vous avez également toutes sortes d'interfaces, des étiquettes, des labels, des boutons qui permettent de placer quelque chose sur On / Off, etc, etc. Alors il y a des kits qui sont destinés à Illustrator, il y a aussi des kits qui sont destinés à Photoshop. Ici par exemple nous pouvons télécharger un kit gratuit mais vous devrez faire une mention de l'attribution si vous publiez vos maquettes, donc vous cliquerez sur Free Download. Une fois téléchargé, vous pourrez ouvrir ce kit d'interface dans Photoshop. Ici j'ai ouvert ce kit d'interface dans Photoshop, vous voyez que nous avons des éléments qui vont pouvoir nous permettre de réaliser des interfaces simples, de les personnaliser, ensuite on découpera et on collera ces éléments de manière à réaliser Vous pouvez également vous intéresser à ce site qui va vous permettre de télécharger des grilles pour des téléphones mobiles et également pour des tablettes, donc c'est quelque chose également qui est très intéressant, toujours dans des formats de logiciels standards. Et puis il y a quelque chose qui peut vous intéresser, évidemment ici on a des éléments graphiques qui datent un peu mais en ce qui concerne l'édition de produits pour des prototypes papier, ce n'est pas très important et il s'agit ici d'un document PowerPoint. Vous allez donc pouvoir le télécharger et sans avoir besoin de Photoshop ou d'Illustrator, avec simplement PowerPoint qui est installé pratiquement sur toutes les machines qui effectuent du travail de bureau, et bien vous allez pouvoir les imprimer et ensuite vous pourrez créer vos prototypes papier. Je vais enfin vous montrer ma solution favorite qui se télécharge à la fois pour MacOS 10 et se télécharge également pour Windows et peut être également téléchargé pour Linux. On peut également l'installer en extension de Firefox mais il fonctionne de façon autonome sur les ordinateurs de bureau. Et une fois que l'on a installé Pencil Project, on va pouvoir grâce aux bibliothèques intégrées créer ces prototypes. Ici dans Pencil Project, vous voyez que j'ai créé des prototypes, un certain nombre de pages, Achat initial qu'est-ce qui se passe sur un scrolling, la page d'un panier, ici une fenêtre modale, ici c'est une page vide, une collection d'éléments visuels, une collection d'éléments d'interface etc, etc. Et j'ai créé cela très rapidement, simplement par Glisser-déposer à partir des bibliothèques qui sont fournies avec ce logiciel. Une fois que ces éléments auront été réalisés, et ils peuvent être modifiés très facilement, vous voyez qu'ici j'ai des menus qui peuvent être changés très facilement, j'imprime ces éléments et je vais pouvoir ensuite les contrecoller sur des cartons et m'en servir pour conduire par exemple des sessions de tests utilisateurs où je vais pouvoir valider que mes dispositifs correspondent bien aux attentes. Pensez donc à utiliser ces kits d'interface et lorsque vous allez utiliser ces kits d'interface, il y a un processus qui est quand même recommandé, qui est dans un premier temps de créer rapidement un crayonné qui va vous permettre d'avoir une idée de votre mise en page, ensuite vous allez lister les éléments d'interface nécessaires parce que vous voyez que dans ce que nous avons téléchargé, il y a pléthore de boutons, de menus déroulants, d'éléments variés et divers, donc vous allez lister ce dont vous avez besoin, vous téléchargerez ensuite ces éléments ou les logiciels dont vous avez besoin et ensuite vous allez pouvoir créer votre mise en page de base, la faire évoluer et il ne vous restera plus ensuite qu'à pratiquer la réalisation concrète, matérielle, c'est-à-dire coller ce que vous avez réalisé sur des cartons. un logiciel gratuit qui s'appelle Pencil,

Design UX : Le prototypage papier

Créez efficacement des prototypes papier pour valider les interactions que vous avez élaborées. Optimisez ainsi l'expérience utilisateur en testant des parcours à moindre coût.

25 min (9 vidéos)
Aucun commentaire n´est disponible actuellement
 
Spécial abonnés
Date de parution :8 juin 2017

Votre formation est disponible en ligne avec option de téléchargement. Bonne nouvelle : vous ne devez pas choisir entre les deux. Dès que vous achetez une formation, vous disposez des deux options de consultation !

Le téléchargement vous permet de consulter la formation hors ligne et offre une interface plus conviviale. Si vous travaillez sur différents ordinateurs ou que vous ne voulez pas regarder la formation en une seule fois, connectez-vous sur cette page pour consulter en ligne les vidéos de la formation. Nous vous souhaitons un excellent apprentissage avec cette formation vidéo.

N'hésitez pas à nous contacter si vous avez des questions !