10 outils dont je ne peux pas me passer


Quel que soit votre niveau de compétence en tant que designer, vous avez besoin d’outils. Un chirurgien ne peut pas opérer sans scalpel ; il en va de même pour les concepteurs. Pour que le travail soit efficace, vous devez disposer d’outils appropriés dans votre arsenal.

Les outils ne font certainement pas l’artisan, mais ils rendent votre travail plus facile (et surtout plus amusant).

Il y a tellement d’outils disponibles aujourd’hui qu’il peut être décourageant de commencer à chercher les bons outils pour vous. Dans cette série semi-régulière, les concepteurs nous présentent les outils sur lesquels ils s’appuient régulièrement ; certains peuvent correspondre exactement à ce que vous recherchez, d’autres vous sont peut-être déjà familiers, d’autres encore ne vous plaisent peut-être pas du tout.

Aujourd’hui, Marvellous Aham-adi nous présente les outils qu’il utilise pour concevoir…

1. Sketch

Codage de la Bohème Sketch est un éditeur de graphiques vectoriels pour macOS. Ce puissant outil vectoriel est utilisé pour la conception d’interfaces utilisateur de bureau et mobiles, la création de maquettes et de prototypes, et permet également la collaboration entre les concepteurs.

Le principal inconvénient de cet outil est qu’il s’agit d’une application réservée aux Mac, donc seuls les utilisateurs de Mac peuvent l’utiliser. De plus, l’outil est convivial. Il n’a pas une courbe d’apprentissage abrupte, contrairement à d’autres outils de conception. L’outil a été créé strictement pour la conception de sites web et d’applications, il n’y a donc pas de fonctionnalités inutiles qui regroupent l’interface de conception. Cela rend la conception plus facile et moins compliquée. Autre avantage : comme il s’agit d’une application vectorielle, la taille des fichiers est nettement plus petite.

Vous pouvez choisir parmi des centaines de plugins et d’extensions qui vous aident à tout faire, de la création de graphiques avec des données aléatoires, tabulaires ou JSON. Vous pouvez également créer des maquettes 3D dans Sketch en contrôlant totalement les angles et les perspectives. Il est également fourni avec un compresseur SVGO, Bitmap Compressor, et permet de saisir facilement des images à partir d’Unsplash.

sketch

2. Procréer

Procréer est une application d’illustration numérique puissante et intuitive pour iPad. L’application vous permet de créer des illustrations, des animations, de riches peintures et des croquis. Grâce à ses outils de création et à ses caractéristiques uniques, elle peut servir de studio d’art complet.

L’application est accompagnée d’une immense bibliothèque de plus de 200 pinceaux artisanaux. Vous avez accès à des pinceaux d’artistes, des crayons, des encres et des fusains. Vous pouvez également fabriquer vos propres pinceaux personnalisés ou personnaliser n’importe quel pinceau selon votre style grâce au Brush Studio. Il est également doté d’un moteur graphique Valkyrie qui vous permet de dessiner, de peindre et de faire des croquis à une vitesse incroyable. Le moteur tire parti de la technologie ProMotion d’Apple pour vous aider à obtenir les meilleures performances de votre iPad.

Il est également doté de fonctions uniques comme QuickShape qui vous aide à obtenir la forme parfaite à chaque fois et StreamLine qui vous aide à créer des traits avec des courbes plus douces et moins d’imperfections.

procréer

3. Dribbble

Dribbble est un réseau social pour les designers. L’application est une ressource incontournable pour découvrir et se connecter avec les meilleurs designers et créatifs du monde. Dribbble peut être utilisé pour créer votre portfolio personnel, trouver l’inspiration et interagir avec d’autres designers.

Ce que j’aime dans cet outil, c’est son utilisation de métaphores sur le basket. Ses utilisateurs sont appelés « Dribbblers ». Les Dribbblers peuvent poster des « shots » (images de taille 800 x 600). Dribbble possède une fonctionnalité appelée « seau » qui est similaire aux tableaux de Pinterest. Les autres utilisateurs peuvent aimer, commenter ou suivre votre seau. Vous pouvez également « rebondir » en postant un dessin inspiré par un autre post. Vous pouvez également créer des concours de design, également appelés « playoffs ». Les agences de design peuvent créer des « équipes » afin que leurs designers puissent collaborer en un seul endroit.

Dribbble sert également de marché. Si vous êtes un designer indépendant à la recherche d’un emploi dans le domaine du design, vous devriez donc consulter régulièrement la plateforme.

dribbble

4. Adobe Capture

Adobe Capture est un puissant convertisseur de vecteurs qui vous permet de convertir des images sur vos appareils mobiles en motifs, thèmes de couleurs, types, brosses et formes. Vous pouvez ensuite utiliser ces atouts dans d’autres outils de création comme Adobe Photoshop et Illustrator.

L’outil vous permet de convertir un objet ou toute votre photo en un graphique vectoriel. Vous pouvez ajuster le contraste sur la quantité de détails que vous souhaitez capturer et également inverser les zones en noir et blanc sur l’image vectorielle.

