Comment utiliser Photoshop pour créer vos propres icônes de style iOS 6

Il y a beaucoup de débats à propos de savoir si iOS 7 est bon ou non, il n'y a pas d'autre choix que de choisir un côté - iOS 6 ou iOS 7. Personnellement, je pense que les icônes iOS 7 sont un peu une arnaque de Windows Phone, mais bon - quels sont tu vas faire… Ce n'est pas la première chose qu'Apple a copié ou d’autres Microsoft d’Apple ou d’Android, c’est vraiment une boucle. Alors, pendant que nous sommes dans l'ambiance Apple, pourquoi ne pas essayer un tutoriel rapide sur Photoshop pour créer vos propres icônes iOS 6.

Trouver de bons exemples d'icônes

La première étape consiste à trouver un exemple d'icône iOS. Effectuez une recherche rapide dans Google ou Bing Image pour «iOS Icons». Ciblez votre recherche pour obtenir des résultats plus précis à l'aide des options de recherche exacte de Google..

Après avoir trouvé une bonne icône PNG, enregistrez-la sur votre PC afin que nous puissions l'ouvrir dans Photoshop..

Il est également intéressant de noter que Bing facilite la recherche d'images et d'icônes libres d'utilisation personnelle..

Commencer

Importez l'image enregistrée dans Photoshop et assurez-vous qu'il s'agit d'un fichier PNG approprié. Il est supposé avoir un grille en damier après les coins arrondis au lieu du fond blanc typique.

Si l’arrière-plan n’est pas transparent, vous pouvez utiliser quelque chose comme le Outil de gomme magique à chacun des quatre points blancs dans les coins.

Ctrl + Clic la vignette du calque avec l’icône importée pour sélectionner la forme de l’icône. Vous pouvez ensuite (avec l'outil de sélection rectangulaire) clic-droit et Remplir avec n'importe quelle couleur unie que vous voulez. Je vais essayer le noir pour commencer.

Effets spéciaux

Il est maintenant temps de donner à votre icône le look brillant de iOS 6 (qui est mieux que iOS 7, bien sûr). Clic-droitvotre couche et sélectionnez Options de fusion.

Les options de fusion vous permettront de créer une variété de styles de calque de superposition pouvant reproduire l'apparence de l'icône iOS. Commencez par un Pente et ensuite essayer Ombre portée et Lueur intérieure. Votre résultat final ressemblera à ceci:

Et votre couche ressemblera à ceci:

Astuce: vous pouvez renommer votre calque (Maj + Ctrl + N) pour mieux organiser les choses.

Ajouter un peu d'éclat

Répliquons maintenant le brillant sur le dessus de presque toutes les icônes iOS 6. Tout d'abord, créez un nouveau calque. Appelez-le «Gloss» et placez-le au-dessus de votre calque d'icônes:

Maintenant, prenez le Outil de chapiteau elliptique (caché derrière le rectangle de sélection). Faites une petite forme ronde dans la partie supérieure de l’icône comme ceci:

Sans désélectionner, prenez votre Outil gradient et créez rapidement un dégradé qui passe du blanc à 100% de transparence:

Après avoir créé votre dégradé, faites-le glisser du bas de la sélection. en maintenant la touche Maj enfoncée.

Supprimez maintenant la brillance qui dépasse les limites de l’icône. En faisant un Ctrl + Clic sur la vignette du Couche d'icônes puis inverser notre sélection avec Clic droit> Sélectionner inverse vous pouvez couvrir les quatre coins vierges. Maintenant nous pouvons sélectionner le Couche de brillant et appuyez sur le Supprimer la clé se débarrasser de la brillance excessive. Vous pouvez finir avec un rapide Ctrl + D désélectionner.

Pointe: Pour améliorer l’effet de la brillance, vous pouvez essayer différents modes de superposition de calques. Certains fonctionnent correctement. Écran, Lumière douce et Recouvrir.

Finalisation de votre icône

Vous pouvez maintenant ajouter n'importe quel logo que vous souhaitez utiliser. Découvrez ma douce nouvelle application - le iSmile! Seulement 99,99 $ sur l'App Store - je plaisante, bien sûr! Vous pouvez utiliser cette technique pour créer autant d'icônes groovy que vous voulez… amusez-vous!