Web 2.0 felület tervezése a Photoshop programban
Az alábbi bemutató megértése megérti a technikát, és ezzel grafikus felhasználói felületet hozhat létre egy weboldal számára. Oldalsó navigáció, gombok, fejlécek, például. Minden Web 2.0 stílus.
Új vászon indítása; bármely méret. Valami nagyobb, mint 450x300px lenne jó. Válaszd ki a Lekerekített négyszögletes eszköz és rajzoljon egy téglalap alakú, mint a fenti képen látható.
Kattintson duplán a lekerekített téglalap alakú rétegre a Keverési opciók. Módosítsa a következő stílusok beállításait.
Árnyék
Opacitás: 31% Távolság: 1px Spread: 0% Méret: 5px
Bevésés és domborítás
Mélység: 100% Méret: 0px Lágyítás: 0px
Gradiens átfedés
Kattintson duplán a Gradiant elemre, és állítsa be az alábbi stoppontokat. Helyszín: 0%, # 1378cd Hely: 100% # 4da5f0
ütés
Méret: 5px pozíció: belső szín: # 54abf6
Helyezzünk be szöveget, címkét, URL-t vagy valamit. Vidd el, és igazítsd a jobb oldalt, így a logó a bal oldalon később maradhat. Stílusozzuk a szöveget. Lucida Sans Unicode-ot használok; 55pt; sima; -120 karakterkövetéshez (betű-távolság). Kattintson duplán a szöveges rétegre, és állítsa be a következőt Keverési opciók.
Színátmenet
Kattintson duplán a Gradiant elemre, és állítsa be az alábbi stoppontokat. Helyszín: 0%, # 9ec7eb Tartózkodási hely: 100% ecf6ff
Ezután be kell helyeznie a logót a szöveg bal oldalán. A logót az 5px sugarú, lekerekített téglalap segítségével fogom használni. Itt van Keverési opció A kerekített téglalap beállításai.
Belső árnyék
Opacitás: 45% Távolság: 0px Méret: 43px;
Bevésés és domborítás
Mélység: 100% Méret: 0px Lágyítás: 0px Kiemelés mód Opacity: 50% ShadowMode Opacity: 100%
Gradiens átfedés
Kattintson duplán a Gradiant elemre, és állítsa be az alábbi stoppontokat. Helyszín: 0% # 0e2f4a Elhelyezkedés: 47% # 001a31 Elhelyezkedés: 48% # 002545 Elhelyezkedés: 100% # 0f4b7f
ütés
Méret: 5px Kattintson duplán a Gradiant elemre, és állítsa be az alábbi stoppontokat. Helyszín: 0% # 1468af Elhelyezkedés: 100% # 50abf8
Adjunk egy kis fényes hatást. Tart CTRL és balra kattintva lekerekített téglalap alakú Réteg miniatűr. Ha a teljes lekerekített téglalap van kiválasztva, megváltozott Téglalap körüli eszköz, tart ALT és kivonja a kiválasztott terület második felét; mint a fenti kép.
Új réteg létrehozása; Húzza fel úgy, hogy minden réteg tetején üljön; töltse ki a kiválasztott részt fehér [#ffffff]; módosítsa az átlátszatlanságot 15% -ra.
A bemutató itt véget ér. Az, hogy hogyan fogja használni ezt a tervet, teljesen rajtad múlik. A méretét és színeit kissé megváltoztatva webes fejlécként vagy gombként használható. Íme néhány példa.
Weboldal fejléc
Weboldal gombok
