Hoe u menuknoppen maakt in Photoshop. Maak een eenvoudige ingedrukte en losgelaten knop in Photoshop

Hallo lezers! Vandaag zullen we het hebben over zoiets belangrijks als knoppen. Het internet is vol verschillende setjes knoppen, maar ze verdrievoudigen ons niet altijd, de grootte of de inscriptie, en het is prettiger en veel handiger om de gemaakte knop te gebruiken.

Ik heb deze les in stappen verdeeld, omdat... het is behoorlijk complex, maar als je de stappen volgt, wordt het makkelijker om te lezen en te navigeren als je het niet in één keer onder de knie hebt.

Stap 1

We maken een document van willekeurige grootte. Dan doen we één truc, die simpelweg onvervangbaar is voor het tekenen van kleine details.

Nu volgen we de instructies. Laten we het document minimaliseren, zodat het niet op volledig scherm wordt weergegeven.

Het document wordt kleiner, pas de grootte aan zodat het ongeveer de helft van het scherm in beslag neemt.

Nu doen we het zoals weergegeven in de onderstaande schermafbeelding, daardoor krijgen we een tweede scherm met ons document. Het belangrijkste hoogtepunt van deze methode is dat een van de documenten kan worden gemaakt grootschalige, bijvoorbeeld 200-500% en dus zal het veel handiger zijn om met details te werken, en op de tweede schaal alle veranderingen op 100% te zien.

De voorbereidingsfase is voorbij, het is tijd om de knop zelf te tekenen.

Stap 2

We creëren nieuwe laag, selecteer de kleur die de hoofdkleur voor de knop zal zijn, ik gaf de voorkeur aan deze: #8cb314 , selecteer het gereedschap Afgeronde rechthoek (de gereedschapsinstellingen zijn te zien in de onderstaande schermafbeelding) en teken de vorm van de toekomstige knop.

Stap 3

In deze stap voegen we volume toe aan onze knop. Laten we beginnen met het midden, we moeten het een beetje donkerder maken, het centrale gebied markeren.

Selecteer een kleur die iets donkerder is dan die op de knop, ik gebruikte: 6a8a09, gebruik vervolgens het gereedschap Verloop en stel de instellingen in zoals in de onderstaande schermafbeelding.

We maken een verloopstrook, zoals in de schermafbeelding, zodat het midden het meest verzadigd van kleur is en de kleur zich naar de randen verspreidt. Om dit effect te creëren, sleept u het gereedschap Verloop van het midden naar de boven- of onderkant.

Maar er was een probleem: kleurverloop komt niet overeen met de vorm van de knop. Gelukkig is het heel simpel op te lossen, klik erop klik met de rechtermuisknop muis op de laag en selecteer Knipmasker maken.

Nu komt het verloop overeen met de vorm van de knop, maar de randen zijn te hard en dat is er niet soepele overgang, is dit opgelost met behulp van het filter? Vervagen? Gaussiaans vervagen en speel met de schuifregelaar totdat de randen van het verloop zacht worden.

Nu moeten we licht toevoegen aan de onder- en bovenkant van de knop, maak een selectie bovenaan.

Wij selecteren lichte kleur(lichter dan de bovenkant van de knop), selecteer het gereedschap Verloop en configureer het zoals in de onderstaande schermafbeelding.

Maak nu een nieuwe laag (let op: alle lagen die we bovenop de knop leggen, worden onmiddellijk overgebracht naar het Knipmasker; een kleine, zwarte pijl links van de laagafbeelding dient als bewijs dat de laag is overgebracht).

Breng op een nieuwe laag een verloop aan en verleng dit van boven naar beneden.

Nu slepen we deze selectie naar beneden, of maken we hieronder een soortgelijke selectie - het hangt ervan af wie handiger is. Selecteer een iets lichtere kleur en pas opnieuw een verloop toe met dezelfde instellingen, alleen trekken we het nu niet van boven naar beneden, maar van onder naar boven.

