Media

Patroon maken in Photoshop

Patroon

Hoera! Vandaag leer ik jullie hoe jullie heel gemakkelijk een patroontje kunnen maken in Photoshop! Wat heb je nodig? Photoshop, icons die allemaal dezelfde grootte hebben (ik downloadde deze en deze bijvoorbeeld) en gewoon een dosis geduld :D

New_file

Ik maak een nieuw bestandje aan van 500 x 500 pixels. Daar begin ik mee en ik zal nog zien of ik genoeg icons heb om de plek te vullen ;). Verder open je alvast de bestandjes met icons of zorg dat ze klaar staan om te kopiëren in je PS bestand!

patroon_1

Ik plaats het icoontje in de rand en zorg dat mijn rulers aanstaan en sleep ze naar de rand. Als je je rulers niet ziet dan doe je CMD + R en dan zou je ze moeten zien. Gewoon starten met slepen vanaf je ruler en dan zou het normaal moeten lukken ;) normaal snapt de lijn ook naar de rand van je icoontje (het werkt zo: hij snapt naar de rand van de laag dat je geselecteerd hebt).

Screen Shot 2015-12-23 at 22.22.48

Dan sleep ik mijn icoontje naar de hoeken en zet ik ook weer rulers uit. En eigenlijk ga ik door tot als ik het gehele canvas heb verdeeld in allemaal stukjes.

Screen Shot 2015-12-23 at 22.24.43

Voila! Dan verwijder je de kopies van je icoontje en dan is het tijd om je patroontje te maken ;) Ik laat altijd hokjes over zodat niet alles zo dicht bij elkaar staat. Ik laat je zien hoe:

Screen Shot 2015-12-23 at 22.40.36

Ik heb het helemaal gevuld, maar als we nu kijken dan zien we dat het patroontje dit doet:

Screen Shot 2015-12-23 at 22.41.37

Dit willen we dus NIET want je ziet het patroontje en er is nog een whitespace. Allereerst moet je zorgen dat je “eindes” altijd op een verschillende rij eindigen. Daarom moet je de rechtse twee icoontjes weg doen. Daarna gaan we het patroon mooi doen aansluiten met volgende stap: IMAGE » TRIM 

Screen Shot 2015-12-23 at 22.42.27

En dan krijg je normaal gezien zoiets:

Screen Shot 2015-12-23 at 22.50.07

Dan zijn we er bijna! Nu gaan we naar EDIT » DEFINE PATTERN. Je geeft je pattern een naam en duwt op ok. Dan open je een nieuw canvas (voor web), in de afmetingen die je wilt (bijvoorbeeld voor een nieuwe header) en geef hem een nieuwe laag met een witte achtergrond. Dan ga je naar de LAYER EFFECTS en doe je Pattern overlay. Als alles goed is zie je je patroontje verschijnen en kan je nog de grootte / hoek / … aanpassen :)

Screen Shot 2015-12-23 at 22.53.12

(Layer effects vind je in je layers deeltje, die Fx precies onderaan bij de andere knopjes).

Untitled-2

Et voila. Alles is klaar! Je kan het patroontje nu blijven gebruiken! Een tip is: maak je patroon altijd zwart (zeker als het zo met line icons is enz) dan kan je makkelijk nog met gradient / color overlay spelen om hem in te kleuren (zoals in mijn eerste foto) :) Met dat rood is dat al wat moeilijker ;)

Zijn er nog dingen die ik jullie kan uitleggen? Laat het mij weten in de comments of via mail! Gaan jullie die ook uitproberen :)? Meer tutorials kan je vinden in de tutorials categorie

Comments

Leave a Reply

Your email address will not be published. Required fields are marked *

http://insins.me/wp-content/plugins/wp-monalisa/icons/OMG.png 
http://insins.me/wp-content/plugins/wp-monalisa/icons/angry.png 
http://insins.me/wp-content/plugins/wp-monalisa/icons/bigsmile.png 
http://insins.me/wp-content/plugins/wp-monalisa/icons/cry.png 
http://insins.me/wp-content/plugins/wp-monalisa/icons/littlesmile.png 
http://insins.me/wp-content/plugins/wp-monalisa/icons/love.png 
http://insins.me/wp-content/plugins/wp-monalisa/icons/sad.png 
more...
 

  1. Handige tip. Ben zelf niet zo thuis in Photoshop. Jawel, maar ik vloek er zo snel op en dan geef ik er snel de brui aan. Haha. Ik hou deze post in gedachten als ik eens een patroon wil maken.