Skapa en webb 2.0-flik med Photoshop
Följande guide nedan försöker ge dig en uppfattning om hur man utformar en snygg slät flik meny i Photoshop, Web 2.0 stil.
Steg 1
Skapa en ny duk med vit [#ffffff] bakgrund i vilken storlek du helst, helst rektangulär; De är mer lämpade att rita flikar. Växla sedan till Fliken Kanaler (Windows -> Kanaler), klicka Skapa ny kanal längst ner till höger.
Steg 2
På det valda kanalskiktet, dra samma form med Polygonal Lasso-verktyget. Fyll den upp med vit färg [#ffffff]; avmarkera polygonala regionen (välj något markeringsverktyg och tryck på skärmen); ge formen Gaussisk suddighet med radie 6.0px.
Steg 3
CTRL-L för att ringa upp nivaldialogen och tryck på vänster och högerpil för att möta mittpiloten, som bilden ovan. Det här kommer att “slät” din oskarpa form upp och ger dig en fin avrundad hörnform.
Steg 4
I fliken Kanaler, Håll CTRL, Klicka på Kanalminnebild av lager Alpha 1. Den nya formen kommer nu att väljas, växla tillbaka till Fliken Lager, Skapa nytt lager och fyll i det valda området med svart [# 000000].
Steg 5
Ta bort runda hörn för bot botten åt vänster och nederst till höger, flytta den åt vänster och placera den enligt bilden ovan. Nästa kommer vi att fokusera på fliken svart färg.
Håll CTRL, klicka på fliken Lager miniatyrbild för att få hela flikbilden markerad. | |
Med flikbilden som fortfarande är markerad väljer du Rektangulärt markeringsverktyg, håll ALT och rita en rektangulär region som vi vill ta bort. | |
Du får bara se den översta delen som valts. Välj -> Ändra -> Kontrakt, Kontrakt med 2px och du borde få något som bilden till vänster. | |
Skapa ett nytt lager, fyll i den markerade regionen med vit [#ffffff]. Högerklicka, välj Blandningsalternativ sedan Gradiantöverlagring. Byt ut det vita [#ffffff] färgstoppet med grått [# 616161]. Din flik ska se ut som bilden till vänster. |
Steg 6
Skapa ett nytt lager Välj Avrundat rektangulärt verktyg (Radius 8px), rita en rektangulär och sätt det här lagret bakom det svarta fliklagret. Högerklicka och välj Blandningsalternativ och lägg till följande inställningar.
Drop Shadow
- Opacitet: 31%
- Avstånd: 0px
- Spridning: 0%
- Storlek: 2px
Bevel och Emboss
- Djup: 100%
- Storlek: 0px
- Mjuka: 0px
Gradiantöverlagring
- Här är inställningarna för färgstopp.
- Färg: #aaaaaa, Plats: 0%
- Färg: #ffffff, Plats 100%
Steg 7
Sätt in lite text för att se det övergripande web 2.0-utseendet. Jag använder typsnittet Lucida Fax, typsnittstyp 32pt och 25pt. Och din flik är klar! Känn dig fri att leka med flikens färgkombination.
Hämta handledning