Snabbtips Skapa en uppsättning präglade spelarknappar

Följ den här nya snabba spetsen och lära dig att dra en uppsättning spelarknappar, lila och rosa stil den här gången eftersom grå och svart kan vara lite tråkigt ibland. De är lätta att göra och vi kommer att använda effekter som yttre glöd, gaussblurning, transformation och blandningsverktyget.


Steg 1

Öppna ett nytt webbdokument. Knappens yttre cirkel är halvtransparent, så bakgrunden är viktig den här gången. Ta rektangelverktyget (M) och rita en 720 x 170 pkt rektangel och välj sedan lila som fyllfärgen. Gå till Utseendepanelen och välj Lägg till ny fyllning i menyn Fly-out. Ändra den här nyfyllningsfärgen till mörkgrå (85% svart) och gå till Effect-menyn> Konstnärlig och använd filmkornseffekten. Sänk opaciteten till 70% och bakgrunden är klar.


Steg 2

Ta ellipsverktyget (L) och dra en 83 x 83 px cirkel. Fyll den med den linjära gradienten som visas och ändra vinkelvärdet till 90 grader. Gå sedan till Effect-menyn> Blur> Gaussian Blur och använd en 1,5 px Radius. Minska opacitet till 50% för att göra cirkeln halvtransparent.


Steg 3

Kopiera och klistra in framför den första cirkeln och ta bort befintliga utseenden. Kopiera och klistra in den nya cirkeln (grön) för att få en annan cirkel (röd). Innan du fortsätter går du till Redigera-menyn> Inställningar> Allmänt och ställer in ökning av tangentbordet till 0,5 px. Välj nu den röda cirkeln och flytta den lite genom att trycka två gånger nedåtpilknappen på tangentbordet. Markera båda cirklarna och klicka på Subtrahera från formområde> Expand from Pathfinder Panel.

Skicka den resulterande formen bakåt och fyll den med en radial gradient från vit till svart. Gå sedan till Effect-menyn> Blur> Gaussian Blur och använd en 1 px Radius, ändra sedan Blending-läget till Skärmen (svart blir transparent). Minska opacitet till 60%.


Steg 4

Med den första cirkeln vald, gå till Objekt-menyn> Sti> Förskjutningsväg och använd ett -8 px Offset-värde för att få den mindre cirkeln. Ta bort de befintliga skenorna och fyll i den med den lila nyans som anges. Gå till Effektmeny> Stylize och använd Outer Glow-effekten med de visade inställningarna. På så sätt får du en diskret skugga runt den andra cirkeln.


Steg 5

Kopiera och klistra in framför den andra cirkeln, behåll fyllfärgen, men ta bort yttre glödseffekten från Utseendepanelen. Om du har valt den här nya cirkeln, gå till Objektmeny> Sti> Förskjutningsväg och använd ett -7 px Offset-värde för att få en mindre cirkel igen. Ändra fyllfärgen till lila. Välj nu båda cirklarna som erhållits i det här steget, gå till Objekt-menyn> Blanda> Blandningsalternativ och välj 20 specificerade steg och gå sedan tillbaka till Objekt-menyn> Blanda och välj Gör.


Steg 6

Gå sedan till panelen Lager och välj den mindre lila cirkeln från blandningsgruppen och Kopiera och klistra in den framför men dra den utanför blandningsgruppen eftersom vi inte vill ha den där. Fyll den nya cirkeln (röd) med en linjär gradient från vit till svart och ändra vinkelvärdet till 90 grader. Ändra blandningsläge till skärm (svart blir transparent) och sänka opacitet till 40%.


Steg 7

Kopiera och klistra in framför den sista cirkeln och bara ge den en blå stroke. Kopiera och klistra in framför den blå cirkeln för att få den röda cirkeln och flytta den genom att trycka på nedåtpil-tangenten på tangentbordet fem gånger (tangentbordet ökning är fortfarande inställt på 0,5 px). Om du har valt båda cirklarna trycker du på Subtrahera från formområde> Expand from Pathfinder Panel och fyller sedan den resulterande formen med en radial gradient från svart till grått. Gå sedan till Effect-menyn> Blur> Gaussian Blur och använd en 1,7 px Radius och ändra blandningsläget till Multiplicera. Tryck två eller tre gånger på nedåtpilknappen på tangentbordet för att flytta den här månformen lite nedanför.


Steg 8

Låt oss fortsätta med spelarens symboler. För Play-symbolen, använd Polygon Tool, klicka på din tavla och ange värdena som visas för att få en triangel. Rotera den minus 90 grader och gå till Effektmeny> Stylize> Round Corners och använd en 5 px Radius. För Stop-symbolen teckna en 20x20 px kvadrat med hjälp av rektangelverktyget (M) och använd sedan igen Round Corners-effekten. Paus symbolen är gjord av två tunna rektanglar (4x22 px) och den här gången väljer du en 2 px Radius när du tillämpar Round Corners-effekten.

Välj sedan symbolerna Spela upp, Stopp och Stopp och välj Expandera Utseende sedan Ångrupp. Skala och multiplicera Play-symbolen och använd den tillsammans med paus-symbolen för att skapa symbolerna Spela snabbare och spela nästa som visas nedan. När de är klara, gruppera de former som komponerar dem och gå till Objekt-menyn> Transformera> Reflektera, välj Vertikal och tryck på Kopiera. På så sätt får du symbolerna Spela långsammare och spela tidigare.


Steg 9

Fyll spel-symbolen med den lila nyans som anges, gå till Utseendepanelen och välj Lägg till ny fyllning i menyn Fly-out. Ändra den andra fyllningsfärgen med den som visas, gå till Effektmeny> Förvräng & Transformera> Transformera effekten och Flytta sektionen, Vertikal välj 1,5 px. Gör samma sak för resten av symbolerna.


Steg 10

Låt oss gå tillbaka till knappen från steg 7. Gruppera alla former som komponerar det och gå till Objekt-menyn> Transformera> Flytta. Välj att flytta knappen 100 px horisontellt och tryck sedan på Kopiera. Nu trycker du på Command + D (Transform Again) för att upprepa den här åtgärden fem gånger. Allt som är kvar att göra är att ordna symbolerna och du är klar.


Steg 11

Bakgrunden bakom de rosa knapparna är densamma som den lila bakgrunden. Du kan helt enkelt göra en kopia och ersätta de två fyllfärgerna med de angivna.

För att skapa de rosa knapparna behöver du bara ersätta de lila nyanserna med rosa nyanser. I bilden nedan kan du se de viktigaste stegen och färgerna som du måste ändra. Om andra färger eller gradienter inte nämns här betyder det att de förblir desamma.

Ändra också de två fyllfärgerna för symbolerna enligt vad som anges. Upprepa steg 10 och de rosa symbolerna är klara.


Steg 12

Om du inte gillar girlish färger kan du skapa den svarta versionen. Börja med bakgrunden och byt ut fyllfärgerna ...

.... Ersätt de lila nyanserna av knapparna med grå nyanser enligt nedan.

Ersätt också de två fyllfärgerna för symbolerna och placera dem på toppen av knapparna och du är klar.


Slutlig bild

Här är den slutliga bilden. Jag vågar dig skapa dessa knappar med andra färger som du gillar och låt mig veta hur de visade sig. Se bara till att du matchar knapparna med bakgrundsfärgen eftersom den större cirkeln är halvtransparent. Om du också vill skala dessa knappar, kom ihåg att utöka alla effekter som används innan du gör det här.