Ce n'est pas souvent que vous associez Adobe à des téléchargements "gratuits", mais c'est exactement ce que cette société a fait avec Adobe XD. Il s'agit d'une application de prototypage d'interface rapide pour les appareils mobiles et les sites Web, permettant aux concepteurs de proposer rapidement des conceptions pour des plates-formes spécifiques.
La meilleure chose à propos d'Adobe XD est sa facilité d'utilisation. Même si vous avez peu d'expérience dans la conception de quoi que ce soit, il n'y a qu'une courbe d'apprentissage très progressive pour vous retenir.
Même l'interface utilisateur est rafraîchissante, sans tous les outils et panneaux qui découragent tant de personnes d'applications telles que Photoshop, Illustrator et Lightroom. Dans cet article, nous allons vous présenter Adobe XD et vous expliquer ce que vous pouvez et ne pouvez pas faire avec.
Adobe XD est un outil de conception. Il ne créera pas votre application pour vous, mais il vous aidera à présenter une vision ou un prototype de ce à quoi vous voulez que votre prochaine application mobile ou tablette, votre site Web ou toute autre interface utilisateur ressemble. L'application utilise des planches d'art --- essentiellement des maquettes d'écran --- pour fournir une représentation visuelle de la conception de votre application.
La création d'applications mobiles et de sites Web qui fonctionnent peut nécessiter beaucoup de savoir-faire technique. Adobe XD vous fournit les outils nécessaires pour transformer une idée en preuve de concept. Lorsque vous aurez terminé, vous disposerez d'un plan à partir duquel travailler, et vous pourrez le modifier à l'infini jusqu'à ce que vous soyez satisfait du design.
De la même manière que l'art conceptuel est si important dans les efforts créatifs (voir ce magnifique art conceptuel de jeu vidéo comme preuve), une preuve de concept pour la conception de l'interface souhaitée est importante lorsqu'il s'agit de la construction de logiciels et de sites Web. Fournir aux programmeurs un concept qui correspond si étroitement au produit fini est un excellent moyen d'aligner vos attentes sur ce qui est possible.
Mieux encore, l'application est conçue de manière à ce que tout le monde puisse l'utiliser. Que vous soyez un designer chevronné, un programmeur ou quelqu'un qui n'a pas ces deux compétences; Adobe XD peut combler le fossé entre votre vision et vos connaissances techniques. Vous n'avez même pas besoin d'apprendre à coder pour concevoir une application.
Adobe XD est conçu avec quelques applications spécifiques à l'esprit, mais vous pouvez également sortir des sentiers battus. L'application facilite les choses en incluant des modèles pour :
Vous n'êtes pas obligé de vous en tenir à ces modèles, ils sont juste là pour vous faciliter la vie. Vous pouvez également spécifier une taille d'interface entièrement personnalisée (c'est-à-dire l'écran) et commencer à concevoir pour à peu près n'importe quelle plate-forme que vous pouvez imaginer.
Si vous concevez une application mobile, vous pouvez télécharger l'application gratuite Adobe XD pour votre plate-forme et exporter vos conceptions pour un aperçu en direct sur votre appareil.
Si vous envisagez de concevoir pour iOS, Android, Windows ou une autre plate-forme bien établie ; vous pouvez utiliser des kits d'interface utilisateur pour obtenir un coup de main. Il s'agit essentiellement de modèles de projet gérés par Apple, Google, Microsoft et d'autres, téléchargeables au format de fichier .XD d'Adobe.
Avec les kits d'interface utilisateur, vous pouvez accélérer la production, ce qui vous permet de concevoir votre application dans les contraintes et les éléments communs observés dans la plate-forme de votre choix. Comme ils sont maintenus par les développeurs de la plate-forme, ils sont généralement toujours à jour et complets.
Par exemple, le kit d'interface utilisateur iOS d'Apple comprend des dimensions d'écran vide pour une gamme d'appareils, des exemples de clavier iOS, des éléments de navigation comme le ruban en haut de l'écran, les boutons bascule iOS, etc. Vous pouvez facilement copier et coller des éléments dans vos plans de travail de conception et créer des prototypes précis.
Adobe gère également quelques autres kits d'interface utilisateur, notamment des échantillons de smartwatch compatibles avec watchOS, un kit de site Web de commerce électronique et un ensemble d'exemples pour la création d'applications pour smartphone en monnaie numérique. Vous devrez télécharger séparément les kits d'interface utilisateur appropriés pour iOS, la conception matérielle de Google et Microsoft Windows.
Contrairement aux autres applications graphiques et de conception complexes d'Adobe, XD a une belle interface utilisateur propre avec seulement quelques outils simples. Vous avez vos formes de base :rectangles, cercles, lignes et un outil stylo pour créer des formes personnalisées. Il existe également un outil de texte simple, avec accès à la bibliothèque de polices Typekit (mais pas à la totalité).
Vous pouvez ensuite modifier divers attributs liés à ces éléments, tels que l'opacité, la couleur de remplissage, les bordures, les ombres et le comportement de défilement. Enfin, il y a une loupe et un outil de plan de travail pour développer votre conception.
Adobe XD vous aide à placer des éléments dans des endroits esthétiques en les « emboîtant » autour des bords de l'écran, du point central du canevas et d'autres éléments. Vous pouvez remplacer cela si vous le souhaitez en maintenant un bouton enfoncé (sur la version Mac, c'est Cmd ).
Le long du bord supérieur de l'application, vous verrez deux bascules :Design et Prototype . Le design est l'endroit où vous passerez la plupart de votre temps à créer votre vision. Passez en mode Prototype pour ajouter diverses interactions entre les éléments à l'écran. Vous pouvez déclencher des événements et basculer vers différents plans de travail, offrant une expérience utilisateur simple sans écrire une ligne de code.
Cela se fait via une simple interface glisser-déposer, par exemple :créez un bouton avec l'outil cercle, créez un nouveau plan de travail avec le résultat souhaité en appuyant sur ce bouton (par exemple, un onglet différent dans votre application), passez en mode Prototype et faites glisser la flèche du bouton vers votre nouveau plan de travail. Appuyez sur le bouton "Jouer" ou prévisualisez sur votre appareil en direct pour voir comment cela se passe.
Vous pouvez même spécifier des transitions et des effets pour lui donner un aspect fantaisiste. Il y a quelques limitations assez importantes au mode Prototype. Vous ne pouvez pas vraiment aller trop loin avec cela, mais il sert un objectif et sa mise en œuvre simple le rend facile à utiliser.
En tant que produit gratuit, Adobe XD est conçu pour vous permettre de vous connecter à son flux de travail simple et à ses outils conviviaux sans dépenser un centime. Le plus gros inconvénient de la version gratuite est l'impossibilité d'avoir plus d'un prototype partagé actif ou un ensemble de spécifications de conception à la fois.
Ainsi, pour votre premier design ou projet, la version gratuite peut suffire. Lorsqu'il s'agit de partager plus de conceptions ou de projets avec votre équipe ou les développeurs d'applications, vous vous heurterez rapidement à un mur. Vous pouvez toujours exporter vos différents plans de travail sous forme de fichiers .PNG gratuitement, pour toujours via le Fichier> Exporter option.
Cependant, le prototypage partagé et l'interactivité entre les plans de travail sont l'une des caractéristiques les plus remarquables ici. L'application est toujours utile sans elle, mais pas dans la même mesure. Vous ne pouvez pas construire un prototype entièrement réalisé, mais vous pouvez rapidement définir votre conception.
Les autres limitations de la version gratuite incluent un nombre limité de polices Typekit et 2 Go de stockage en nuage (au lieu de 100 Go) pour les abonnés Creative Cloud. Si vous décidez de dépenser de l'argent pour la version payante, Adobe XD vous coûtera 9,99 $/mois pour cette application seule ou 52,99 $/mois pour la suite Creative Cloud complète.
Nous pensons qu'Adobe Creative Cloud en vaut la peine, à condition que vous puissiez en tirer suffisamment parti.
Adobe XD est un outil utile, que vous ayez l'intention de le payer ou non. Dans certains cas, vous pouvez vous en sortir avec la version gratuite pour travailler sur de petits projets personnels. Lorsqu'il s'agit de travailler sérieusement et de partager avec des équipes, vous devrez effectuer une mise à niveau.
Adobe XD n'est pas l'alpha et l'oméga de la conception d'interface utilisateur (quelle est la différence entre UI et UX ?). Les concepteurs utilisent des outils graphiques depuis des années pour créer des maquettes pour des sites Web, des conceptions d'applications, etc. Découvrez les meilleurs outils graphiques vectoriels Mac pour les concepteurs à petit budget afin de découvrir des alternatives performantes.
