Débuter avec Gravit Designer

Gravit Designer est, à mon avis, le prochain grand programme d’édition de vecteurs. Il est convivial, de qualité professionnelle et véritablement multi-plateformes car il fonctionne dans le navigateur, sous Linux, Mac, ChromeOS et Windows, et sera disponible à une date ultérieure sur iPad et Android. Il est en cours de développement avec l'ajout rapide de nouvelles fonctionnalités..

Et en plus de tout cela, c'est également 100% gratuit, sans publicité ni méthode de monétisation intrusive. Selon Alex de Gravit, à la question de savoir si le programme restera gratuit:

«Oui, il restera définitivement libre et ne sera jamais handicapé par une stupide fremium ou quoi que ce soit. Nous proposerons peut-être plus tard des ressources supplémentaires pour les équipes (car nous devons également payer ces factures de serveur), mais le concepteur restera libre, car nous souhaitons que tout le monde puisse avoir accès à un outil de conception professionnel gratuit. ”

Dans ce didacticiel, je vais vous présenter les fonctionnalités qui rendent Gravit Designer si prometteur. Nous n'attaquerons pas trop les mauvaises herbes et ne mettrons tous les outils au microscope. Nous en donnerons un aperçu afin que vous obteniez la meilleure idée possible de ce qui est inclus dans ce logiciel. Commençons!

Installer et première exécution

Si vous souhaitez utiliser l'une des versions de bureau de Gravit head pour designer.io/#download et récupérez le programme d'installation correspondant à votre système d'exploitation. (Notez qu’à l’heure actuelle, il existe un bogue dans les menus déroulants de la construction de Linux, donc pour le moment, tous les pingouins préféreront peut-être utiliser la version du navigateur.).

Pour ceux qui préfèreraient utiliser la version du navigateur, qui présente l'avantage d'être toujours la plus récente et qui offre actuellement de meilleures performances, rendez-vous sur: designer.gravit.io/

Dès le début, les choses se gâtent. Nous sommes accueillis par un écran de bienvenue qui nous donne la possibilité de définir une hauteur et une largeur préférées pour notre document. Cependant, nous pouvons aussi laisser les champs hauteur et largeur vides et notre toile sera infinie; une fonctionnalité fantastique pour quand vous ne savez pas quelle taille votre design va être.

Également sur ce premier écran, vous avez le choix parmi plus de cinquante ensembles de dimensions prédéfinis, avec dix-neuf préréglages pour l'impression, huit pour la conception de sites Web, quinze pour la couverture et le contenu de médias sociaux, six pour les téléphones et les montres et sept pour les tablettes..

De plus, si vous vous inscrivez gratuitement à un compte Gravit Cloud, vous pouvez accéder à la nouvelle gamme de modèles prédéfinis en cliquant sur le bouton Nouveau à partir du modèle onglet à gauche de l'écran d'accueil.

Quelques modèles prédéfinis de Gravit sur les médias sociaux

Vous y trouverez cinquante graphiques de médias sociaux prêts à être utilisés, trente-six présentations de diapositives, dix-huit affiches, vingt-quatre graphiques de publication sur Facebook, vingt-trois graphiques de blog, vingt-six affiches A4 et vingt graphiques de cartes. Celles-ci sont toutes prêtes à être utilisées telles quelles, ou peuvent être utilisées comme base pour une itération. Cette collection est neuve il y a à peine quelques semaines, alors attendez-vous à la voir grandir avec le temps..

Aperçu rapide de l'interface

Heureusement, l'interface de Gravit Designer est assez intuitive, vous ne devriez donc pas vous perdre, même si vous explorez le logiciel en aveugle. Néanmoins, nous aurons un aperçu rapide des composants clés.

La première chose à savoir est que l’interface ne doit pas nécessairement être violette. Si vous creusez le violet, vous pouvez le laisser tel quel, mais si vous préférez une interface utilisateur monochrome, allez dans le menu principal en haut à gauche, choisissez Édition> Paramètres et sélectionnez “Dark Theme” ou “Light Theme”.

Les utilisateurs de Sketch trouveront l’interface un peu familière car la présentation est très similaire. En haut, nous avons notre barre d'outils avec tous les outils que vous pouvez espérer trouver dans une application vectorielle, tels que les contrôles de déplacement et de sélection de la toile, les outils de création et de sélection de chemins et de textes, le retournement et la rotation de formes, les opérations multi-formes, l'ordre d'empilement Touches de contrôle, d'exportation et de présentation. Notez également que plusieurs documents peuvent être ouverts en même temps et seront visibles via des onglets en haut à droite..

Sur le côté gauche, nous avons trois onglets: Couches, Bibliothèques et Tutoriels. L'onglet tutoriels (qui doit être déplacé vers Aidez-moi dans la barre de menus avec la version 3.2.) est un excellent guide pour la première utilisation de Gravit. L'onglet Bibliothèques vous offre une vaste collection de ressources par glisser-déposer. Ces ressources s'ajoutent aux modèles dont nous avons parlé plus haut. L'onglet Calques est ce que vous aurez le plus souvent ouvert, car il affiche une liste de vos pages (plus à venir sur les pages) et, bien sûr, vos calques..

