Nouveaux outils de style dans Adobe XD : ombre interne, trait de contour et dégradé angulaire

Vous nous l’avez demandé, nous l’avons fait. Adobe annonce aujourd’hui de nouveaux outils de styles qui vous aideront à créer de magnifiques designs, plus complexes, et à explorer les nouvelles tendances de l’UI design .

Pour accéder à ces nouveaux outils, installez la dernière version de XD via l’application Creative Cloud ou testez gratuitement Adobe XD si vous ne l’avez pas encore fait.

Les nouvelles fonctionnalités incluses dans cette version font partie des plus demandées par la communauté internationale des designers via le service UserVoice dédié à Adobe XD. Notre équipe étudie en permanence de nouvelles idées et vos commentaires, et nous mettrons tout en œuvre pour répondre à un plus grand nombre de demandes dans les prochaines versions. Alors, restez à l’écoute !

Ombre interne

Les ombres internes permettent de donner de la profondeur aux designs. Comme son nom l’indique, l’outil correspondant applique une ombre à l’intérieur de l’objet sélectionné. Désormais, quand vous sélectionnerez un objet dans XD, la propriété Ombre interne s’affichera dans la section Effets de l’Inspecteur de Propriétés sur la droite de votre écran. Applicables aux formes, au texte, aux images et aux groupes booléens dans les designs, ces ombres internes sont également préservées lors de l’importation de fichiers Photoshop ou Sketch.

Les ombres internes donnent l’impression que les objets sont intégrés à l’arrière-plan de la zone de travail. Elles produisent donc l’effet inverse des ombres portées, grâce auxquelles les objets semblent se trouver en flottement dans d’autres calques. Les ombres internes permettent de créer des effets d’éclairage plus réalistes et d’explorer les nouvelles tendances du design UI, comme les composants 3D et le néomorphisme.

Vectoriser le contour

Cette fonctionnalité permet de convertir un contour (un trait ou une bordure, par exemple) en une nouvelle forme, que vous pouvez ensuite modifier comme n’importe quel objet présent sur la zone de travail, en changeant son apparence et sa taille, en y appliquant des dégradés, des ombres ou des modes de fusion, etc. Cette fonctionnalité ouvre de nouvelles possibilités de dessin vectoriel dans XD en créant des formes et des styles de texte personnalisés.

L’un des principaux cas d’usage est la préparation des ressources SVG en vue de leur exportation. Les contours convertis en formes y sont répliqués à l’identique lors de l’exportation au format SVG, leur apparence ne se dégrade pas en cas de redimensionnement (contrairement aux contours classiques), et leur rendu est plus homogène dans tous les navigateurs et sur tous les appareils. Plus besoin d’effectuer des allers-retours entre XD et Illustrator pour perfectionner vos fichiers SVG.

Dégradé angulaire

Les dégradés sont de plus en plus utilisés dans l’UI design pour créer de superbes effets de couleurs. Aux dégradés linéaires et radiaux, nous ajoutons à présent des dégradés angulaires dans XD. Également appelés dégradés coniques, ils appliquent un fond en dégradé de couleurs qui balaient une forme à partir du centre d’un cercle.

Leur fonctionnement est identique à celui des autres types de dégradé dans XD : vous pouvez déplacer ou faire pivoter le fond et ajouter des étapes pour obtenir un style original et unique. Les dégradés angulaires permettent d’appliquer de nouveaux styles aux éléments d’un design : roues de progression circulaires, graphiques en secteurs, roues chromatiques, compteurs de vitesse, etc.

Le plug-in à l’honneur : créez aisément de superbes présentations avec Presentation

Votre design doit raconter une histoire. Malheureusement, les outils de présentation n’ont pas toujours facilité la tâche des designers. Exportation d’artefacts, conception de diapositives attrayantes, recherche de graphiques, allers-retours incessants pour ajouter les dernières itérations de design… Autant de challenges auxquels Presentation for Adobe XD veut apporter une réponse.

Presentation est un nouveau plug-in pour Adobe XD qui simplifie et rend plus attractive la présentation de vos projets, grâce à un nouvel outil de design. Une fois le plug-in lancé, il vous suffit de faire votre choix parmi les nombreux thèmes, diapositives et éléments conçus par et pour des professionnels, directement dans l’interface d’ Adobe XD. Avec Presentation et XD, une simple modification des polices et des couleurs dans le panneau Actifs permet d’adapter la présentation à l’identité visuelle de la marque. Avec ses élégantes icônes vectorielles, formes, photos, illustrations et diagrammes, Presentation évite d’avoir à passer trop de temps sur la recherche du bon élément visuel.

Vous pouvez télécharger gratuitement le plug-in ici et obtenir des informations supplémentaires à son sujet sur le blog Adobe.