• Inici
  • Sobre
  • Articles
  • Contacti'ns

: 91 11 9810018780 Mail a: info@aceinfowayindia.com / Call: 91 11 9810018780

  • Article escrit
  • el 10.11.2009
  • at 12:37 PM
  • per admin

Com crear Niça requadre de text del botó en Photoshop

Aquest és un començament renti'l disseny tutorial. En aquest article trobaràs Com crear Niça requadre de text del botó en Photoshop. Això és molt fàcil i ràpid tutorial.I disseny gràfic Esperem que gaudeixin d'aquest tutorial.

Final Preview

Això és el que hem anat fer avui

inset-button-tutorial-final

Pas # 1

Photoshop Obrir i crear un nou document, el meu és 550px × 356px amb un fons blanc.

inset-button-tutorial-step1

Pas # 2

Seleccioneu l'eina Rectangle arrodonit i crear el botó, el radi meu és 6px.

inset-button-tutorial-step2

Ara anem a aplicar alguns efectes

Superposició de degradat

L'estil del botó de doble clic sobre la miniatura de la capa de botó en el panell Capes per obrir el quadre de diàleg Estil de capa, anem a aplicar un efecte de Gradiant vertical per el botó. Després feu clic al gradient de color a la dreta de l'opció de degradat per obrir l'olor C Editor de degradat.

3d-bottom-layer

Feu doble clic al left-color-stop i entrar en el valor de color # 848.484, a continuació, feu doble clic sobre el dret-color-stop i entrar en el valor de color C4C4C4 #.

inset-button-tutorial-step2a

Ombra

Després apliques l'estil de la capa d'ombra. Mantingui l'angle de 120, de canviar els valors d'opacitat, distància i la mida. Puc escollir per establir la Opacitat al 47%, a distància a 2px i la mida al 4px.

inset-button-tutorial-step2d

Hauria de tenir aquest aspecte.

inset-button-tutorial-step2Dropshadow

Cop

A continuació s'aplicarà el moviment. Primer canvi dels valors de la seva mida. Puc triar per establir la mida de 1px, Posició en l'exterior. Trio per establir l'opacitat al 100%. Canviar el color dels traços per defecte # 666666

inset-button-tutorial-step2e

Hauria de tenir aquest aspecte.

inset-button-tutorial-step2Stroke

Pas # 3

Seleccioneu Horitzontal tipus d'eina i escriviu el text en la part davantera.

inset-button-tutorial-step3

Ara anem a aplicar alguns efectes per al text.

Color Overlay

Feu doble clic a la miniatura de la capa de text en el panell Capes per obrir el quadre de diàleg Estil de capa. Primer anem a aplicar superposició de color, jo trio el color # 303.030

inset-button-tutorial-step3a

Ombra interior

Després apliques l'estil d'ombra Capa interna. Part més important mantenir l'angle de 41, de canviar els valors d'opacitat, distància i la mida. Puc escollir per establir la Opacitat al 75% i la distància en 1px i mida de 1px.

inset-button-tutorial-step3Innershadow

Ombra

Finalment anem a aplicar l'ombra, en primer lloc canviar l'opció de fusió a Normal. Canviar el color de l'ombra de la predeterminada a # FFFFFF. Mantingui l'angle en el 90, de canviar els valors de l'opacitat i la distància. Puc escollir per establir la Opacitat al 47% i la distància en 1px.

inset-button-tutorial-step3c

Resultats

inset-button-tutorial-final

Si ho desitja, per comprovar el seu treball, podeu descarregar l'arxiu PSD per aquest tutorial

Si vol rebre més inspiració de nosaltres, si us plau considera subscriure't al nostre feed de RSS o per correu electrònic.

Filed under: Photoshop, Tutorials per admin

Promoure Us

  • Add to Mixx!

Etiquetes: Photoshop, tutorials

Articles relacionats:

Si heu gaudit llegint aquest article, si us plau, fes un cop d'ull a altres articles relacionats a continuació:

    • Com crear tipografia Tipografia en Photoshop
    • Com crear Nice Easy 3D Efecte de text en Photoshop
    • Com crear I-Phone Com botó en Photoshop
    • Com crear un elegant botó de Niça Dark en Photoshop
    • Com crear efecte de text llis brillant en Photoshop
Untitled Document

Una Comentaris

  1. Sam Logan, diu el: 15 novembre 2009 a les 4:09 pm Said:

    Gran efecte, molt útil i es veu fantàstic, gràcies per el tutorial d'ajuda.
    Últim bloc Sam Logan's .. Molt lloc web Flash cool? El meu perfil ComLuv

Enviar un comentari

