hideout-lastation.com
Paradis Pour Les Concepteurs Et Les Développeurs


Comment dessiner l'icône Apple iCloud - Tutoriel Photoshop

iCloud, le nouveau service de stockage en nuage introduit par l'Apple a un logo assez simple mais beau. L'icône est faite de matériaux métalliques et a une icône de nuage extrudé sur le dessus. Vous ne le savez peut-être pas, mais la création de ce type d'icône est vraiment très facile, et voici l'icone iCloud que nous vous apprendrons à dessiner dans ce post, en utilisant Photoshop!

Ça a l'air un peu compliqué, mais en fait, tout ce dont nous avons besoin, ce sont des styles de calques, des formes vectorielles de base et un peu de dessin manuel. Entrons-y!

Étape 1

Commencez par créer un nouveau fichier avec la taille 512 x 512 px. Activer l'outil Rectangle arrondi. Dans la barre d'options, définissez son rayon sur 75 px. Cliquez et faites glisser pour dessiner un rectangle arrondi. Définissez sa couleur sur # 5d5d5d.

Double-cliquez sur le calque pour ouvrir la boîte de dialogue Style de calque. Ajoutez une superposition de dégradés avec un dégradé par défaut, du noir au blanc, et réduisez son opacité à 76%.

Étape 2

Appuyez sur Ctrl + J pour dupliquer la forme du calque. Cliquez sur Edition> Transformation libre ou appuyez sur Ctrl + T pour effectuer la transformation. Dans la barre d'options, définissez sa taille sur 98%.

Dans le panneau Calques, supprimez le style de calque en faisant glisser l'icône fx sur l'icône de la corbeille, en bas à droite du panneau Calques. Ensuite, double-cliquez sur la vignette des calques pour faire apparaître la boîte de dialogue Style de calque. Ajouter une ombre intérieure et une superposition de dégradés.

Dans le paramètre Incrustation du dégradé, définissez le style du dégradé sur l'angle. Cliquez sur la zone d'aperçu du dégradé pour ouvrir l'éditeur de dégradés et utilisez la combinaison de couleurs # 8e8e8e, # a5a4a4 et # d8d8d8. N'hésitez pas à jouer avec chaque position du marqueur, assurez-vous de définir la même couleur dans le premier et le dernier marqueur.

C'est le résultat après l'ajout de styles de calque.

Étape 3

Créer un nouveau calque Remplissez-le avec le dégradé radial du blanc au noir.

Maintenez Alt et faites glisser le masque vectoriel du calque précédent vers le calque courant. Le dégradé est maintenant ajusté à l'intérieur de l'icône.

Ouvrez le style de calque et changez son mode de fusion en écran.

Étape 4

Dessinez un rectangle arrondi à l'intérieur de l'icône. Définissez son rayon à 75px avec la couleur # 2a2a2a.

Ajouter 2 autres formes de cercle (Choisissez l'outil Ellipse, maintenez la touche Maj enfoncée et faites-la glisser). Dans la barre d'options, définissez le mode de chemin sur Ajouter à la zone de forme.

Double-cliquez sur le calque du nuage, puis ajoutez Ombre interne, Biseau et estampage et Trait.

Étape 5

Dupliquer le calque du nuage en appuyant sur Ctrl + J. Supprimer son style de calque en faisant glisser l'icône fx de sa vignette de calque sur l'icône de la corbeille. Redimensionnez-le (Ctrl + T) à 89%.

Changez la couleur de la forme en # 5d5d5d. Réorganiser la position de chaque forme jusqu'à ce que la petite taille des nuages ​​soit proportionnelle au plus grand nuage.

Double-cliquez sur le calque du nuage et ajoutez les styles de calque suivants.

Pour l'incrustation en dégradé, veillez à utiliser le paramètre exact de l'incrustation en dégradé à l'étape 2.

Voici ce que nous avons après avoir ajouté des styles de calque au petit nuage.

Étape 6: Ajouter une texture de métal

La conception actuelle est très plate et trop propre. Ajoutons une texture métallique subtile sur la surface. Créer un nouveau calque Cliquez sur Edition> Remplir et sélectionnez Utiliser: Noir pour remplir le nouveau calque avec du noir.

Cliquez sur Filtre> Bruit> Ajouter un bruit.

Cliquez sur Filtre> Flou> Flou radial. Sélectionnez Flou Méthode: Essorage et Qualité: Meilleur.

Ce filtre fera tourner le bruit et créera une onde circulaire.

Étape 7

Cliquez sur Image> Réglages> Niveau ou appuyez sur Ctrl + L. Dans la boîte de dialogue, faites glisser le curseur noir dans les niveaux de sortie vers le centre pour éclaircir l'onde circulaire.

Maintenez Alt et faites glisser le masque vectoriel du calque de base de l'icône vers le calque courant. L'onde circulaire est maintenant à l'intérieur de l'icône.

Activer l'outil de sélection de chemin et sélectionnez le chemin de nuage que nous avons créé à l'étape 4. Appuyez sur Ctrl + C pour l'enregistrer dans le presse-papiers. Appuyez sur Ctrl + V pour le coller sur le masque vectoriel de l'onde circulaire. Définissez son mode de chemin sur Subtract.

Enfin, copiez et collez le plus petit chemin de nuage que nous avons créé à l'étape 5. Définissez son mode de chemin sur Ajouter à la forme.

Voici le résultat. L'onde circulaire est à l'intérieur de la surface de l'icône.

Changez le mode de fusion du calque à l'écran.

Étape 8: Ombre

Créez un nouveau calque et placez-le derrière tous les calques. Créez une sélection elliptique (en utilisant l'outil ellipse) sous l'icône. Remplissez la sélection avec du noir.

Adoucir l'ombre à l'aide du filtre, Flou gaussien. Cliquez sur Filtre> Flou> Flou gaussien.

Dupliquer l'ombre en appuyant sur Ctrl + J. Ajouter un autre flou gaussien, pour cette fois utiliser un plus grand rayon pour obtenir une ombre plus douce. Si l'ombre est encore trop dure, vous pouvez baisser l'opacité de la couche.

Résultat final

C'est le résultat de notre tutoriel. Comme vous pouvez le voir, le processus de création de cette icône est très facile. Nous avons juste besoin d'utiliser des formes vectorielles de base et des styles de calques. J'espère que vous apprécierez ce tutoriel. Si vous avez des questions, n'hésitez pas à demander!

Télécharger PSD

Impossible d'atteindre certaines étapes? Voici le fichier PSD du résultat pour tester et jouer avec.

  • Tutoriel Icon iCloud Fichier PSD

15 collections Firefox pour répondre à vos besoins de navigation en ligne

15 collections Firefox pour répondre à vos besoins de navigation en ligne

Êtes-vous un fan des modules complémentaires de Firefox? Ils facilitent votre vie en automatisant beaucoup de choses que vous faites avec votre navigateur préféré. En fait, il y a en fait des collections que les utilisateurs de Firefox ont rassemblées au profit d'autres utilisateurs de Firefox. Ce s

(Conseils techniques et de conception)

Les prix des montres Apple en un coup d'œil (Les 38 modèles comparés)

Les prix des montres Apple en un coup d'œil (Les 38 modèles comparés)

La très attendue Apple Watch d'Apple arrive dans les magasins en avril mais les prix et les modèles ont déjà été annoncés. Aussi amusant que de s'attarder sur les gros plans des 38 modèles d'Apple Watch, Apple Watch Sport et Apple Watch Edition, si vous cherchez des comparaisons rapides, vous préférez probablement toutes les informations sur une seule page.Voici tou

(Conseils techniques et de conception)