Fényes web 2.0 gomb megtervezése a Photoshopban

Néhány fényes megjelenésű Web 2.0 gomb megtervezése? Íme egy egyszerű Photoshop bemutató, amely lépésről lépésre megadja, hogyan lehet egy szép megjelenésű piros fényes gombot kapni.

1. lépés - Az alap létrehozása

Tűzz ki egy új vászont, és állítsa be az alábbi beállításokat (sárga színnel jelölve) az alábbi kép szerint. A többiek alapértelmezés szerint jönnek. Lehet, hogy kétszer is ellenőrizni fogja az alapértelmezett értékeket is.

Új réteg hívás létrehozása 'Gomb'

A „Gomb” rétegben válassza ki a lekerekített téglalap eszközt

Adjon 7px sugarat

Rajzoljon az alábbi képhez hasonló téglalapot.

2. lépés - Piros gomb

Kattintson a jobb gombbal a "Gomb" réteg keverési beállításaira

Csúsztassa a következő beállításokat

Árnyék

Belső árnyék

Bevésés és domborítás

Gradiens átfedés

A gombnak valami hasonlónak kell lennie

3. lépés - Fényes hatás létrehozása

Új réteg létrehozása „Üveg”

Válassza a Retangular marquee eszközt, és győződjön meg róla, hogy kiválasztja a 'Button' réteget. Tartsa nyomva a ctrl billentyűt, és kattintson a rétegre”s réteg indexképe. A gomb most kiemelve lesz.

Most válassza az „Üveg” gombot, tartsa lenyomva az Alt billentyűt a Retangular marquee eszközzel. Rajzoljon (vágja) a gomb alsó felén, mint az alábbi kép.

Töltse ki a kiválasztott területet fehér színnel #ffffff a Paint Bucket Tool segítségével

Az opacitás beállítása 18% -ra

Ennek fényes gombja van.

4. lépés - Minta átfedés

Adjunk egy kis enyhe mintázatot. A korábban létrehozott egyéni stripe5px-et fogom használni. Hozzon létre egy új réteget a "Minta", a "Gomb" és az "Üveg" között, és folytassa a keverési opciókkal.

Válassza a Minta átfedés lehetőséget, válassza a Stripe5px (vagy bármely létrehozott mintát), majd kattintson az OK gombra, majd zárja be a párbeszédet.

Győződjön meg róla, hogy még mindig a Téglalap alakú Marquee eszközt használja és kattintson a Button réteg bélyegképére, hogy megkapja a gombokat. Töltse ki a kijelölt területet a "Minta" rétegben Paint Bucket eszközzel, és állítsa be a réteg átlátszóságát 5% -ra

5. lépés - Szöveg beszúrása

Dobjunk néhány véletlenszerű szöveget fehér #ffffff színbe a következő beállításokkal

Használja a következő keverési hatásokat a szöveges rétegre.

Árnyék

6. lépés - Végső kimenet

Ilyen képet kell kapnia.