Stap 4

Het totale volume is ingesteld. Een mooie toevoeging zou een grondigere uitwerking van de knopgrenzen zijn. Door het gebruiken van Rechthoekige feesttent Gereedschap creëren rechthoekige selectieéén pixel hoog.

Stel een verloop in zoals in de onderstaande afbeelding en sleep het vanuit het midden naar een willekeurige rand.

Je krijgt een lijn waarvan de kleur naar de randen toe oplost. Kopieer de laag met de lijn en verplaats deze 1 pixel naar beneden, je krijgt een lijn van twee pixels dik. Je zou natuurlijk meteen een selectie van twee pixels dik kunnen maken, maar het is naar mijn mening handiger om het op 1 te doen, want dat is zo. je kunt het laten staan ​​en het niet dikker maken, d.w.z. het is een kwestie van smaak.

Kopieer nogmaals de laag met de lijn, verlaag deze nog lager met 1 pixel en schilder deze in een lichte tint, bijna wit of wit.

Laten we het resulterende effect overbrengen naar de onderkant van de knop en een geselecteerd gebied maken om een ​​hoogtepunt te creëren, zoals in de onderstaande afbeelding.

Vul de resulterende selectie met wit en verminder de laagdekking. Ik heb het teruggebracht naar 12%.

Stap 5

Voeg tekst toe aan de knop.

Kopieer de laag met de tekst, verplaats deze onder de hoofdtekst en schilder deze verder donkere kleur, verplaats deze 1 pixel naar rechts en 1 naar beneden en verminder vervolgens de dekking van de laag. Hierdoor krijgt de tekst een beetje volume, afhankelijk van het dekkingsniveau dat voor deze laag is ingesteld, kunt u het effect sterker of zwakker maken.

De laatste hand blijft nog: ik denk dat de knop zelf wat duidelijker kan worden gemaakt. Om dit te doen, moet je aftappen een groot aantal van lagen die we tijdens de tutorial hebben gemaakt, behalve de twee tekstlagen. Dit gaat als volgt: selecteer alle lagen met Shift en druk op Ctrl+E.

Nadat de lagen tot één zijn samengevoegd, maakt u er een kopie van en past u het filter Filter ? erop toe. Verscherpen? Onscherp masker... Ik raad aan om met de instellingen te spelen om het resultaat te krijgen dat het beste bij u past.

Eén vraag blijft: “Waarom hebben we de laag vóór deze operatie gedupliceerd.” Alles is heel eenvoudig: als de acties van het filter na een minuut plotseling een beetje oververzadigd lijken, kun je het effect verminderen door de dekking van de laag waarop het filter is toegepast te verlagen.

De knop is klaar, veel succes.

Deel de les

legale informatie

Gegroet, vrienden! Vandaag gaan we het doen mooie knoop voor een website in Photoshop. De les is behoorlijk complex, maar raakt tegelijkertijd veel aspecten van het werk van een webontwerper, wat betekent dat je in staat zult zijn om kwaliteitsknoppen en iconen voor uw websites zonder veel moeite. Laat me je eraan herinneren dat er al soortgelijke lessen zijn geweest, en nu duiken we in dit onderwerp en overwegen we andere methoden.

Hier is ze, degene glanzende knop, wat we als resultaat zullen krijgen:

Open nu Photoshop en maak je klaar om te gaan!

Mooie knop voor de site

Creëren nieuw document formaat 800x500px.

Eerst moet u de vorm van de toekomstige knop instellen. Dit is wat we zullen doen. Ik zeg het meteen: in deze les zal ik over heel veel praten moeilijk pad formulieren maken. Als u niet met de Pen-tool wilt werken, of als het nog steeds moeilijk voor u is, ga dan direct naar hoofdstuk 2, daar wordt een eenvoudigere manier getoond.

