Nous disposons aujourd'hui d'une petite collection d'astuces de conception complètement aléatoires mais très utiles que vous devriez garder à l'esprit la prochaine fois que vous aurez besoin d'une nouvelle idée.
Je vais vous montrer un moyen rapide de rendre une capture d'écran de logiciel plus intéressante, comment créer de superbes textures vectorielles grunge et un moyen très rapide de créer une étoile vectorielle.
Capture d'écran de Breakout
Lorsque vous concevez un site Web pour une application Web ou de bureau, vous finirez inévitablement par incorporer quelques captures d'écran dans votre conception, ce qui est formidable car elles créent des graphismes attrayants et très faciles à créer. Apportez simplement l'application sur votre bureau attrayant mais minimal, appuyez sur un raccourci clavier, ajoutez du texte et le tour est joué!
Il s'agit certainement d'un moyen simple et magnifique de créer des illustrations pour un site Web, mais cela vaut la peine de faire un effort supplémentaire pour réfléchir à la manière dont vous pouvez aller plus loin et rendre le graphique encore plus intéressant.
Une façon très simple de procéder consiste à faire en sorte que la capture d'écran dépasse les limites de l'image d'arrière-plan. Cette astuce rapide et facile rend votre conception plus vivante et superposée.
Maintenant, la façon longue et difficile de réaliser cette astuce serait de masquer une partie de l'arrière-plan de votre capture d'écran, mais c'est une vraie douleur. Il est beaucoup plus facile de créer simplement un fichier PNG transparent de la fenêtre de votre application, sans arrière-plan, que vous pouvez ensuite placer par-dessus tout ce que vous voulez dans Photoshop.
Pour ce faire sur un Mac, appuyez sur Commande + Maj + 4 pour afficher le réticule qui vous permettra de prendre une capture d'écran d'une zone sélectionnée. Placez ensuite votre curseur sur la fenêtre de l'application et appuyez sur la barre d'espace. Le réticule devrait se transformer en une icône de caméra et la fenêtre sur laquelle vous passez la souris devrait être mise en surbrillance. Cliquez simplement pour créer un fichier sur votre bureau contenant cette fenêtre et son ombre sur un arrière-plan transparent. Les utilisateurs Windows peuvent suivre ces étapes pour prendre une capture d'écran d'une fenêtre.
Une fois que vous avez pris la capture d'écran de la fenêtre, prenez un arrière-plan pour le placer et ouvrez-le dans Photoshop.
À partir de là, il est facile de rogner le fond pour que la capture d'écran en ressorte. Notez que j'ai pris le chemin opposé au bas de la capture d'écran, qui est caché dans l'image d'arrière-plan.
Dans la nature
Cette astuce est très courante dans la conception Web en ce moment et peut être vue sur de nombreux sites de logiciels de bureau et d'applications Web. Un exemple éloquent est le site Web actuel de Sparrow for Mac.
Easy Illustrator Starburst
J'hésite à vous enseigner cette astuce simplement parce que je déteste généralement les étoiles en design. Cependant, je conviens qu’il existe en fait des utilisations légitimement agréables. Plus important encore, je connais un truc assez cool pour les faire que j'aime montrer.
Pour commencer, ouvrez Illustrator et tracez un cercle. Définissez ensuite le trait du cercle sur une ligne pointillée. Les paramètres importent peu à ce stade, assurez-vous simplement que vous avez quelque chose qui ressemble à peu près à ceci:
Voici la partie amusante. Prenez le poids de la course sur votre cercle et avancez au-delà de tout ce qui est logique (par centaines). Enfin, définissez votre premier tiret et les valeurs d’écart pour être identiques. Le résultat est une belle starburst parfaite.
Ce qui est génial, c’est que cette astuce vous donne un contrôle total sur la largeur des lignes et des espaces. Voici un exemple légèrement modifié qui est un peu plus étendu.
Allez plus loin et ajoutez des valeurs aléatoires à certains des autres espaces de tirets et d'espaces. Cela va commencer à vous donner des résultats vraiment créatifs, voici un joli petit motif qui me rappelle une menthe poivrée.
Développer
Maintenant, travailler avec un élément caressé génial comme celui-ci sur le long terme va devenir compliqué, donc une fois que vous avez décidé de votre forme générale et de votre style, je vous recommande d'aller à Objet> Aplatir la transparence. Cela vous donnera un joli vecteur éclaté qui ressemble à celui que vous avez construit à la dure (le contour délivre des résultats étranges). Assurez-vous simplement de supprimer le trait du cercle d'origine pour garder les choses propres.
Textures vecteur grungy
Les textures grunge photographiques sont faciles à trouver, les textures grunge vectorielles, pas tellement. Heureusement, il est assez facile de créer ce dernier en utilisant le premier.
Commençons par explorer Flickr Creative Commons pour trouver une texture grunge décente. En voici une excellente de D. Sharon Pruitt.
Maintenant, j’ai choisi délibérément celui-ci car il contient de légères rayures sur un fond sombre, ce qui semble être beaucoup plus difficile à utiliser, mais ce n’est vraiment pas du tout.
Ouvrez la texture dans Photoshop, appuyez sur Commande + I pour inverser les couleurs et vous obtenez soudainement un joli fond blanc rayé de noir. Utilisez ensuite un réglage de base des niveaux pour faire apparaître les blancs et les noirs. Le résultat devrait ressembler à ceci:
Enregistrez maintenant l'image au format JPG et ouvrez-la dans illustrator. À partir de là, nous avons quelques formes très basiques qui peuvent être tracées automatiquement avec une précision relative. Exécutez la commande Trace automatique et définissez vos paramètres sur ceux présentés ci-dessous. Une étape critique ici consiste à vous assurer de cliquer sur le bouton "ignorer le blanc". afin que Illustrator ne trace que les parties noires.
À partir de là, vous cliquez simplement sur le bouton? Développer? bouton dans la barre de menu. Cela vous donnera des rayures grunge 100% évolutives et facilement applicables.
Nous pouvons combiner cette astuce avec la dernière et nous avons un superbe morceau d’illustration vectorielle rétro. Plutôt cool!
Conclusion
Ces astuces rapides sont conçues pour élargir votre éventail d’astuces afin que vous disposiez d’un plus grand éventail d’idées pour votre prochain projet de conception. J'espère que vous avez appris une chose ou deux et que vous avez été inspiré pour proposer vos propres idées uniques basées sur les informations ci-dessus.
Laissez un commentaire ci-dessous et indiquez-nous toutes les techniques que vous avez vues sur le Web, mais dont vous ne savez pas exactement comment répliquer.Nous allons jeter un coup d'oeil et voir si nous pouvons aider dans le prochain article sur les astuces de conception.