L’une de mes caractéristiques préférées est la possibilité de créer des palettes personnalisées. Vous pouvez choisir les couleurs de vos photos pour les utiliser dans un projet. Vous pouvez prendre une photo et utiliser les couleurs qu’elle contient pour créer une palette. Ainsi, si vous voyez un dessin visuellement agréable et que vous ne savez pas de quelle couleur il s’agit exactement, vous pouvez capturer l’image, et Capture créera automatiquement une palette pour vous.

L’application offre également la possibilité de convertir n’importe quelle partie de votre image en brosses, de créer des motifs kaléidoscopiques à partir de photos, de collecter des textures 3D et de créer vos propres matériaux 3D de haute qualité (PBR) à utiliser dans Adobe Dimension.

capture

5. InVision Studio

Studio InVision est un outil de prototypage et d’animation avancé qui permet de créer des dessins d’écran vectoriels. Grâce à ses couches flexibles et à son canevas infini, vous pouvez concevoir des flux de travail à une vitesse incroyable. L’outil vous permet de créer des prototypes intéressants, de tester vos conceptions et d’y apporter des modifications avant la phase de développement, et également de communiquer vos idées de conception à votre équipe ou à vos clients.

InVision Studio fonctionne sur Mac et Windows. Vous pouvez importer des fichiers de Sketch dans InVision. Parmi ses caractéristiques intéressantes, citons le recadrage intelligent des images qui recadre automatiquement les images lorsque vous changez la taille de l’écran. Vous pouvez créer un prototype réactif sans écrire une ligne de code, tester une animation ou un prototype sur votre téléphone, créer des déclencheurs de balayage pour les animations qui se produisent sur un défilement, et relier plusieurs planches de dessin en une seule animation.

invision

6. Wappalyzer

Wappalyzer est un outil qui vous permet de découvrir avec quelle technologie les sites web sont construits. La meilleure partie est qu’il est gratuit et que vous pouvez consulter n’importe quel site web. Il est fourni avec une extension gratuite pour Chrome, Edge et Firefox qui fonctionne en local et hors ligne.

L’API Wappalyzer vous donne un accès instantané à la pile technologique d’un site web, enrichit vos propres données et analyse un grand nombre de sites web en temps réel. Vous pouvez effectuer jusqu’à 1000 recherches en même temps.

wappalyzer

7. Validateur CSS du W3C

W3C CSS Validator est un outil simple mais efficace qui vous permet de vérifier la validité du balisage des documents Web en HTML, XHTML, SMIL, MathML, etc. Pour valider une URL, il suffit de mettre l’adresse et de faire le test. L’outil détecte également automatiquement le codage des caractères et le type de document. Vous pouvez également nettoyer le balisage avec HTML-tidy, regrouper les messages d’erreur par type et valider les messages d’erreur.

css-validator

8. Figma

Figma est un outil de conception d’interface utilisateur/UX en ligne qui permet aux équipes de collaborer en temps réel. Grâce à ses capacités de prototypage interactif, vous pouvez créer des illustrations vectorielles, des applications de conception et des écrans. Bien qu’il s’agisse d’un outil basé sur un navigateur, il existe des versions qui fonctionnent sur Windows et Mac.

Avec Figma, vous pouvez créer des bibliothèques avec des composants réutilisables. Lorsqu’un composant de la bibliothèque est mis à jour, des modifications sont automatiquement apportées à toute conception qui utilise ce composant. Les bibliothèques d’équipe ne sont disponibles que sur la version payante. Vous pouvez également générer du code CSS et SVG, iOS et Android ; exporter des fichiers au format JPG, PDF, PNG ou SVG, et également importer des fichiers Sketch. Vous pouvez également automatiser les tâches répétitives, créer des flux de travail personnalisés et introduire des données à l’aide de plugins.

figma

9. Proto.io

Proto.io est un outil qui permet de créer des prototypes haute-fidélité en temps réel. Avec cet outil, vous pouvez tester vos conceptions avant de construire. Vous pouvez tester le flux, les interactions et les animations sans avoir à écrire un seul morceau de code.

L’outil est fourni avec des modèles personnalisables qui vous aident à créer facilement des prototypes et des filières. Il est également fourni avec une énorme bibliothèque d’icônes (y compris des icônes animées) qui peuvent être redimensionnées et recolorées. Grâce à sa bibliothèque d’effets, vous pouvez également ajouter des interactions, des sons, des animations et des fichiers vidéo à vos prototypes. Comme il s’agit d’un éditeur 100% web, vous n’avez pas besoin de télécharger de logiciel.

proto

10. Démarrage 3

Démarrage 3 est une application qui aide les concepteurs et les développeurs à créer des thèmes de sites web Bootstrap. Il s’agit d’un puissant générateur de thèmes Bootstrap par glisser-déposer pour vous aider à créer des pages d’atterrissage. Il dispose d’une interface intuitive facile à utiliser et sans courbe d’apprentissage.

Vous avez accès à plus de 300 blocs d’éléments et de styles pré-codés et pré-conçus que vous pouvez facilement personnaliser. Les dessins de l’application sont automatiquement optimisés pour les mobiles et sont compatibles avec tous les appareils de la rétine. Elle s’intègre également à d’autres outils comme Hubspot, MailChimp, Gmail et Captcha. Vous pouvez également exporter tous les designs de votre site web (y compris les images, le texte et les styles) directement sur votre PC.

startup