Welnu, hoofdstuk 1 is voor degenen die iets nieuws willen leren.

Hoofdstuk 1. Maak een knopvorm met behulp van het pengereedschap

Laten we vooruitkijkend de voordelen bespreken van de methode met behulp van de Pen-tool. Allereerst flexibiliteit bij het maken van het formulier. Je kunt alles ‘beeldhouwen’. Met tools zoals het Rechthoekgereedschap (rechthoek) kun je dit uiteraard niet doen, dus je krijgt zeer standaardknoppen.

1. Genoeg gepraat dus. Laten we beginnen. Neem het gereedschap Pen en maak een vorm als deze:

2. De vorm van onze knop bleek erg scheef en bij benadering te zijn. Nu zullen we een heel belangrijk onderwerp bespreken: werken met gidsen. Gidsen helpen enorm bij het werk van de ontwerper. Ze zijn handig voor het meten van afstanden. Nu zul je alles zelf begrijpen. Om te beginnen is het beter om de achtergrond te vullen met een andere kleur dan wit. Laat het grijs zijn (#d9d9d9). Neem het gereedschap Verfemmer en ga naar de achtergrondlaag en vul deze met de geselecteerde kleur:

3. Oké, laten we nu de hulplijnen instellen en de knopvorm daarmee uitlijnen. Om een ​​gids in te stellen, gaat u naar het menu Beeld -> Nieuwe gids. Vink het selectievakje Verticaal aan en voer een waarde van 200px in:

Zoals u kunt zien, is de gids verschenen op een positie 200px vanaf de linkerrand van het canvas. Als u nu op de combinatie drukt Ctrl-toetsen+H dan verdwijnt de gids. Als u nogmaals op deze combinatie drukt, keert de gids terug.

5. Stel een andere gids in op Verticaal 600px:

6. Je hebt nog 4 hulplijnen nodig in de posities Verticaal 160 en 640px, evenals Horizontaal 150 en 350px. Het zou er ongeveer zo uit moeten zien:

7. Het is tijd om de vorm waterpas te zetten. Om dit te doen, gebruikt u het gereedschap Direct selecteren:

En werk dan, op basis van het raster, met het formulier. Als er niet genoeg handleidingen zijn, kunt u deze toevoegen. Hulplijnen kunnen ook worden toegevoegd vanaf de liniaal (opgeroepen met Ctrl+R). Om dit te doen, drukt u op de lijn van de liniaal en trekt u als het ware de geleiders eruit. Gebruik tijdens het werken voor uw gemak de schaalverdeling en zoom in op het canvas (Ctrl + muiswiel).

Je zou dus zoiets als dit moeten krijgen voor een toekomstige mooie knop:

Zoals je kunt zien, moest ik nog een paar handleidingen toevoegen. Het formulier is gereed, u kunt verder.

Hoofdstuk 2. Een knop vormgeven met eenvoudige middelen.

8. Zoals beloofd, zal ik je nu vertellen hoe je in letterlijk 20 seconden een knopvorm kunt maken. Selecteer het gereedschap Afgeronde rechthoek:

Stel de afschuiningsradius in op 90px:

Dat is alles, het formulier is klaar :)


Hoofdstuk 3. Glanzende knop

9. Nu gaan we aan de slag met het creëren van de effecten voor de knop. Het maakt niet uit hoe je de basis van de knop (formulier) hebt gemaakt, het principe is hetzelfde. Laten we beginnen met het toevoegen van wat tekst aan de knop. Maak een nieuwe laag (Shift+Ctrl+N) en schrijf tekst:

Maak de tekst een kleur donkerder dan de knop zelf. Voor de vorm heb ik overigens kleur #3e7bab gebruikt, voor de knop #183e5b.

10. Maak een kopie van de vormlaag (Ctrl+J). Verander de kleur naar wit, druk op Ctrl+T ( Vrije vervorming), en verklein de vorm op deze manier:

