Bij het ontwerpen van sites worden vaak driedimensionale navigatie-elementen gebruikt. Dergelijke knoppen kunnen worden gemaakt in de grafische editor Photoshop, waarbij het volume wordt gesimuleerd met behulp van schaduwen en verloopvulling.
Noodzakelijk
Photoshop-programma
instructies:
Stap 1
Maak een nieuw document in een grafische editor met behulp van de optie Nieuw in het menu Bestand. Selecteer de grootte van het nieuwe document om op de knop te passen en maak de achtergrond transparant.
Stap 2
Activeer het gereedschap Afgeronde rechthoek. Als u een licht afgeronde knop wilt, stelt u in de balk met gereedschapsopties de straal in op één millimeter. Teken een afgeronde rechthoek met het geselecteerde gereedschap. De resulterende vorm zal de basis zijn voor de knop.
Stap 3
Klik met de rechtermuisknop op de laag en selecteer de optie Laag rasteren. Laad de selectie met de optie Selectie laden uit het menu Selecteren.
Stap 4
Gebruik het gereedschap Verloop om de knop te vullen met een tweekleurig verloop en kies een geschikte combinatie van kleuren uit de voorinstellingen in het verlooppalet. De verloopstijl moet lineair zijn, selecteer deze door op de knop Lineair verloop onder het hoofdmenu te klikken. Het bovenste deel van de knop na het vullen moet lichter zijn dan het onderste.
Stap 5
Pas een stijl toe op de laag. Gebruik hiervoor de optie Overvloeiopties in het contextmenu. Selecteer het tabblad Slagschaduw en voer een waarde van honderdtwintig graden in voor de parameter Hoek. Stel de parameter Grootte in op drie pixels.
Stap 6
Stel op het tabblad Innerlijke schaduw dezelfde waarde in voor de parameter Hoek en stel voor de grootte de waarde in op vijf pixels. Pas de stijl toe door op de Enter-toets te drukken.
Stap 7
Maak een schaduw voor de knop. Klik hiervoor op de knop Een nieuwe laag maken en vul het geselecteerde gebied van de nieuwe laag met zwart. Selecteer hiervoor de Paint Bucket Tool. Deselecteer met Ctrl + D.
Stap 8
Pas een Gaussiaans vervagen-filter uit de groep Vervagen van het menu Filter toe op de zwarte rechthoek. Stel de straal in op vier pixels. Sleep de schaduwlaag onder de knoplaag en til de schaduw drie tot vier pixels omhoog. Activeer hiervoor het gereedschap Verplaatsen en verplaats de schaduw met de cursorknoppen. Verlaag de dekking voor deze laag naar zestig procent.
Stap 9
Maak de actieve laag met de knop en laad er een selectie uit. Verklein de selectie met twee pixels met behulp van de optie Contract in de groep Wijzigen van het menu Selectie.
Stap 10
Maak een nieuwe laag en vul de resulterende selectie met een lineair verloop van wit naar transparant zodat het witte gedeelte onderaan de knop staat. Deselecteer de selectie. Gebruik de optie Vrije transformatie in het menu Bewerken om het gebied dat door het verloop wordt bedekt verticaal te verkleinen. Pas de transformatie toe met de Enter-toets.
Stap 11
Verander de Overvloeimodus van de verlooplaag in Overlay. Dit kan worden gedaan door een modus te selecteren in de vervolgkeuzelijst aan de linkerkant van het palet Stijlen. Verlaag de dekking van de laag tot zestig procent.
Stap 12
Gebruik het gereedschap Horizontale tekst om de tekst op de knop te schrijven.
Stap 13
Verzamel alle lagen in een map met behulp van de optie Groepslagen in het menu Laag, selecteer ze terwijl u de Ctrl-toets ingedrukt houdt. Sla de knop op in een psd-bestand met behulp van de optie Opslaan in het menu Bestand.