XHTML: Pots utilitzar aquestes etiquetes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> l'datetime = ""> <em> <i> <strike> <strong>


CommentLuv Enabled veure mes
«10 Awesome Free Hand Drawn Icona de Jocs
25 Awesome iPhone App webs »
Untitled Document

    Subscriure's

  • Subscriu-te al nostre feed
  • Subscripció per correu electrònic
  • Siga amb nosaltres a Twitter
  • Patrocinador
  • Patrocinador
  • Patrocinador
  • Patrocinador
  • Patrocinador
  • Patrocinador

    • Cerca

  • Calendari

    Novembre 2009
    M T W T F S S
    «Octubre
    1
    2 3 4 5 6 7 8
    9 10 11 12 13 14 15
    16 17 18 19 20 21 22
    23 24 25 26 27 28 29
    30
    • Pàgines

      • Inici
      • Sobre
      • Articles
      • Contacti'ns
    • Categories

    • CSS (20)
    • Disseny / inspiració (51)
    • Regals (35)
    • Disseny Gràfic (10)
    • Photoshop (17)
    • Recursos (33)
    • Seo (1)
    • Eines (9)
    • Tutorials (31)
    • Tipografia (4)
    • Desenvolupament Web (5)
    • Wordpress (6)
    • Arxius

    • Novembre 2009
    • Octubre 2009
    • Setembre 2009
    • Agost 2009
    • Juliol 2009
    • Juny 2009
    • Maig 2009
    • Recent Posts

    • Css
    • Disseny / Inspiració
    • Regals
    • Disseny Gràfic
    • Photoshop
    • Llocs Popular

    • Com crear una bona manera sense mirar la taula
    • Com crear Niça escalable CSS Basat Breadcrumbs
    • 30 Pàgines web amb la màxima d'Orange
    • Com crear tipografia Tipografia en Photoshop
    • 5 Passos a escriure millor Css
    • Crear una icona caixa preciosa en Photoshop
    • 6 Awesome eines d'edició de fotografies en línia
    • Núvol d'etiquetes

    CSS Disseny Fonts gratuïts Disseny Gràfic Disseny gràfic icones Inspiració Inspitation Photoshop Recursos Eines Tutorials Tipografia desenvolupament web Wordpress

    • Amics

      • Abduzeedo
      • A part ALIST
      • BittBox
      • CrazyLeaf Disseny
      • Css Tricks
      • David Walsh
      • Fudgegraphics
      • Alimenti la seva creativitat
      • Ajuda per a desenvolupadors
      • Instant Shift
      • Line25
      • Mirificampress
      • El meu bloc de tinta
      • Noupe
      • PSDFan
      • PSDTUTS
      • Compartir Brain
      • Sis revisions
      • Spoon Graphics
      • Toxel
      • Vandelay Design
      • Funcionem
      • Web Designer Depot
      • Dissenyador Web Ledger
      • Web Designer Wall
      • You The Designer
    • Traductor

      English flagItalian flagKorean flagChinese (Simplified) flagChinese (Traditional) flagPortuguese flagGerman flagFrench flagSpanish flagJapanese flagArabic flagRussian flagGreek flagDutch flagBulgarian flagCzech flagCroat flagDanish flagFinnish flagHindi flagPolish flagRumanian flagSwedish flagNorwegian flagCatalan flagFilipino flagHebrew flagIndonesian flagLatvian flagLithuanian flagSerbian flagSlovak flagSlovenian flagUkrainian flagVietnamese flagAlbanian flagEstonian flagGalician flagMaltese flagThai flagTurkish flagHungarian flag
  • PATROCINADORS

    Hora de sortida UPrinting a YouTheDesigner.


    Targetes en Línia

    Web Design Blog Directory

.
Untitled Document
Tornar al principi

General

Aquestes potser d'algun interès
  • Sobre La nostra empresa
  • Testimonis
  • Dades de contacte
  • Bloc
  • Socials - Twitter, Flickr

Obres

Exemples de projectes anteriors
  • Sobre La nostra empresa
  • Testimonis
  • Dades de contacte
  • Bloc
  • Socials - Twitter, Flickr

Serveis

Això és el que la venda d'avui
  • Sobre La nostra empresa
  • Testimonis
  • Dades de contacte
  • Bloc
  • Socials - Twitter, Flickr

Dades de contacte

Volen contractar a nosaltres? Comenci aquí ...
  • Avaluació Projecte Lliure
  • Email - info@aceinfowayindia.com
  • Tel: 91 11 9810018780

Copyright © 2009, Tots els drets reservats, Ace Infoway Índia Lloguer Ace Infoway l'Índia per al seu projecte de disseny que ve. Veure la nostra cartera.