11. Verlaag de laagdekking naar 35%:

Zoals je waarschijnlijk al geraden had, hebben we zojuist een hoogtepunt voor onze prachtige knoop gemaakt.

12. Maak een laagmasker voor de markering:

13. Neem nu een zachte zwarte borstel van 400px-formaat:

Gebruik dit penseel om over de onderkant van de highlight te gaan. Het zou er zo uit moeten zien:

14. Maak een kopie van de markering en "veeg" op het laagmasker met een zwarte borstel de hele ruimte binnen de markering, zodat alleen bovenste deel. Mengmodus Zacht licht (Zacht licht), en stel de dekking in op 100%:

15. Maak een nieuwe laag, neem een ​​zachte witte borstel met een diameter van 8px en teken een streep bovenop de highlight (om de streep perfect recht te maken, houd de Shift-toets ingedrukt):

16. Maak een masker voor deze laag en gum de randen van de strook weg:

17. Dupliceer de laag met de streep en pas Filter (Filter) -> Vervagen (Vervagen) -> Gaussiaans vervagen (Gaussiaans) toe, straal 4,6 px:

18. Druk op Ctrl+klik op de miniatuur van de laag met de eerste markering, er verschijnt een selectie. Terwijl u zich op de laag met de streep bevindt, drukt u op Delete, gaat u vervolgens naar de laag met de vervaging die zojuist is toegepast en drukt u ook op Delete:

Het doel van deze bewerking is om onnodige delen van de strip te verwijderen die op andere elementen klimmen (je kunt trouwens eenvoudig onnodige delen wissen met een gum, maar het gebruik van selectie is nauwkeuriger).

19. We doen iets soortgelijks voor de omtrek van de vorm. Ctrl+klik op de hoofdomtrek van de knop en vervolgens Ctrl+Shift+I om de selectie om te keren, en druk op Delete op beide lagen met de streep. Nu zou de knop er zo uit moeten zien:

20. Nu kunnen de lagen met lijnen worden gecombineerd (Ctrl+E) en de dekking op 80% worden gezet om een ​​natuurlijke highlight te krijgen.

21. We blijven werken met verblinding en licht. Maak een nieuwe laag en gebruik een zachte witte borstel om een ​​plek als deze te schilderen:

22. De nu bekende handeling waarbij u de omtrek van de knop selecteert (Ctrl + klik op de vorm van de knop in het lagenpaneel) en vervolgens Shift+Ctrl+I en Delete omdraait. Mengmodus Zacht licht, dekking 70%:

23. Kopieer de tekstlaag, plaats deze onder de hoofdlaag, zet de kleur iets lichter dan de knop (ik heb #79afdb) en verplaats deze laag 1px naar beneden. We krijgen het reliëfeffect:

24. Maak met behulp van het gereedschap Pen enkele highlights aan beide zijden van de knop en verminder de dekking ervan tot 10-20%:

25. Deze knop leek mij te groot, dus selecteerde ik alle lagen behalve de tekst, drukte op Ctrl+T en verkleinde de hoogte van de knop:

26. Je kunt onderaan nog een kleine highlight toevoegen. Je weet al hoe je dit moet doen. Nu ziet de knop er zo uit:

27. We zijn bijna klaar. Er moeten nog enkele effecten worden toegevoegd. Laten we een reflectie maken. Kopieer alle lagen (selecteer ze en druk op Ctrl+J). Klik met de rechtermuisknop op een van de gekopieerde lagen en selecteer Converteren naar slim object. Ga daarna naar Bewerken -> Transformeren -> Verticaal spiegelen. Verlaag de dekking naar 52%:

Gebruik nu een laagmasker om het onderste deel van de reflectie te wissen:

28. Oké, de knop is nu echt mooi :) Het enige dat overblijft is het maken van de schaduw. Maak een laag boven de achtergrond en onder alle andere, en schilder met een harde borstel een zwarte lijn:

