Et brukervennlig grensesnitt, godt tegnet grafikk, riktig ordning av elementer på siden - halvparten av nettstedets suksess med den besøkende. Å tegne knapper for et nettsted er en liten, men viktig del av arbeidet med et online prosjekt.
Bruksanvisning
Trinn 1
Prøv å tegne en rund knapp. Metoden nedenfor er også universell for å lage logoer og avatarer. Å tegne det er ikke vanskelig, til tross for antall handlinger du må utføre.
Steg 2
Åpne Adobe Photoshop. Lag et nytt dokument ved å trykke på kombinasjonen "Ctrl + N". Bildeparametere 300 * 300, oppløsning 72 ppi. Standard bakgrunn og fargemodus er henholdsvis hvit og RGB.
Trinn 3
Det er best å tegne med vektorer, slik at når knappen reduseres, forverres ikke kvaliteten. Velg det ovale verktøyet, hold nede Skift og tegn en sirkel fra midten.
Trinn 4
Bruk nå noen effekter på den resulterende sirkelen. Gå til menyen "Lag" - "Lagstil" - "Blandingsalternativer". Her må du bruke en gradient.
Trinn 5
Neste, her, merker du av i boksen ved siden av "Embossing" for å gi knappen den nødvendige buen, og angir følgende parametere: stil - konturpregging, metode - mykt kutt, dybde - 220%, størrelse - 1 piksel, mykgjøring - 5 piksler, vinkel - 135 ° uten global belysning, høyde - 32, uthevingsmodus - normal med 30% opasitet, skyggemodus - multipliser med 25% opasitet
Trinn 6
For å gi enda mer volum, her i blandingsparametrene, merker du av i boksen "Shadow" og stiller inn følgende parametere: blandemodus - multiplikasjon, gjennomsiktighet - 40%, vinkel - 125o ved bruk av global belysning, forskyvning - 5 piksler, størrelse - 20 piksler.
Trinn 7
Resultatet av de utførte handlingene vil være et slikt bilde som vist på figuren.
Trinn 8
Lag nå et nytt lag, velg "Oval" igjen og tegn en sirkel med en mindre radius enn den første formen. Åpne "Blandingsalternativer", merk av i boksen ved siden av "Indre skygge" og angi parametrene: Blending Mode - Soft Light, Angle - 125o, Offset - 0px, Shrink - 45%, Size - 21px.
Trinn 9
Deretter, her i blandingsalternativene, sjekk "Gradient overlay" og opprett en gradient med parametrene som på bildet. Klikk OK
Trinn 10
Sett deretter blandestilen til radial, skaler til 124%
Trinn 11
Merk av i "Stroke" -boksen og angi følgende parametere: størrelse - 5 piksler, posisjon - utenfor, blandemodus - normal, opasitet - 100%, slagtype - gradient.
Trinn 12
Som et resultat av disse handlingene, bør du få noe som ser mer ut som en knapp. Du kan åpne blandingsalternativene på nytt og eksperimentere med dem.
Trinn 13
Nå må vi legge til høydepunktknappene slik at knappen får en glasstekstur. For å gjøre dette, opprett et nytt lag igjen, velg verktøyet Oval Selection, opprett et ovalt over knappen og fyll det med hvitt ved hjelp av Fill-verktøyet. Hold Ctrl, klikk på laget med den fargede sirkelen, snu valget ("Selection" - "Inversion"). Trykk nå på Slett. Den ovale skal trimmes rundt sirkelens omkrets.
Trinn 14
I Layers-panelet endrer du Normal-alternativet til Soft Light, og deretter klikker du på vektormaskeikonet og velger Fill Tool - Gradient. Fyll høydepunktet fra bunn til topp. Knappen er nesten klar.
Trinn 15
Du kan legge til en innskrift på knappen. Du kan også bruke blandingseffekter på den, slik som indre, ytre glød, gradient, og så videre. Ikke vær redd for å eksperimentere, jo mer fantasi du bruker i arbeidet ditt, jo raskere vil du mestre både redaktøren selv og webdesign.