Sur le côté droit, vous avez des contrôles de conception spécifiques au contexte pour l'objet actuellement sélectionné. Si rien n'est sélectionné, les paramètres du document seront affichés à la place..

Les pages; Comme des planches d'art avec bonus "Powerpoint"

Les pages de Gravit Designer sont un hybride des pages et des planches d’art que vous pourriez trouver dans d’autres applications. Chaque page est comme un document autonome, avec ses propres paramètres de dimensions, de fond perdu, de marge et de zone de travail. Vous commencez avec une seule page par défaut et vous en ajoutez d'autres en cliquant sur le petit bouton. Créer une nouvelle page bouton en haut à droite de la Des pages panneau. Vous pouvez ensuite afficher n’importe quelle page en la sélectionnant dans ce panneau..

Si vous souhaitez utiliser les pages de la même manière que les planches d’art, activez la bascule située à gauche de l’icône de suppression et vous verrez toutes vos pages en même temps en mode «Multipage». Ces pages peuvent être sélectionnées, déplacées, redimensionnées manuellement ou modifiées en différentes tailles prédéfinies, comme s'il s'agissait de documents individuels. En mode multipage, vous pouvez également dupliquer des pages en cliquant sur leur titre sur le canevas pour les sélectionner, puis ALT + glisser ou en appuyant CTRL / CMD + D.

Les pages Gravit ont également la fonction géniale «Pages maîtresses». Avec cette fonctionnalité, vous pouvez configurer une page pour qu'elle agisse en tant que «page maître», avec des éléments tels que des arrière-plans ou des en-têtes communs à d'autres pages. Vous pouvez ensuite configurer ces autres pages pour qu'elles tirent de cette page maître, en intégrant tout son contenu, sur lesquelles vous créez des éléments supplémentaires. Lorsque vous mettez à jour les éléments dans la page maître, toutes les autres pages seront également mises à jour en temps réel..

Et dans une fonctionnalité très intéressante, en utilisant les pages de Gravit, vous avez instantanément la possibilité de créer une présentation de type «PowerPoint». Il suffit de cliquer sur le Jouer bouton à l'extrême droite de la barre d'outils et chacune de vos pages devient une diapositive. Frappé le flèche vers le bas pour aller à la diapositive suivante, et le flèche vers le haut retourner.

Gravit jouant une présentation

Chemins et Formes

La création de chemins et de formes dans Gravit contient les outils habituels que vous pouvez vous attendre dans n'importe quel programme de graphisme vectoriel. Nous avons l'outil plume standard pour dessiner des lignes droites et des courbes de Bézier, ainsi qu'une série d'outils de forme prédéfinis pour les lignes, les rectangles, les ellipses, les polygones, les triangles et les étoiles.

Cependant, nous avons également un outil supplémentaire qui est très utile, et c’est le Bezigon outil. Si vous maintenez ALT avec l'outil bezigon, des courbes lisses seront automatiquement générées autour de chaque point.

Une fois les tracés et les formes dessinés, leurs propriétés peuvent être modifiées dans la colonne de droite. Les chemins normaux peuvent être ouverts ou fermés, ce qui permet de fermer facilement un chemin mal complété ou d'ouvrir un chemin afin de continuer à ajouter des points. Les formes ont des paramètres spécifiques au contexte, tels que la possibilité de convertir des ellipses en camembert, comme des formes, ou de définir le nombre de points qu'un polygone ou une étoile doit avoir..

Texte normal et texte sur un chemin

L'outil texte fonctionne également comme vous le souhaiteriez si vous utilisiez d'autres applications. Avec l'outil de texte sélectionné, vous pouvez cliquer sur un point pour commencer à taper du texte de taille dynamique, ou vous pouvez cliquer et faire glisser pour dessiner une zone dans laquelle le texte sera contraint..

Et dans une fonctionnalité qui sera très utile pour les concepteurs Web, si vous tapez "lorem" puis appuyez sur ESPACE vous obtiendrez un paragraphe du texte de substitution «Lorem ipsum» généré automatiquement pour vous.

Avoir du texte suivre un chemin est extrêmement facile avec Gravit. Dessinez simplement n'importe quel chemin ou forme, sélectionnez l'outil texte, survolez votre chemin jusqu'à ce qu'une ligne rouge apparaisse le long de celui-ci, puis cliquez sur. Cela instanciera du texte suivant qui suivra la forme du chemin. Le chemin peut être modifié par la suite et le texte mettra à jour sa forme en conséquence.

Lorsque vous sélectionnez le texte que vous avez placé sur un chemin d'accès, vous accédez également aux options de bas de page de la colonne de droite pour définir le texte à l'intérieur ou à l'extérieur du chemin et inverser le texte. Et il existe un moyen simple de positionner le texte - il suffit de cliquer et de faire glisser le petit marqueur orange au début du texte et c'est tout ce qu'il faut.