29. Pas een Gaussiaanse vervaging toe met een straal van 8 px, laagdekking 46px. Pas de schaduw aan totdat je er tevreden mee bent:

30. Eigenlijk is dat alles, de professionele glanzende knop is klaar. Nu kunt u de achtergrond verwijderen, de grootte wijzigen naar wat u op de site nodig heeft (Afbeelding -> Afbeeldingsgrootte) en deze gebruiken tot grote vreugde van uzelf en uw gebruikers.

De les bleek erg lang te zijn, maar ik hoop dat je veel nieuwe dingen hebt geleerd, en als je zelf alle stappen hebt doorlopen, kun je nu eenvoudig een mooie knop voor je website maken.

Door de stappen van deze tutorial te volgen, leert u hoe u een vector-aan/uit-knop kunt maken Adobe Illustrator. Eerst leert u hoe u het raster kunt aanpassen en een eenvoudige rechthoek kunt maken die als achtergrond zal dienen. Vervolgens technieken gebruiken om basis te creëren vectorvormen, maak een cirkel en omtrek die de knop zelf vormen. Door ten slotte optimaal gebruik te maken van het deelvenster Uiterlijk, voegt u kleur, schaduwen en hooglichten toe, waardoor diepte aan uw objecten wordt toegevoegd.

Stap 1.

Klik Ctrl + N om een ​​nieuw document te maken. Selecteer Pixels in het vervolgkeuzemenu Eenheden (Eenheden), set de breedte (breedte) en hoogte (hoogte) van het document zijn 600 pixels, klik vervolgens op de knop Bovendien (geavanceerd), selecteer Kleur mode Kleurmodus: RGB, Rastereffecten: Scherm (72ppi) Zorg ervoor dat het selectievakje is uitgeschakeld Lijn nieuwe objecten uit op het pixelraster, druk op OK.

