Types d’outils de prototypage

Après de longues recherches, j’ai divisé les outils de prototypage en trois catégories : page-based, layer-based, and coding-based. The Outils dans chaque catégorie partagent des caractéristiques distinctes ainsi que des avantages et des inconvénients. Cet article se concentre sur deux outils de prototypage basés sur des pages car ils offrent la meilleure adoption des trois catégories. 

Zida Zolemba Zotengera Tsamba

Zida zosankhidwa zochokera patsamba ndi  Mwala , Onani , yaikulu et UI Wamadzimadzi.
Grâce à ces outils, vous pouvez créer plusieurs pages ou importer vos mochup statiques, puis créer facilement points pour relier la page suivante avec des transitions.
Ces outils sont utilisés au mieux pour mettre en valeur l’ensemble du parcours d’une grande fonctionnalité (user story) ou une application entière.
Comme tous supportent le glisser-déposer avec une navigation intuitive, il n’y a pratiquement aucune courbe d’apprentissage. Toutefois, ces outils ne permettent pas un fine-tuning des animations ou le contrôle un seul composant dans la page.

Mwala

Après mûre réflexion, nous avons décidé d’utiliser Flinto place d’autres outils dans cette catégorie. Flinto fonctionne le mieux pour nous pour plusieurs raisons. Tout d’abord, la plupart de nos applications sont à un stade stable. Avec chaque version, nous construisons une caractéristique intéressante pour une application existante plutôt que de construire en repartant de rien. Nous avons les éléments d’UI, le guide de style, et des captures d’écran prêts à l’emploi.

Nthawi zonse tikasintha monyodola mu @Dropbox, zimasinthidwanso mu @flinto

Nous trouvons également la fonction de synchronisation Dropbox dans Flinto exceptionnellement utile, car nous sommes en mesure de sauver nos mockup dans Dropbox. Cela signifie que chaque fois que nous apportons des modifications à un mockup dans Dropbox, il sera automatiquement mis à jour dans Flinto. Flinto est extrêmement facile à utiliser, et vous pouvez construire un prototype en quelques minutes.

Tout comme les autres outils de cette catégorie, Flinto ne propose pas d’animation fluide sur une page. Par exemple, l’animation d’une barre de progression doit être divisée en plusieurs images plutôt que comme une animation fluide.

Chidutswa chosavuta ichi chokhala ndi makanema ojambula ochita bwino chimafunikira zoseketsa zisanu ndi zitatu ndipo chimawonekabe chododometsa

Onani

Invision est une solution proche de Flinto, et a de nombreuses caractéristiques que nous aimons dans Flinto. Il est facilement partageable, hautement collaboratif, est optimisé pour le mobile, offre la synchronisation, et dispose de la version de contrôle des fichiers PSD. Tout comme Flinto, vous pouvez faire glisser-déposer plusieurs images et créer une zone sensible pour faire un prototype interactif en quelques minutes.

La seule raison pour laquelle nous n’avons pas retenu Invision est qu’il est pas aussi simple pour manipuler les pages. gule Invision, vous ne voyez qu’une seule page dans le navigateur puis sélectionnez le nom du fichier que vous souhaitez lier dans un menu déroulant. Cela offre peu de visibilité de l’ensemble de  mockups que nous avons importé, souvent plus de 50 images. Zambiri relier les pages en se basant sur les noms de fichiers n’est pas aussi intuitif que l’identification visuelle des fichiers.

Mosiyana ndi Flinto, mutha kuwona tsamba limodzi panthawi imodzi ndikusankha tsamba lolumikizira kuchokera pamenyu yotsitsa

yaikulu

Si vous avez seulement utilisé Keynote pour des présentations, vous n’avez pas découvert ses puissantes fonctionnalités pour le prototypage. Keynote propose des transitions animées entre les diapositives, le contrôle gestuel, des capacités d’alignement, la distribution automatique, et les guides intelligents.
Les animations proposées dans Keynote sont assez bien mises en correspondance avec animations standard que vous obtenez en développement iOS. La chose principal est votre familiarité probable avec le programme. Il est l’outil le plus intuitif et auto-explicatif de cette catégorie, car la courbe d’apprentissage est (probablement) de zéro.

Komabe, kugawana ma prototypes a Keynote sikophweka monga momwe munthu angaganizire. Mosiyana ndi Flinto kapena Invision, muyenera kutumiza chithunzicho ngati PDF ndikuchiyika ku seva yanu, kenako tumizani ulalo kwa oyesa ogwiritsa ntchito kapena makasitomala anu. Izi zikutanthauza kuti sikuti mungofunika kuchitapo kanthu pogawana nawo komanso simukuwongolera momwe zidzawonekere pazida za olandira. Ngati woyesa wanu ali ndi chipangizo cha Android, PDF ikhoza kuwonetsedwa m'mawonekedwe osiyanasiyana osiyanasiyana kapena kutaya kuyanjana kwake kwathunthu. Njira yabwino kwambiri yotumizira kuti chidziwitsocho chikhale chodalirika kwambiri ndikutsitsa mawu ofunikira a iPhone kapena iPad pazida za olandira. Njira yotumizirayi siyothandiza ngati zida zina ziwiri pamwambapa.
Toutefois, le partage des prototypes Keynote est pas aussi facile qu’on pourrait le croire.Contrairement Flinto ou Invision, vous devez exporter le prototype en PDF et le télécharger sur votre serveur, puis envoyer le lien aux testeurs d’utilisateur ou vos clients. Cela signifie que non seulement vous avez besoin de franchir une étape supplémentaire dans le processus de partage mais vous ne contrôlez pas comment il sera affiché sur les périphériques des destinataires. Si votre testeur utilisateur dispose d’un appareil Android, le PDF peut être affiché en plusieurs niveaux de zoom différents ou perdre son interactivité entièrement. La meilleure méthode de déploiement de garder l’expérience en tant que haute fidélité possible est de télécharger d’honneur pour iPhone ou iPad sur les appareils des destinataires. Ce processus de déploiement ne sont pas aussi efficaces que les deux autres outils ci-dessus.

UI Wamadzimadzi

Fluid UI est un excellent outil si vous commencez le prototype à partir de zéro. Il est livré avec plus de 2000 wireframe prêts à l’emploi pour téléphone et tablette, à la fois pour iOS et Android . Vous pouvez également exporter la totalité de la vue et l’utiliser comme un document flow.

Vous pouvez également télécharger vos mockups de haute fidélité et créer des zones sensibles, tout comme Invision et Flinto. Cependant, je dois dire que l’interface de Fluid UI est le mieux adapté pour les prototypes fabriqués à partir de zéro. Kumbali ina, monga le téléchargement de plusieurs images est pas pris en charge, vous devez télécharger un par un vos mockups. En outre, le manque de capacité de lier votre dossier Dropbox signifie que vous devrez changer de mockups chaque fois que vous apportez des modifications à votre conception.
Dans le prochain article, je passerai en revue les avantages et les inconvénients de outils ‘code-based’ et ‘layer-based’.
Merci pour la lecture et restez à l’écoute!