Snelle tip maak een ronde schakelknop in Photoshop

In deze quicktip-zelfstudie maken we een ronde schakelknop die u kunt gebruiken in uw interfaceontwerpen. Laten we beginnen!


Lesmateriaal

  • Verticaal doekpatroon beschikbaar op Subtlepatterns
  • Grungetextuur door Pixeden

De achtergrond maken

Maak een nieuw bestand. Stel Breedte in op 1000 en Hoogte op 1000 en de resolutie op 72 PPI.


Het achtergrondpatroon toepassen

Maak een nieuwe groep en noem deze achtergrond. Ga nu naar deze link Verticale doek Patroon en download dit patroon en laad het. Gebruik het gereedschap Rechthoek (U) om een ​​rechthoekige vorm te tekenen die iets groter is dan het canvas en pas het patroon als een stijl toe op de vormlaag.


De knop maken - Stap 1

Maak een nieuwe groep en noem deze Knop. Gebruik Elipse Tool (U) om een ​​perfecte cirkel te tekenen zoals in het voorbeeld. Zet de kleur op # 0e0f0f en pas de laagstijlen toe. Nadat u klaar bent met de laagstijlen, vermindert u de dekking naar 20%.


Stap 2

Maak nu een nieuwe cirkel, deze keer een beetje kleiner, stel de kleur in op # 222429 en pas de laagstijlen toe.


Stap 3 - De textuur zoeken en toepassen

Navigeer naar Pixeden-site en download het Old School Retro PSD-teksteffect waarin we de textuur vinden die we nodig hebben. Nadat je het bestand hebt gedownload, open je het met Photoshop en zoek je de laag met de naam Grunge Texture. Importeer die laag in uw PSD en stel de overvloeimodus in op Pin Light en het dekkingsniveau op 10%. Maak van deze laag een uitknipmasker.


  • Stap 4

    Gebruik Elipse Tool (U) om een ​​andere perfecte cirkel te maken die ook kleiner is dan die voor hem, stel de kleur in op # 0d0d0e en pas de laagstijlen toe. Gebruik Penseel (B) om het penseel in te stellen op 200px en de hardheid op 0% en maak een wit #ffffff-punt zoals in ons voorbeeld. Stel de overvloeimodus in op Zacht licht en het dekkingsniveau op 80% en transformeer deze laag in een uitknipmasker. Maak nu een nieuwe laag, verander de kleur naar zwart # 000000 en borstel rond het onderste deel van de cirkel, zoals te zien in het voorbeeld. Transformeer deze laag ook in een uitknipmasker.


    Stap 5

    Gebruik opnieuw Elipse Tool (U) om opnieuw een perfecte cirkel te maken, maar maak deze een paar px kleiner dan de vorige. Zet de kleur op # 1a1a1b en gebruik het gereedschap Directe selectie (A) om het onderste anker een paar pixels naar boven te verplaatsen. Breng nu de laagstijlen aan, importeer de Grunge-textuur opnieuw, stel de overvloeimodus in op Lineair ontwijken en het dekkingsniveau op 10%. Maak een nieuwe laag en gebruik Penseel (B) om dezelfde instellingen te behouden die we in onze vorige stap hebben gebruikt, kies witte #ffffff als onze kleur en borstel weg in het onderste deel van onze vorm. Stel de overvloeimodus voor deze laag in op Zacht licht en transformeer de laag in een uitknipmasker.


    Stap 6

    Stel met het gereedschap Horizontale tekst (T) het lettertype in op Myriad Pro (standaardlettertype), Vet en de grootte in op 48pt en noteer de letter "I". Zet de kleur op # 969696 en pas de laagstijl toe. Maak een ander type, deze zegt "O", zet de kleur op #fefefe. Klik met de rechtermuisknop op de laag en selecteer Type rasteren. Druk nu op CTRL / CMD + T en houd CTRL / CMD + SHIFT + ALT ingedrukt en sleep de linker benedenhoek een paar pixels naar links. Pas de laagstijl toe en we zijn klaar.


    Laatste afbeelding