Share
Dans les étapes suivantes, vous apprendrez à créer un ensemble de curseurs de main parfaits au pixel dans Adobe Illustrator. Pour commencer, vous apprendrez à préparer votre nouveau document et à configurer une grille simple. Ensuite, à l'aide de l'outil Rectangle, de l'outil Ellipse, de l'outil Plume et de l'effet Coins arrondis, vous apprendrez à créer les formes qui constituent vos curseurs de main. Pour continuer, en utilisant des techniques de base de construction de formes vectorielles, un trait simple, un dégradé linéaire, des effets d’ombre portée et un effet de transformation simple, vous apprendrez à ajouter de la couleur, des surbrillances et des ombres pour les derniers curseurs de la main..
Frappé Contrôle + N créer un Nouveau document. Entrer 600 dans le Largeur boîte et 300 dans le la taille case puis cliquez sur le Avancée bouton. Sélectionner RVB, Écran (72ppi) et assurez-vous que le Aligner de nouveaux objets sur la grille de pixels la case est décochée avant de cliquer D'accord.
Activer le la grille (Voir> Afficher la grille) et le Aligner sur la grille (Voir> Aligner sur la grille). Vous aurez besoin d'une grille chaque 1px, si simplement aller à Édition> Préférences> Guides> Grille, entrer 1 dans le Quadrillage tous les boîte et 1 dans le Subdivisions boîte. Vous devriez aussi ouvrir le Info panneau (Fenêtre> Info) pour un aperçu en direct avec la taille et la position de vos formes. N'oubliez pas de définir l'unité de mesure en pixels de Édition> Préférences> Unités> Général. Toutes ces options augmenteront considérablement votre vitesse de travail.
Choisissez le Outil Rectangle (M) et concentrez-vous sur votre barre d'outils. Supprimez la couleur du trait, sélectionnez le remplissage et définissez sa couleur sur rouge (R = 237 G = 28 B = 36). Déplacer vers votre Artboard, créez simplement un 4 x 15px rectangle et abaisser son Opacité à 30%. En diminuant l'opacité de la forme, vous pourrez voir plus facilement la grille à l'arrière, ce qui vous permettra de mieux comprendre le positionnement exact de chaque forme. Assurez-vous que votre rectangle est toujours sélectionné et allez à Effet> Styliser> Coins arrondis. Entrez un 2px rayon et clic D'accord.
Assurez-vous que le Outil Rectangle (M) reste actif, créez un 6 x 10px forme, placez-le comme indiqué dans la deuxième image, abaissez son Opacité à 30% et frapper Maj + Contrôle + E d'ajouter ce même 2px Coins arrondis effet. Créer un 6 x 9px forme, placez-le comme indiqué dans la troisième image, abaissez son Opacité à 30% et frapper Maj + Contrôle + E. Enfin, créez un 6 x 7px forme, placez-le comme indiqué dans la quatrième image, abaissez son Opacité à 30% et frapper Maj + Contrôle + E.
En utilisant le Outil Ellipse (L), créer un 4px cercle, remplissez-le du même rouge (R = 237 G = 28 B = 36), placez-le comme indiqué dans l'image suivante et abaissez son Opacité à 30%. Basculer vers le Outil Rectangle (M), créé un 8 x 10px forme, placez-le comme indiqué dans l'image suivante et abaissez son Opacité à 30%.
Concentrez-vous sur le côté droit de votre rectangle et sélectionnez le Outil stylo (P). Définissez la couleur de remplissage en noir, abaissez le Opacité à 30% et créez un chemin "L" comme indiqué dans la première image. Assurez-vous que ce nouveau chemin reste sélectionné, ajoutez un quatrième point d'ancrage comme indiqué dans la deuxième image et faites glisser les poignées 2px vers le haut et 1px vers la droite. Montez, ajoutez un cinquième point d'ancrage comme indiqué dans la troisième image et faites glisser les poignées 2px vers le haut. Tenez le Alt touche de votre clavier, Cliquez sur sur ce cinquième point d'ancrage alors simplement Cliquez sur sur le point d'ancrage de départ pour fermer le chemin.
Concentrez-vous sur le côté gauche de votre rectangle rouge, sélectionnez le Outil stylo (P) et créez un chemin comme indiqué dans la première image. Assurez-vous que ce nouveau chemin reste sélectionné, ajoutez un quatrième point d'ancrage comme indiqué dans la deuxième image et faites glisser les poignées 2px vers le haut et 1px vers la gauche. Descendez, ajoutez un cinquième point d'ancrage comme indiqué dans la troisième image et faites glisser les poignées vers le bas. Tenez le Alt touche de votre clavier, Cliquez sur sur ce cinquième point d'ancrage alors simplement Cliquez sur sur le point d'ancrage de départ pour fermer le chemin. Enfin, assurez-vous que la forme créée dans cette étape est remplie de noir et abaissez sa Opacité à 30%.
Sélectionnez toutes les formes créées jusqu'à présent et Groupe leur (Contrôle + G). Déplacer vers le Couches panneau (Fenêtre> Calques), double-cliquez sur ce nouveau groupe et nommez-le "pointerHandCursor". Dupliquer ce groupe (Contrôle + C> Contrôle + F), sélectionnez la copie et faites-la glisser vers la droite, comme indiqué dans la deuxième image. Retour à la Couches panneau et nommez ce nouveau groupe "palmHandCursor". Continuez à vous concentrer sur ce deuxième groupe, sélectionnez les quatre rectangles arrondis et supprimez-les simplement.
Concentrez-vous sur votre "palmHandCursor"groupe et choisissez le Outil Rectangle (M). Créer un 4 x 13px la forme et le placer comme indiqué dans la première image. Remplissez-le de rouge, baissez son Opacité à 30% et allez à Effet> Styliser> Coins arrondis. Entrez un rayon de 2px et cliquez sur D'accord. Assurez-vous que le Outil Rectangle (M) reste actif, créez un 4 x 14px forme, placez-le comme indiqué dans la deuxième image, abaissez son Opacité à 30% et frapper Maj + Contrôle + E.
Créer une seconde, 4 x 14px forme, placez-le comme indiqué dans la troisième image, abaissez son Opacité à 30% et frapper Maj + Contrôle + E. Enfin, créez un 4 x 11px forme, placez-le comme indiqué dans la quatrième image, abaissez son Opacité à 30% et frapper Maj + Contrôle + E. Focus sur le Couches panneau, sélectionnez les quatre rectangles arrondis créés dans cette étape et faites-les simplement glisser à l'intérieur du "palmHandCursor"groupe.
Dupliquer (Contrôle + C> Contrôle + F) votre "palmHandCursor"groupe, sélectionnez la copie et faites-la glisser vers la droite, comme indiqué dans la deuxième image. Revenir à la Couches panneau et nommez ce nouveau groupe "fistHandCursor". Continuez à vous concentrer sur ce troisième groupe, sélectionnez les quatre rectangles arrondis ainsi que le 20px cercle et simplement les supprimer.
Concentrez-vous sur votre "fistHandCursor"groupe et saisissez le Outil Ellipse (L). Créer un 6px cercle, remplissez-le de rouge, baissez son Opacité à 30% et placez-le comme indiqué dans la première image. Choisissez le Outil Rectangle (M). Créer un 4 x 9px la forme et placez-le comme indiqué dans la deuxième image. Remplissez-le de rouge, baissez son Opacité à 30% et allez à Effet> Styliser> Coins arrondis. Entrez un 2px rayon et clic D'accord. Assurez-vous que le Outil Rectangle (M) reste actif, créez un 4 x 10px forme, placez-le comme indiqué dans la troisième image, abaissez son Opacité à 30% et frapper Maj + Contrôle + E.
Créer un 4 x 9px forme, placez-le comme indiqué dans la quatrième image, abaissez son Opacité à 30% et frapper Maj + Contrôle + E. Enfin, créez un 4 x 7px forme, placez-le comme indiqué dans la cinquième image, abaissez son Opacité à 30% et frapper Maj + Contrôle + E. Focus sur le Couches panneau, sélectionnez les quatre rectangles arrondis et le 6px cercle fait dans cette étape et faites-les simplement glisser à l'intérieur du "fistHandCursor"groupe.
Sélectionnez votre "pointerHandCursor"groupe, allez à Objet> Développer l'apparence puis ouvrez le Éclaireur panneau (Fenêtre> Pathfinder) et cliquez sur le Unir bouton. Sélectionnez la forme obtenue, augmentez le Opacité à 100% et se concentrer sur la Apparence panneau (Fenêtre> Apparence). Supprimer la couleur du remplissage, ajouter un 1 pt accident vasculaire cérébral et sélectionnez-le. Définir la couleur à R = 70 G = 70 B = 70, alignez-le à l'intérieur et ouvrez le Accident vasculaire cérébral panneau (Fenêtre> Course). Focus sur le Coin section et vérifiez simplement la Joindre rond bouton. Une fois que vous avez terminé, allez à Objet> Chemin> Contour de contour.
Choisissez le Outil Rectangle (M), créer deux, 1 x 3px formes, un 1 x 4px forme et un 1 x 5px forme. Remplissez les quatre formes avec R = 70 G = 70 B = 70 et placez-les comme indiqué dans la quatrième image. Une fois que vous avez terminé, sélectionnez toutes les formes créées à cette étape et cliquez sur le bouton. Unir bouton du Éclaireur panneau.
En utilisant le Outil Rectangle (M), créer un 21 x 26px rectangle, remplissez-le de blanc, placez-le comme indiqué dans la première image et renvoyez-le au verso (Maj + Ctrl + [ ). Sélectionnez ce rectangle blanc avec le contour de la main et cliquez sur le bouton Diviser bouton du Éclaireur panneau. Assurez-vous que le groupe résultant est sélectionné et appuyez simplement sur Maj + Contrôle + G à Dissocier il. Sélectionnez la forme blanche extérieure et supprimez-la, puis sélectionnez la forme blanche intérieure et remplacez le blanc par le dégradé linéaire indiqué dans l'image finale..
Désactiver le Aligner sur la grille (Voir> Aligner sur la grille) ensuite aller à Édition> Préférences> Général et assurez-vous que le Incrément de clavier est fixé à 1px. Resélectionnez la forme remplie avec le dégradé linéaire et effectuez deux copies devant (Contrôle + C> Contrôle + F> Contrôle + F). Sélectionnez la copie du haut et appuyez une fois sur la flèche droite pour la déplacer de 1 pixel vers la droite. Resélectionnez les deux copies et Cliquez sur la Minus Front bouton du Éclaireur panneau. Sélectionnez le groupe de formes obtenu, transformez-le en un Chemin composé (Contrôle + 8 ou Objet> Chemin composé> Marque) et définissez la couleur de remplissage sur R = 205 G = 205 B = 205.
Resélectionnez la forme remplie avec le dégradé linéaire et effectuez deux autres copies devant (Contrôle + C> Contrôle + F> Contrôle + F). Sélectionnez la copie du haut et appuyez une fois sur la flèche gauche pour la déplacer 1px vers la gauche. Resélectionnez les deux copies et cliquez sur le bouton Minus Front bouton du Éclaireur panneau. Sélectionnez le groupe de formes obtenu, transformez-le en un Chemin composé (Contrôle + 8 ou Objet> Chemin composé> Marque) et définir la couleur de remplissage en blanc.
Resélectionnez la forme remplie avec le dégradé linéaire et allez à Effet> Styliser> Ombre portée. Entrez les propriétés affichées dans la fenêtre de gauche (dans l'image suivante), cliquez sur D'accord et aller encore à Effet> Styliser> Ombre portée. Entrez les propriétés affichées dans la fenêtre de droite (dans l'image suivante) et cliquez sur D'accord.
Activer le Aligner sur la grille (Voir> Aligner sur la grille). En utilisant le Outil Rectangle (M), créer un 1 x 3px façonner et le remplir avec R = 215 G = 215 B = 215. Placez ce petit rectangle comme indiqué dans l’image suivante et allez à Effet> Distorsion & Transformation> Transformer. Entrez les propriétés indiquées ci-dessous et cliquez sur D'accord.
Sélectionnez votre "palmHandCursor"groupe, allez à Objet> Développer l'apparence et cliquez sur le Unir bouton du Éclaireur panneau. Sélectionnez la forme obtenue, augmentez le Opacité à 100% et se concentrer sur la Apparence panneau (Fenêtre> Apparence). Supprimer la couleur du remplissage, ajouter un 1 pt accident vasculaire cérébral et sélectionnez-le. Définir la couleur à R = 70 G = 70 B = 70, alignez-le à l'intérieur et vérifiez la Joindre rond bouton du Accident vasculaire cérébral panneau. Une fois que vous avez terminé, allez à Objet> Chemin> Contour de contour.
Choisissez le Outil Rectangle (M), créer deux, 1 x 8px des formes et un 1 x 7px forme. Remplissez les quatre formes avec R = 70 G = 70 B = 70 et placez-les comme indiqué dans la troisième image. Prenez le Outil de sélection directe (A), concentrez-vous sur la partie supérieure du rectangle de gauche, sélectionnez le point d'ancrage de gauche et faites-le simplement glisser 1 pixel vers le bas. Une fois que vous avez terminé, sélectionnez toutes les formes créées à cette étape et cliquez sur le bouton. Unir bouton du Éclaireur panneau.
Concentrez-vous sur le contour de la main créé à l'étape précédente et répétez les techniques et les effets utilisés pour le curseur de la main du pointeur. À la fin, les choses devraient ressembler à l'image suivante.
Sélectionnez votre "fistHandCursor"groupe, allez à Objet> Développer l'apparence et cliquez sur le Unir bouton du Éclaireur panneau. Sélectionnez la forme obtenue, augmentez le Opacité à 100% et se concentrer sur la Apparence panneau (Fenêtre> Apparence). Supprimer la couleur du remplissage, ajouter un 1 pt accident vasculaire cérébral et sélectionnez-le. Définir la couleur à R = 70 G = 70 B = 70, aligner à l'intérieur et aller à Objet> Chemin> Contour de contour.
Choisissez le Outil Rectangle (M), créer trois, 1 x 4px des formes et un 1 x 2px forme. Remplissez les quatre formes avec R = 70 G = 70 B = 70 et placez-les comme indiqué dans la troisième image. Prenez le Outil de sélection directe (A), se concentrer sur la partie supérieure du milieu 1 x 4px rectangle, sélectionnez le point d’ancrage gauche et glissez-le simplement 1px vers le bas. Se déplacer vers la droite 1 x 4px rectangle, concentrez-vous sur le dessus, sélectionnez le point d’ancrage de droite et faites-le simplement glisser vers le bas. Une fois que vous avez terminé, sélectionnez toutes les formes créées à cette étape et cliquez sur le bouton. Unir bouton du Éclaireur panneau.
Concentrez-vous sur le contour de la main créé à l'étape précédente et répétez les techniques et les effets utilisés pour les deux autres curseurs. À la fin, les choses devraient ressembler à l'image suivante.
Voici à quoi cela devrait ressembler. J'espère que vous avez apprécié ce tutoriel et que vous pouvez appliquer ces techniques à vos projets futurs..
Si vous souhaitez créer le bouton S'abonner, consultez ce didacticiel astucieux sur la création d'un bouton avec juste une ligne de texte dans le panneau Apparence.!
Accentsconagua