Laten we het raster instellen: selecteer in het menu Weergave > Raster tonen (Weergave > Raster tonen (Ctrl + ") en nogmaals Weergave > Uitlijnen op raster (Weergave > Uitlijnen op raster (Shift + Ctrl + "). Je hebt een raster nodig met een cel van 5 pixels. Je kunt dit configureren door naar het menu te gaan Bewerken > Voorkeuren > Hulplijnen en raster (Bewerken > Voorkeuren > Hulplijnen > Raster). Voer de waarde 5 in het vak in Rasterlijn elke en stop er 1 in de doos Interne indeling in (onderverdelingen). Laat u niet intimideren door deze rastervoorbereidingen - het zal uw werk gemakkelijker maken en u kunt de zichtbaarheid van het raster altijd uitschakelen door op te klikken (Ctrl + "). U kunt ook een keuze maken uit het menu Venster > Informatie (Venster > Info (Ctrl + F8), om informatie over de maateenheden van het document te bekijken. Zorg ervoor dat er pixels aanwezig zijn. Als dit niet het geval is, kunt u deze installeren via Menu > Instellingen > Eenheden > Algemeen (Bewerken > Voorkeuren > Eenheden > Algemeen). Dit zal het verdere werk aanzienlijk vereenvoudigen.

Stap 2.

Nemen Rechthoekgereedschap (M). Zijpaneel Werkbalk verwijder de kleur uit de streek en selecteer de vulkleur R=50 G=50 B=50. Klik nu eenmaal met de linkermuisknop op het canvas om het instellingenvenster te openen. Voer waarde in 610 in de velden Breedte en Hoogte en druk op OK. Uiteindelijk zou je een vierkant moeten krijgen 610 x 610 pixels. Open vervolgens het paneel Uitlijnen - Venster > Uitlijnen (Shift + F7). In het vervolgkeuzemenu van het deelvenster selecteert u Uitlijnen op tekengebied (Uitlijnen op tekengebied) en klik vervolgens op de pictogrammen Horizontale uitlijning in het midden (Horizontaal uitlijnen midden) en Verticale uitlijning gecentreerd ( Verticaal uitlijnen Centrum). Als gevolg hiervan moet uw donkere vorm het hele tekengebied bedekken, zoals weergegeven in de afbeelding.

Stap 3.

Op het paneel Werkbalk selecteer vulkleur R=70 G=175 B=15 en overstappen naar Ellipsgereedschap (L). Maak een cirkel met een diameter 110 pixels en centreer het op dezelfde manier als we deden met het vierkant.

Stap 4.

Ga met de groene cirkel gemarkeerd naar het menu Object > Pad > Offsetpad maken (Object > Pad > Offsetpad). Voer in het venster dat verschijnt in -40px en klik op OK. Selecteer de resulterende omtrek en ga naar het paneel Uiterlijk - Venster > Uiterlijk. Verwijder de vulkleur, stel de lijnkleur in op wit en verhoog de lijndikte (slaggewicht) tot 6 punten.


Stap 5.

Hoogtepunt witte omtrek en ga naar menu Object > Pad > Toevoegen referentiepunten(Object > Pad > Ankerpunten toevoegen). Neem dan Gereedschap Directe selectie (A), selecteer de bovenste punten (gemarkeerd in de tweede afbeelding) en druk eenvoudigweg op de toets Verwijderen op toetsenbord. Selecteer het resterende pad, open het paneel Lijn – Venster > Lijn en klik op het pictogram. Als resultaat zou alles er uit moeten zien zoals op de derde afbeelding.
Volgende opname Pengereedschap (P) en maak een verticale omtrek met een hoogte van 15 pixels en plaats het vervolgens zoals weergegeven in de vierde afbeelding. Stel de streekkleur voor dit pad in op wit, dikte (gewicht) 6 punten, klik op het pictogram Afgeronde uiteinden (ronde dop).

Stap 6

Selecteer beide witte contouren en ga naar het menu Object > Pad > Lijn omzetten in curven (Object > Pad > Omtreklijn). Selecteer beide gemaakte vormen en druk op de sneltoets Ctrl + 8 (of via het menu Object > Samengesteld pad > Maken - Object > Samengesteld pad > Maken).


Stap 7

Hoogtepunt groene cirkel, ga naar het paneel Verschijning en klik op het pictogram Toevoegen nieuwe vulling(Nieuwe vulling toevoegen) aan de onderkant van het paneel. Selecteer deze nieuwe vulling, open het paneel Verloop - Venster > Verloop) en klik op de verloopminiatuur om een ​​standaard lineair verloop van zwart naar wit toe te voegen. Op het paneel Stel het verloop in op Hoek: 90 graden. Selecteer vervolgens de juiste schuifregelaar voor de kleurverloop en stel de kleur in R=0 G=95 B=0, Stel de kleur van de linkerschuifregelaar in R=130 G=225 B=75. Ga vervolgens, met de tweede vulling geselecteerd, naar het menu Object > Pad > Maak een parallel pad (Object > Pad > Offsetpad), invoeren in het venster dat verschijnt Offset -8 pixels en klik op OK.

Stap 8

Nogmaals, met de groene cirkel geselecteerd, op het paneel Verschijning voeg een derde vulling toe door op het pictogram te klikken Voeg een nieuwe vulling toe (Nieuwe vulling toevoegen). Selecteer ook het standaardverloop voor deze vulling en stel vervolgens in Hoek: 90 graden, Zie de afbeelding voor verloopkleuren. Klik vervolgens op de pijl links van het tabblad met een nieuwe vulling en klik vervolgens op de inscriptie Dekking en stel in het venster dat verschijnt de overvloeimodus in Overlay (Overlay) en verminder de dekking (dekking) tot 60%. Selecteer vervolgens in het menu Object > Pad > Maak een parallel pad (Object > Pad > Offsetpad), stel de Offset in op -4 pixels en klik op OK.

Stap 9

Selecteer de groene cirkel en voeg een vierde vulling toe. Selecteer het en pas het toe Verloop - Gereedschap Verloop (G): Type: Radiaal; Zie de afbeelding voor verloopkleuren. Selecteer vervolgens in het menu Object > Pad > Maak een parallel pad (Object > Pad > Offsetpad), Offset (Offset) -10 pixels. Voeg vervolgens toe vanuit het menu Effect> Stileren> Innerlijke gloed met deze instellingen:

Mengmodus: Overlapping (overlay);

kleur R=0 G=0 B=0

Dekking: 30%;

Vervaging: 10 pixels

selecteer Rand

Stap 10

Nu, met de groene cirkel geselecteerd, op het paneel Verschijning Selecteer de huidige streek en stel de kleur ervan in op zwart. Ga naar paneel Slag, stel het gewicht in op 1 punt, klik vervolgens op het pictogram Lijn de lijn uit naar binnen. Volgende op het paneel Uiterlijk: verlaag de dekking van de zwarte streek naar 15% en verander de overvloeimodus naar Zacht licht. Ga vervolgens naar het menu Object > Pad > Maak een parallel pad (Object > Pad > Offsetpad), Offset (Offset) -10 pixels en klik op OK.

Stap 11

Met de groene cirkel geselecteerd op het paneel Verschijning selecteer de huidige streek en dupliceer deze door op het pictogram Geselecteerde dupliceren te klikken object (dupliceer geselecteerd item)(gemarkeerd met een blauwe pijl op de onderstaande afbeelding). Selecteer nu de lijn die u zojuist hebt gemaakt, verhoog de dikte (Gewicht) naar 3 punten en verminder de dekking (dekking) naar 10%. Dupliceer deze 3pt-streek en verhoog vervolgens het gewicht (Gewicht) van de gedupliceerde streek op 5 punten en stel de dekking (dekking) in op 5%.

Stap 12

Selecteer opnieuw de groene cirkel. Voeg een nieuwe vulling toe aan het paneel Uiterlijk, verminder vervolgens de dekking naar 50% en verander de overvloeimodus naar Overlay. Ga vervolgens naar het menu Effect > Vervormen en transformeren > Transformeren (Effect > Vervormen en transformeren > Transformeren) en stel de volgende instellingen in: Schalen: - Horizontaal (Schaal - Horizontaal) 30%; Horizontaal (Schaal - Verticaal) 5%

Verplaatsen: - Horizontaal (Verplaatsen-Horizontaal) 0 pixels; Verticaal (Verticaal verplaatsen) 30 pixels.

Schakel de selectievakjes uit Reflecteer X en Reflecteer Y, willekeurig.
Maak vervolgens een keuze uit het menu Effect > Verdraaien > Boog (Effecten > Verdraaien > Boog) en pas de volgende instellingen toe:

- selecteer Horizontaal

- Buig: -40%

Sectievervorming

- Horizontaal: 0%

- Verticaal: 0%
Klik OK.

Stap 13

Selecteer de groene cirkel, voeg een nieuwe vulling toe en stel de kleur in R=30 G=30 B=30. Sleep deze vulling naar de onderkant van het paneel Verschijning met de vulling geselecteerd, ga naar het menu Object > Pad > Offsetpad maken (Object > Pad > Offsetpad), set Offset 4 pixels, klik op OK. Volgende toepassen Effect> Stileren> Slagschaduw met de volgende instellingen:

Mengmodus : Zacht licht;

Dekking: 80%;

Verschuiving langs de X-as (X-offset): 0 pixels;

Verschuiving langs de Y-as (Y-offset): 1 pixel;

Vervaging: 0 pixels;

Kleur wit.

Stap 14

Voeg vervolgens, met de groene cirkel geselecteerd, opnieuw een nieuwe vulling toe en sleep deze naar beneden in het paneel Uiterlijk, toevoegen Lineair verloop (lineaire gradiënt), Hoek: 90 graden, Zie de afbeelding voor kleuren. Selecteer vervolgens in het menu Object > Pad > Maak een parallel pad (Object > Pad > Offsetpad), Offset (Offset) 15 pixels, klik op OK.
Toevoegen via menu Effect Vervagen Gaussiaans vervagen (Effect > Vervagen > Gaussiaans vervagen), Straal (Straal) 10 pixels. Klik OK.

Stap 15

Nogmaals, met de groene cirkel geselecteerd op het paneel Verschijning selecteer de onderste vulling en dupliceer deze door op het pictogram Een duplicaat van geselecteerd object maken te klikken (Dupliceer geselecteerd item). Open een bestaand effect voor deze vulling Parallel pad (Offsetpad) en verklein de Offset (Offset) tot 10 pixels en open vervolgens het effect van deze vulling Gaussiaanse vervaging en verklein de straal tot 3 pixels. Klik OK.

Stap 16

Selecteer de groene cirkel in het paneel Verschijning selecteer groene vulling met kleur (R=70 G=175 B=15) en ga naar menu Effect> Stileren> Innerlijke gloed en stel de volgende instellingen in:

Mengmodus: Overlapping (overlay);

zwarte kleur

Vervaging: 5 pixels

selecteer Rand.
Klik OK.

Nog een effect toevoegen: Effect> Stileren> Gloed buiten

Overvloeimodus: Normaal;

kleur R=10 G=125 B=0

Dekking: 100%;

Vervaging: 2 pixels

Stap 17

Selecteer het witte samengestelde pad en vervang de huidige vulling door Verloop - Gereedschap Verloop (G): Type: Radiaal van wit naar grijs R=211 G=211 B=211, Hoek: 0 graden

Stap 18

Voeg, terwijl het samengestelde pad is geselecteerd, een tweede vulling toe en stel de kleur in R=100 G=205 B=45. Wijzig de overvloeimodus naar Vermenigvuldiging en selecteer vervolgens in het menu Object > Pad > Maak een parallel pad (Object > Pad > Offsetpad), Offset (Offset) -2,5 pixels. Klik OK.


Stap 19

Selecteer vervolgens het samengestelde pad (als dit niet is geselecteerd) in het paneel Verschijning selecteer de huidige lijn, verander de kleur in zwart, maak deze kleiner Dekking op 15% en klik op het pictogram Lijn naar binnen uitlijnen. Terug naar paneel Verschijning en voeg nog een streek toe door op het pictogram Nieuwe streek toevoegen te klikken (Nieuwe streek toevoegen)(aangegeven door een blauwe pijl in de figuur). Selecteer deze nieuwe streek en maak deze kleiner Dekking tot 25%, klik op het pictogram Lijn de lijn uit naar buiten.


Stap 20.

Selecteer de cirkel samen met het samengestelde pad en dupliceer ze door erop te klikken Ctrl+C > Ctrl+F. Selecteer nu deze kopieën en sleep ze een paar pixels naar beneden, zoals weergegeven in de tweede afbeelding.

Stap 21

Selecteer de cirkel van de gekopieerde knop en in het paneel Verschijning Selecteer de vijfde vulling (vanaf de onderkant geteld) en vervang de verloopkleuren door de kleuren die in de afbeelding worden weergegeven (geel en oranje). Vervang vervolgens de groene vulkleur door oranje (R=227 G=128 B=10). Selecteer deze oranje vulling en open het effect ervan Buitenste gloed en wijzig de instellingen in: Overvloeimodus: Normaal;

kleur R=239 G=65 B=54

Dekking: 100%;

Vervaging: 2 pixels.

Stap 22

Stap 23

Ik hoop dat je de les leuk vond en dat je het geleerde in je toekomstige projecten zult toepassen.