Question pour les concepteurs UI / UX re: prototypage animation UI
Je suis concepteur de graphiques animés (auparavant: graphiques animés pour la télévision, les jeux, etc.), mais plus récemment, j'ai travaillé sur le prototypage de mouvements d'interface utilisateur pour une application - ce que j'ai vraiment apprécié!
Jusqu'à présent, j'ai principalement utilisé After Effects et j'ai lu que bon nombre de concepteurs UI/UX l'utilisaient pour prototyper les transitions et les interactions.
Alors que j'entre dans ce domaine, pour ceux qui y travaillent déjà, voyez-vous une utilisation pour que quelqu'un vienne, comme moi, en freelance pour prototyper le mouvement en AE? Quels autres outils trouvez-vous avantageux pour cela?
J'ai lu sur Quartz Composer, qui a apparemment une courbe d'apprentissage assez abrupte - mais j'aimerais savoir si ce serait une compétence souhaitable à avoir?
Tout d'abord, j'applaudis tous ceux qui souhaitent s'intéresser au côté interactif du design. Dans les groupes UX d'entreprise, je trouve que la seule chose qui passe souvent à travers les mailles du filet est la conception de l'interaction (souvent due aux processus de développement en cascade). L'interface utilisateur peut sembler magnifique, le back-end, serré et réactif, mais vous les assemblez et les choses semblent toujours maladroites car aucune pensée n'a été mise dans les transitions, ni les survols, ni les révélations animées, etc.
Donc, toute équipe UX qui voudrait que vous soyez, serait une excellente équipe UX à laquelle faire partie car il y a clairement une considération pour cela.
En ce qui concerne l'outil à utiliser, c'est là que je deviens un peu plus sceptique, sauf sur le support réel sur lequel je travaille. Je suis un ardent défenseur que si vous travaillez sur le mouvement de prototypage pour une application web, utilisez le support de HTML, CSS et JS pour le faire. S'il s'agit d'une application iOS native, prenez Quartz Composer et utilisez des animations natives.
Cela ne veut pas dire qu'After Effects n'est pas un excellent outil, cependant. En fin de compte, c'est la personne derrière l'outil qui est la clé. Cela dit, lorsque seul l'outil est utilisé, les équipes peuvent devenir trop dépendantes des interactions qui n'existent qu'au sein de cet outil. Par exemple, une équipe qui utilise uniquement Axure peut finir par créer sans le savoir des sites Web qui ressemblent simplement à des interactions Axure par défaut.
SharePoint est un autre bon exemple ... il faut un effort herculéen pour créer un site SharePoint qui ne "ressemble" pas à SharePoint parce que vous êtes coincé dans le milieu de SharePoint.
En résumé:
voyez-vous une utilité pour quelqu'un de venir, comme moi, sur une base indépendante pour prototyper le mouvement dans AE?
Est ce que je? Absolument! Et j'espère que d'autres équipes UX feront de même.
Quels autres outils trouvez-vous avantageux pour cela?
Je commencerais à jouer avec jQuery. Mettez la main à la pâte avec certains JS et CSS3. Même si vous ne travaillez pas en fin de compte, cela vous donnera beaucoup de contexte à reprendre pour mieux créer votre travail After Effects.
Autres outils populaires qui incluent différentes formes de prototypage d'interaction que les équipes UX utilisent:
- Axure
- je me lève
- Muse
- InVision
- et (encore) HTML, CSS et JS.
La réponse de DA01 était fantastique et complète. J'aimerais également vous féliciter d'avoir fait la transition!
Se familiariser avec le code lui-même est incroyablement précieux car il vous permettra de comprendre et de communiquer avec les développeurs et les SWE de manière à permettre à vos idées de se concrétiser en production. De plus, cela peut réduire considérablement le temps de production car vous pouvez exercer un contrôle ultime (et réduire le nombre d'itérations du code de production) sur vos transitions et animations.
Je voudrais noter que certains outils open-source comme Framer ont une surcharge assez faible et vous permettront de vous déplacer pour vous diriger vers une conception plus basée sur le code. Si vous composez vous-même des simulateurs statiques ou travaillez avec des designers qui aiment différents outils (Photoshop, Illustrator, Sketch, etc.), vous n'avez pas besoin de les appuyer pour modifier leur flux de travail afin de créer des conceptions animées soignées.
J'avais l'habitude de travailler dans une entreprise où ils essayaient vraiment d'encourager l'utilisation de l'animation dans les interfaces utilisateur. Leur conviction était que l'animation devrait être définie approximativement aux toutes premières étapes du prototypage. Par conséquent, c'était le devoir des gens UX d'améliorer leurs filaires avec des animations.
Ainsi, lorsqu'ils ont recherché un outil que même les utilisateurs UX sans formation en conception graphique ou visuelle, ils ont découvert que l'outil le plus rentable était en fait MS PowerPoint. Rappelez-vous, c'était à des fins de prototypage basse fidélité, et PowerPoint a juste excellé dans ce domaine (sans jeu de mots). La courbe d'apprentissage est très rapide, l'effort requis est léger et les résultats donnent une idée générale de l'animation.
Il s'agit d'une question compliquée qui touche à plusieurs questions importantes. J'essaierai de répondre en me concentrant sur deux questions fondamentales.
Voyez-vous une utilisation pour que quelqu'un vienne, comme moi, en freelance pour prototyper le mouvement dans AE? Quels autres outils trouvez-vous avantageux pour cela?
- Absolument . Il existe une forte demande de pigistes pour fournir des services spécialisés dans des domaines en dehors de l'offre de base pour les entreprises de toutes sortes et de toutes tailles. Consultez Freelancing on Stack , Freelancers Union pour en savoir plus sur le fait d'être pigiste, découvrez Business Models (vous en serez le propriétaire) pour cartographier tous les éléments de la propriété d'une entreprise et lire La conception est un travail pour une application pratique de votre métier. Vous devrez découvrir un marché (visualisation scientifique, conception de jeux, etc.), aligner votre argumentaire, en savoir plus sur les tarifs compétitifs dans ce domaine, puis faire un travail acharné honnête.
- Puisque vous demandez à une foule UX, nous pouvons créer des prototypes avec des histoires verbales, papier , des tableaux blancs, des story-boards, des outils comme AXURE et Basalmiq , ou protos hi-fi en HTML/CSS/JS ou en environnement natif. La clé ici est de déterminer ce qu'il faut tester et qui tester . L'objectif est de valider les hypothèses sur les problèmes à résoudre et la meilleure façon de les résoudre aussi bon marché et rapide que possible pour les produits de consommation - peut être différente pour paramètres de recherche. Cependant, les protos hifi sont destinés à tester des interactions complexes telles qu'elles seront dans la nature.
Il n'y a peut-être pas de substitut pour AE. Si vous êtes rapide et bon, appliquez un processus prototype comme RITE peut vous aider à devenir un prototyper d'animation rock-star. Demandez-vous pourquoi devriez-vous choisir d'autres méthodes? Vous devez peut-être vous associer à un groupe de recherche sur l'utilisabilité qui a besoin d'un animateur rockstar AE.
Trouvez un moyen d'appliquer votre passion. C'est la beauté d'être un pigiste. Vous choisissez votre propre chemin.