Sådan oprettes en enkel glasknap i Photoshop

Oprettelse af en moderne glassknap i Adobe Photoshop er meget enkel.

indhold

Trin

Opret et nyt billede

Video: sådan vejer politiet din campingvogn - tips fra dansk camping union
Opret en stribet baggrund
Ændre glasknapfunktionen
Making button shape
Anvend forvrængningen til baggrunden
Tilføj en refleks
Tilføjelse af et kryds i wikihow-stilen
Nogle final touches
Tips
Nødvendige materialer

trin

1
Knappen du skal oprette vil se sådan ud:

Opret et nyt billede

1
Start Photoshop, og tryk på CTRL + N (Command + N på Mac) for at oprette et nyt billede.

Video: Sådan vejer politiet din campingvogn - tips fra Dansk Camping Union
2
Indtast 2500 for Bredde, 250 til Højde, 72 til Opløsning og Hvid til Baggrundsindhold. Klik på "Ok".
3
Klik på "Fil"> "Gem som". Skift "Format" til Photoshop (* .PSD, * .PDD). Indstil "Filnavn" til BotaoVidro.psd. Klik på "OK".

Opret en stribet baggrund

Opret et midlertidigt dokument til den stribede baggrund. Tryk på CTRL + N for at oprette et nyt dokument. Indtast 1 for "Bredde," 10 for "Højde", 72 for "Opløsning" og "Hvid" til "Baggrundsindhold." Klik på "OK".
Tryk på Z for at åbne forstørrelsesforstærkeren. Klik på dokumentet, indtil stigningen er mindst 1600%, og klik derefter på "OK".
Tryk på M for at åbne "Square Marquee" værktøjet. Hvis værktøjet Cirkelmærke af en eller anden grund åbnes, kan du skifte til firkant ved at trykke på venstre museknap på firkanten i værktøjskassen. Der vises et lille vindue ved siden af værktøjskassen, og du kan vælge det firkantede værktøj.
På det stripede dokument tegner du en markering omkring 1-pixel-knappen. Sørg for, at slagtykkelsen er indstillet til 0.
Tryk på SHIFT + F5 for at åbne popup-vinduet. Indstil "Brug:" til "Sort" og klik på "OK". Tryk nu på CTRL + A for at vælge hele dokumentet.
Klik på "Rediger"> "Definer mønster". Et vindue vil blive præsenteret for dig. Indstil "Navn:" til "Stripes".
Luk pinstripe-dokumentet (striber). Vi har ikke længere brug for det, og der er ingen grund til at gemme det.

Ændre glasknapfunktionen

Klik på dokumentets titellinje på din glassknap for at aktivere det.
Tryk på SHIFT + F5 for at åbne udfyldningsvinduet. Rediger attributten "Brug:" til "Mønster". Modificer "Custom Pattern" for det stribede mønster, vi oprettede. Klik derefter på "OK". Dit dokument skal nu se sådan ud:

Making Button Shape

Klik og hold venstre museknap på værktøjet "Marquee" i værktøjskassen. Når det lille vindue vises ved siden af værktøjet, skal du navigere til "Eliptical Marquee" -værktøjet.
Hold Shift-tasten nede, klik på den øverste venstre side af dokumentet, og træk den elliptiske drejeknappen, indtil musemarkøren er nederst til højre i dokumentet. Det forventes, at cirklen er lidt mindre end dokumentet. Tryk på SHIFT + CTRL + N for at oprette et nyt lag. Når det nye lagvindue er oprettet, ændrer du dit "Navn:" (Navn) til ShapeButton.
Tilpas farven til en dejlig mørkblå tone. Klik på forgrundsfarven i værktøjslinjen.
Når farvevalgsvinduet vises, skal du ændre værdien fra "#" til 000066 (disse er nuller).
Klik på "OK".
Tilbage til glasknappens dokument, tryk på SHIFT + F5 for at åbne vinduet. Indstil "Brug:" til "Forgrundsfarve" og klik på "OK". Skriv CTRL + A for at vælge dokumentet som helhed. Tryk på CTRL + X for at skære cirklen, og derefter CTRL + V for at indsætte den tilbage. Handlingen med at skære og indsætte centrerer cirklen på dit dokument. I lagpaletten ændres "Blending Mode" til "Linear Burn".
Dit dokument skal nu se sådan ud:
- Hvis det ikke er tilfældet, skal du gå tilbage og kontrollere hvert trin i vejledningen igen.

Anvend forvrængningen til baggrunden

Hvis du allerede har kigget igennem et glas vand, har du måske bemærket, at billedet gennem det er lidt forvrænget. Med vores knap vil baggrundsstriberne blive præsenteret gennem glasset, så vi skal lidt forvrænge linjerne.
Tryk og hold CTRL-tasten nede og klik på "ShapeButton" -laget i lagpaletten. Dette vil tegne et valg omkring form af vores knap. Klik nu på laglaget på lagpaletten. Klik på "Filtre"> "Forvræng"> "Spherize". Indstil "Beløb" til 66%.
Klik på "OK". Dit dokument skal nu se sådan ud:

