„Photoshop“ sukurkite „Web 2.0“ mygtuką

Mygtukai „Photoshop“ vadovėliai tikriausiai yra viena iš karščiausių kategorijų bet kurioje „Photoshop“ vadovo svetainėje ir nuo to laiko, kai „Web 2.0“ yra tokios karštos temos. Pamoka po šuolio.

Sukurkite tuščią drobę apie 500 px (plotis) x 400px (aukštis), kad pradėtumėte mygtuko dizainą. Sukurti naują sluoksnio skambutįbg01„. Pasirinkite Apvalus stačiakampis įrankis, laikykite SHIFT ir nubrėžkite centrinę aikštę centre. Bet kokia spalva yra tinkama dabartiniame etape.

Pakvieskite Maišymo parinktys apie 'bg01ir sureguliuokite šiuos stilius:

Mesti šešėlį

• Neskaidrumas: 40%
• Atstumas: 0px
• Paskirstymas: 0%
• Dydis: 6px

Gradiant perdangos

• Spalvų sustojimas: 0%, # d00031
• Spalvų sustojimas: 100%, # ff2b5d

Laikykite nuspaudę CTRL, spustelėkite kairįjį klavišą „bg01„Sluoksnio miniatiūra, kad pasirinktumėte jo formą. Eik Pasirinkite -> Keisti -> Sutartis ir įveskite vertę “2px„. Tai sumažins pasirinktą plotą 2 pikseliais.

Sukurti naują sluoksnio skambutįbg02„ir užpildėte pažymėtą (po susitraukimo) zoną bet kokia spalva. Čia naudoju # 000000 juodą. Dukart spustelėkite „bg02“, kad paleistumėte Maišymo parinktis ir patobulinkite šį stilių.

Gradiant perdangos

• Spalvų sustojimas: 0%, # c6002f
• Spalvų sustojimas: 100%, # c6002f

Sukurkite naują teksto sluoksnį, skambinkite „txt„. Įdėkite mygtuko tekstą. Aš reprezentuosiu abėcėlę. Naudojami šriftų stiliai yra tokie:

• Suapvalintas Arial Bold
• 150pt

Tą patį, priėmus tekstą, dukart spustelėkite „txt“, kad paleistumėte Maišymo parinktys ir keiskite šiuos stilius.

Mesti šešėlį

• Neskaidrumas: 25%
• Atstumas: 0px
• Paskirstymas: 0px
• Dydis: 5px

Vidinis šešėlis

• Neskaidrumas: 10%
• Atstumas: 0px
• Droselis: 0
• Dydis: 10px

Bevel Emboss

• Gylis: 1px
• Kryptis: žemyn
• Dydis: 0px
• Softten: 0px
• Paryškinkite režimo neskaidrumą: 32%
• Šešėlių režimo neskaidrumas: 32%

Gradiant perdangos

• Spalvų sustabdymas: 0% # d2d2d2
• Spalvų stabdymas: 100% # f0efef

Mygtukas beveik baigtas. Leiskite jai šiek tiek švyti viršutinėje dalyje. Laikykite CTRL, kairysis spustelėjimas 'bg02„Sluoksnio miniatiūra, skirta išskirti išorinę formą; pasirinkti „Eclipse Marquee“ įrankis. Dabar laikykite ALT, pasirinkus „Eclipse Marquee“ įrankį, vilkite į viršų, kad būtų ištrinta apatinė paryškintos srities pusė. Žr. Aukščiau esantį paveikslėlį.

Pažymėjus viršutinę dalį ir „Eclipse Marquee“ įrankį vis dar pasirinkta, dešiniuoju pelės mygtuku spustelėkite ir pasirinkite Plunksna; įveskite 15px spinduliui.

Sukurkite naują sluoksnį, skambinkite „švytiir užpildykite pažymėtą dalį balta [#ffffff]. Tai turėtų pridėti švytėjimo efektą viršutinėje mygtuko dalyje. Galutinis produktas turėtų atrodyti panašiai kaip žemiau pateiktas vaizdas.

Atsisiųsti vadovėlį

Kažkas papildomai ...

Susukti „Maišymo parinktis“bg01„ir“bg02„suteiks jums daugiau įdomių mygtukų. Štai dar vienas „Photoshop“ pamokos mygtukas, kurį padariau anksčiau - sukurkite „Glossy“ mygtuką „Web 2.0“

Atsisiųsti mėginį