Polices Google intégrées

La plupart des concepteurs ont déjà utilisé le manège Web plusieurs fois: allez dans Google Fonts, choisissez une police, téléchargez-la, installez-la, (redémarrez l'application de conception, dans certains cas), sélectionnez-la dans l'application de conception. , répétez si cela ne semble pas correct. Ou peut-être pourrions-nous simplement utiliser Skyfonts pour ignorer l’étape «télécharger et installer».

Cependant, dans Gravit Designer, toute la sélection de polices Google est disponible directement en ligne. L'utilisation de polices Web est donc aussi simple que l'utilisation de polices classiques..

De plus, vous pouvez importer vos propres polices lorsque vous utilisez la version Web de Gravit avec Fichier> Importer> Ajouter des polices…

Bien sûr, la présence de polices Web ne signifie pas que vous ne pouvez pas utiliser les polices système. Tant que vous utilisez une version de bureau de Gravit, toutes vos polices locales seront également disponibles..

Remplissages et coups multiples

Quelque chose que j'aime dans Gravit et une autre fonctionnalité que les utilisateurs de Sketch connaissent bien sont les remplissages et les contours multiples. Dans de nombreuses applications, si vous souhaitez créer des effets composites en plaçant, par exemple, du bruit sur des images en mosaïque sur une couleur plate, vous devez dupliquer votre forme cible à chaque fois. Dans Gravit, ce n'est pas nécessaire car vous pouvez ajouter autant de fonds et de contours que vous le souhaitez pour n'importe quelle forme:

Chaque remplissage ou bordure se comporte comme un calque séparé, avec ses propres paramètres d'état ou de masquage, de mode de fusion et d'opacité. Les remplissages peuvent également être triés dans l'ordre de votre choix. Et comme vous pouvez utiliser des couleurs plates, des textures d’image, des dégradés ou du bruit, vous avez beaucoup de place pour la créativité..

Effets; Mieux que les styles de calque

Les effets dans Gravit ressemblent beaucoup aux effets de calque que vous connaissez bien dans d’autres applications, mais, tout comme les remplissages et les traits, vous n’êtes pas limité à un effet par calque; vous pouvez en avoir autant que vous voulez.

Les effets incluent le tarif standard d'ombre portée (double en tant que rayonnement externe), d'ombre interne (en double en tant que rayonnement interne) et de superposition (couleur ou dégradé). Les effets de trait et les superpositions de motifs sont bien entendu inutiles en raison des outils de remplissage et de trait existants de Gravit. Cependant, il existe également des effets supplémentaires vraiment intéressants, tels que «miroir», qui crée un effet de réflexion sous la forme, ou «ombre incurvée», qui crée une ombre comme celle-ci: 

Il existe également un flou gaussien, une vignette, un simple effet de recoloration du curseur de teinte et un effet de réglage de la couleur plus en profondeur. Tous ces effets peuvent être superposés et configurés à votre guise, puis modifiés et reconfigurés à tout moment du processus de conception..

Styles partagés; pour les états et gagner du temps

Gravit a la possibilité de créer des styles qui définissent les paramètres de remplissage, de bordure, d'effets et de texte d'un calque. Ces styles ont quelques applications super bénéfiques.

Premièrement, vous pouvez créer des styles pour représenter différents états sur la même forme, par exemple l'apparence par défaut et le survol d'un bouton, par exemple.. Deuxièmement, vous pouvez appliquer un style à plusieurs objets sur le canevas. Lorsque vous mettez à jour le style sur l'un de ces objets, vous pouvez également l'appliquer à tous les autres..

Des ancres pour la semi-réactivité

Les paramètres d'ancrage vous permettent de définir le mode de réponse d'une forme lorsque son parent est redimensionné, ce qui vous permet de créer une fonctionnalité semi-réactive et de gagner un temps considérable..

Dupliquer la page (en haut) ancrée en haut, en bas et au centre horizontal pour contrôler sa réponse à un parent redimensionné

Par exemple, si vous créez une interface utilisateur devant fonctionner sur plusieurs tailles d'écran, vous pouvez créer votre mise en page avec une taille unique, puis définir des points d'ancrage pour contrôler la manière dont les éléments de la conception doivent être étirés, réduits ou déplacés lorsque la taille du document change. Vous pouvez ensuite créer un duplicata de la page actuelle et le redimensionner, en conservant la majorité de votre conception existante sans avoir à la refaire..

Emballer

Gravit Designer est déjà un logiciel fantastique, très prometteur pour l'avenir. Dans la prochaine version, la version 3.2, nous verrons l'inclusion de symboles, qui pourraient constituer pour certains utilisateurs la dernière pièce du puzzle des exigences. Pour voir tout ce qui va se passer dans les prochaines versions, consultez la feuille de route.

Gravit est puissant, flexible, activement développé, vraiment multi-plateforme et totalement gratuit. Quelle que soit votre raison de travailler avec des vecteurs, Gravit Designer vaut absolument la peine de vérifier.

Pour en savoir plus, visitez: designer.io.