Tilføj en refleks

Sørg for, at der stadig er et valg rundt om cirklen. Tryk på SHIFT + CTRL + N for at oprette et nyt lag. Når det nye lagvindue vises, skal du ændre din "Navn:" til "Refleksion". Klik på "OK". Det nye lag, der hedder "Relfexo", skulle have været oprettet mellem baggrundslagene og knapformen, når man kigger på lagpaletten. Vi skal flytte refleksionslaget til toppen af lagpaletten. Klik og træk det til toppen af foredraget.
Tryk på D og derefter X. Dette ændrer forgrunds- og baggrundsfarverne til sort / hvid. Tryk på G for at bruge værktøjet "Gradient". Indstil forgrundsfarvegradienten til "Transparent".
Sørg for, at dit Refleksionslag er valgt, start med at tegne en gradientlinie fra toppen af cirklen mod bunden af cirklen. Hold SHIFT nede, mens du gør dette for at sikre, at du laver en perfekt lige linje. Når linjen har nået basisd-cirklen, slip museknappen. Tryk nu på CTRL + D for at fravælge cirklen. Dit dokument skal nu se sådan ud:
Rediger størrelse og form af refleksionslaget. Tryk på CTRL + T, så du frit kan omdanne Refleksionslaget. Klik på firkanten, der er på højre side. Mens du holder ALT-tasten nede, skal du trække firkanten i pivoten, indtil refleksionslaget er ca. 4/5 den oprindelige størrelse. Træk firkanten langs bunden. Mens ALT-tasten holdes nede, skal du trække firkanten opad, indtil refleksionslaget er ca. 3/5 af den oprindelige størrelse. Tryk på ENTER for at bekræfte din transformation. Dit dokument skal nu se sådan ud:
Vi ønsker ikke, at Refleksion skal være i midten af knappen, som vist ovenfor, så tryk på V for at bruge "Flyt" -værktøjet. Klik nu på refleksionen og træk den op, indtil den er tæt på toppen af cirklen. På paletten Lag ændrer du opacitet til 85%.
Nu skal dokumentet se sådan ud:
Du kan stoppe her hvis du ønsker det. Men lad os tilføje et afkrydsningsfelt til wikiHow-stilen i centrum af obotão.

Tilføjelse af et kryds i wikiHow-stilen

Klik på ShapeBox-laget i paletten Lag. Agroa trykker på SHIFT + CTRL + N for at oprette et nyt lag over ShapeBox-laget. Når vinduet med det nye lag vises, ændrer du dit "Navn:" til "Mærkning". Nu skal vi åbne værktøjet "Custom Shape". I værktøjskassen skal du klikke og holde museknappen på rektangelværktøjet, indtil et vindue vises ved siden af værktøjet. Vælg "Custom Shape" fra listen.
Fra værktøjslinjen skal du ændre formen for "markformen".
Klik på forgrundsfarveprøver i værktøjskassen. Når vinduet med farvevalg vises, skal du ændre værdien fra "#" til 932200. Klik på "OK".
I markeringslaget tegner du et stort mærke, der er lidt mindre end knappen. Du vil gøre dette ved at klikke nær bunden af cirklen og trække ud af formen.
Klik på "Layer"> "Rasterize"> "Shpe". Nu ændrer opacitet af markeringslaget til 80%. Dit dokument skal nu se sådan ud:
Mens du holder CTRL-tasten nede, skal du klikke på markeringslaget i lagpaletten. Tryk på V for at bruge værktøjet "Flyt". Hold nu ALT-tasten nede og tryk 8 gange på pil ned på tastaturet. Skift nu forgrundsfarven til A72903. Tryk på SHIFT + F5 for at åbne udfyldningsvinduet. Sørg for at attributten "Brug:" er indstillet til at bruge forgrundsfarven. Klik på "OK". Tryk på CTRL + D for at fjerne markeringen af laget.
Højreklik på markeringslaget i lagpaletten, og vælg blandingsindstillinger. Lagformatvinduet vises. Klik på "DropShadow". Skift "Angle" til 90 og "Distance" til 15.
Klik på "OK".

Nogle Final Touches

Højreklik på ShapeBox-laget og vælg indstillingen "Blandingsindstillinger". Når lagestilvinduet vises, skal du klikke på "Inderskygge". Rediger værdierne fra "Blend Mode:" til "Multiply", "Opacity:" til 75%, "Angle:" til 90, "Distance: for 5, "Choke:" for 0 og "Size:" for 75. Klik på "Drop Shadow". Forlad alle indstillinger som de er. Klik på "OK".
Og det er det, din knap er klar. Dit endelige billede skal se sådan ud:

tips

Du kan lave test med lagstilstandsvinduet for at få nogle interessante resultater.
Du kan tilføje tekst til knappen ved hjælp af "Tekst" værktøjet.
Du kan klikke på "Billede"> "Billedstørrelse" for at ændre billedets størrelse. Hvis du vil bruge noget som dette på et websted, vil du helt sikkert foretrække noget mindre.