En tant que webdesigner, quel est le logiciel que vous devez absolument avoir sur votre ordinateur ? Il y a de fortes chances que ce soit Photoshop et Illustrator. Et bien que ce soient les éléments essentiels de votre flux de travail de conception, il existe des outils plus petits dont vous ne savez probablement pas que vous avez besoin.
La meilleure chose à faire est que vous n'avez même pas besoin de les télécharger --- installez simplement ces extensions Chrome et c'est parti. De l'identification des polices sur les pages à la mesure des distances entre les éléments Web, ces extensions Chrome de conception Web vous faciliteront la vie.
Dropbox a commencé comme un service d'hébergement de fichiers, mais il a rapidement découvert que son public principal était les concepteurs, qui utilisent le service pour partager leur travail avec des collègues. Étant donné que les fichiers de conception sont souvent trop volumineux pour les pièces jointes aux e-mails, il est plus facile d'envoyer un lien Dropbox vers le fichier.
Dropbox pour Gmail rend le processus encore plus pratique. Lorsque vous créez un lien vers votre fichier à l'aide d'un bouton Dropbox au bas de la nouvelle fenêtre d'e-mail, le destinataire obtient un aperçu de ce que vous envoyez. Les liens vers les fichiers image téléchargeront les images directement dans l'e-mail, et les liens vers d'autres types de fichiers généreront un aperçu pratique.
Installer : Dropbox pour Gmail
Avec des milliers de polices disponibles, vos possibilités de typographie sont infinies. Surtout si vous pouvez identifier une belle police que vous voyez quelque part et l'emprunter pour votre propre projet.
FontFace Ninja est une extension Chrome qui vous aide à faire exactement cela. Tout comme les outils qui trouvent des polices à partir d'images, il vous aide à identifier les polices que vous voyez en ligne. La seule différence est que FontFace Ninja lit les polices codées dans le CSS de la page, comme la police des titres et du corps du texte.
Lorsque vous lancez FontFace Ninja, il vous montrera les informations sur la police vers laquelle vous la dirigez --- et non seulement la police de caractères, mais aussi le poids, la taille, la hauteur, la largeur et la couleur. Pour mettre cette police en signet, vous aurez besoin d'un compte au service sœur, FontFace Dojo.
Installer : FontFace Ninja
Quel que soit votre sens de la couleur, il est difficile de recréer une teinte particulière que vous avez vue en ligne à moins de connaître ses valeurs RVB ou HTML. Heureusement, vous n'avez pas à deviner si vous avez ColorPick Eyedropper.
Comme les meilleures applications de sélection de couleurs pour Mac, ColorPick Eyedropper vous montrera les valeurs de n'importe quelle couleur sur laquelle vous pointez. La différence étant qu'il est toujours là dans votre navigateur et que vous n'avez rien à télécharger --- cliquez simplement sur l'icône et déplacez la cible au bon endroit.
L'extension lit les couleurs du texte, des images et à peu près tout ce que vous pourriez voir sur une page Web (même les publicités). Une fois que vous avez capturé une couleur, il vous montre les valeurs HTML, RVB et HSL pour celle-ci.
Installer : Pipette ColorPick
Cette extension open source est une trouvaille pour les concepteurs Web, surtout si vous faites des concerts ponctuels pour les petites entreprises. Lorsqu'un client vous propose un site Web sans aucun fichier ni documentation préalable et vous demande de concevoir "une page comme celle-ci, mais avec un texte et des images différents", il est difficile de déterminer la mise en page.
Les dimensions vous permettent de mesurer facilement la hauteur et la largeur de n'importe quel élément de la page, ainsi que les marges entre eux. Cela facilite la recréation de pages existantes et la vérification de vos propres conceptions après leur mise en production.
Installer : Dimensions
Visual Inspector est un puissant outil de rétroaction et de collaboration pour les équipes de conception, combinant les fonctionnalités des trois extensions précédentes et en ajoutant encore plus.
Dans l'onglet Inspecter , vous pouvez sélectionner n'importe quel élément de la page pour obtenir des informations complètes à son sujet, des dimensions au nom de fichier. Les couleurs et Typographie les sous-onglets vous permettent de voir la palette de couleurs et toutes les polices en un coup d'œil, tandis que les Actifs rassemble toutes les images de la page en un seul endroit.
Le Collaborateur est l'endroit où vous pouvez donner votre avis et discuter avec votre équipe, et il est facile de laisser un commentaire en cliquant sur n'importe quel élément de la page.
Comme la plupart des outils avancés, Visual Inspector est livré avec un prix :vous devrez payer à partir de 9 $/utilisateur/mois pour ajouter des commentaires et synchroniser les modifications. Cependant, ses fonctionnalités de base telles que l'inspection des couleurs, des polices et des images sont gratuites.
Installer : Inspecteur visuel
Une extension de capture d'écran peut sembler redondante, car prendre une capture d'écran sur Mac est un jeu d'enfant, et capturer votre écran sur Windows est juste un peu plus compliqué. Mais Easy Screen Capture a plusieurs arguments de vente.
Plus important encore, il vous permet de capturer toute la page Web, pas seulement la zone que vous voyez sur votre écran. Cela n'a pas de prix lorsque vous devez signaler plusieurs problèmes sur une longue page, et les capturer tous prendrait trois à quatre captures d'écran.
Une autre astuce consiste à pouvoir copier la capture d'écran dans le presse-papiers et à la coller directement dans un chat ou un e-mail, plutôt que d'accumuler des fichiers image inutiles sur votre ordinateur.
Installer : Capture d'écran facile
Enfin, il y a une tâche cruciale à laquelle vous devez vous attaquer tous les matins :se débarrasser des restes de sommeil et entrer dans le rythme. Muzli 2 par InVision vous servira de journal du matin avec des articles sélectionnés sur l'art, le design, l'expérience utilisateur et la technologie.
Muzli remplace votre onglet Chrome par défaut et vous permet de personnaliser ce que vous y voyez. En fonction de vos intérêts, Muzli sélectionnera des flux pour vous, avec des sites Web allant de Dribble et Behance à 99designs et Creative Bloq. Plein d'inspiration à feuilleter pendant que vous sirotez votre premier café !
Si vous pensez qu'un onglet de navigateur complet contenant du contenu de conception est trop intense, Muzli propose également une version Lite. Il ne remplacera pas votre onglet par défaut et vous pourrez accéder au flux quand vous le souhaitez en cliquant simplement sur l'icône de l'extension.
Installer : Mouzli 2
Les extensions Chrome de cette liste ne correspondent pas à votre logiciel de conception, mais elles couvrent toutes les petites choses qui accompagnent le fait d'être un concepteur --- qu'il s'agisse d'informations sur la typographie ou de collaborer avec vos collègues.
Une fois que vous réalisez que le Chrome Web Store regorge d'outils, il peut être difficile d'arrêter d'en ajouter de nouveaux. Alors apprenez à gérer vos extensions Chrome avant qu'elles ne deviennent incontrôlables.
