• Accueil / Salesforce / Créer des maquettes…
, Créer des maquettes d&rsquo;interface utilisateur Salesforce rapides: plug-in Lightning Design System pour Sketch<span class="wtr-time-wrap after-title"><span class="wtr-time-number">3</span> minutes de lecture</span>

Créer des maquettes d’interface utilisateur Salesforce rapides: plug-in Lightning Design System pour Sketch3 minutes de lecture


Le Lightning Design System est un cadre permettant de créer des expériences utilisateur dynamiques sur la plate-forme Salesforce et il dispose désormais d’un plugin gratuit pour Sketch.

Esquisser est une boîte à outils de conception conçue pour vous aider à créer des wireframes, des maquettes, des échantillons d’écrans et plus encore. Avec le plugin, vous pouvez rapidement créer des maquettes d’interfaces utilisateur Salesforce à l’aide de la collection de composants prédéfinis de ce plugin.

, Créer des maquettes d&rsquo;interface utilisateur Salesforce rapides: plug-in Lightning Design System pour Sketch<span class="wtr-time-wrap after-title"><span class="wtr-time-number">3</span> minutes de lecture</span>

Dans cet article, je vais vous montrer comment utiliser le plug-in Sketch pour concevoir et déployer rapidement des interfaces utilisateur Salesforce.

, Créer des maquettes d&rsquo;interface utilisateur Salesforce rapides: plug-in Lightning Design System pour Sketch<span class="wtr-time-wrap after-title"><span class="wtr-time-number">3</span> minutes de lecture</span>

Installer

Tout d’abord, vous devez obtenir l’application Sketch: vous pouvez profiter d’un essai gratuit ici. Il est généralement utilisé par les concepteurs de produits, mais il est très intuitif et facile à utiliser. Si j’ai compris les bases en quelques minutes, vous le pouvez aussi!

Conseil supérieur: Sketch n’est disponible que sur les ordinateurs Mac.

Une fois l’application prête, téléchargez le brancher.

Double-cliquez pour installer et appuyez sur Commande + J pour ouvrir dans Sketch. Vous verrez alors un écran similaire à l’image ci-dessous, assurez-vous de cocher toutes les options.

, Créer des maquettes d&rsquo;interface utilisateur Salesforce rapides: plug-in Lightning Design System pour Sketch<span class="wtr-time-wrap after-title"><span class="wtr-time-number">3</span> minutes de lecture</span>

Le fait de cocher toutes les options garantit que vous téléchargez toutes les bibliothèques disponibles afin que vous ayez toutes les icônes, graphiques, actions, etc. disponibles pour vos conceptions.

Essaye le!

Placez un nouveau plan de travail sur le canevas (insert + plan de travail) et choisissez à droite si vous concevez pour mobile, tablette ou bureau.

Vous remarquerez dans le plug-in Sketch qu’il existe une barre de recherche pour rechercher des composants; vous pouvez également parcourir les sections de navigation par bibliothèques.

En cliquant sur un composant, vous obtenez une description et, le cas échéant, les différentes variantes de ce composant.

Sélectionnez l’arrière-plan et la navigation dans le plan de travail standard, ajustez-les aux dimensions de votre toile Sketch. Vous pouvez ajouter des « cartes » pour définir certaines sections de page.

Vous pouvez insérer un chemin en tapant simplement dans la barre de recherche et en le faisant glisser du plugin dans votre canevas, recherchez un tableau de données, un bouton, une icône, une alerte, un graphique… vous le nommez!

, Créer des maquettes d&rsquo;interface utilisateur Salesforce rapides: plug-in Lightning Design System pour Sketch<span class="wtr-time-wrap after-title"><span class="wtr-time-number">3</span> minutes de lecture</span>

Vous verrez que plusieurs similitudes apparaissent dans la recherche, ils ont conçu cette fonctionnalité avec des synonymes de recherches facilement identifiables, de sorte que vous retournerez des résultats même si vos termes ne correspondent pas directement au nom.

Oui, c’est aussi simple que cela.

Et devine quoi? Il n’est pas nécessaire que ce soit Salesforce à la base, vous pouvez utiliser certains des composants pour vous aider à définir l’espacement et les zones sur votre canevas. Je faisais cela l’autre jour pour définir une page React de l’application Heruku.

Partagez-le

Ne passez pas trop de temps dessus, l’idée est que c’est rapide, vous pouvez donc créer une idée et la partager avec votre équipe.

Une fois que vous êtes prêt, exportez en sélectionnant le nom de votre plan de travail dans le canevas et vous verrez sur le côté droit les options d’exportation pour votre fichier (pdf, jpeg ou png).

Sommaire

Vous avez peut-être déjà utilisé un stylo et du papier ou un simple dessin Google pour discuter d’une idée de conception d’interface utilisateur, vous pouvez maintenant utiliser Sketch pour le faire avec une haute résolution et des spécifications, rapidement! En utilisant les composants prédéfinis à la volée, vous pouvez concevoir rapidement des prototypes d’application, ce qui réduit le gaspillage lors du développement sur la plate-forme Salesforce dans le système de conception Lightning.

Regarde ça Trailmix à Trailhead pour vous aider à démarrer.

, Créer des maquettes d&rsquo;interface utilisateur Salesforce rapides: plug-in Lightning Design System pour Sketch<span class="wtr-time-wrap after-title"><span class="wtr-time-number">3</span> minutes de lecture</span>





Source de l’article traduit automatiquement en Français

Besoin d'aide ?
Voulez-vous utiliser Pardot à sa capacité maximale et avoir
+ DE LEADS QUALIFIÉS

Notre analyse de votre Pardot offerte dès aujourd'hui
Merci, vous pouvez compléter notre questionnaire
Nous allons revenir vers vous rapidement !

Fermer