Mini botón para web en Adobe Photoshop Cs5

Publicado por asktutorial.

Además de impresionantes efectos, asombrosos retoques de fotografías e impactantes diseños de textos, en Adobe Photoshop podemos también crear útiles botones para páginas web. Los botones de las webpages son muy utilizados en los últimos tiempos y es recomendable prestarle especial atención a sus diseños. No nos vale de nada tener una bonita web si los botones donde el usuario debe ingresar no se destacan del resto. Es por ello que en esta oportunidad, veremos paso a paso cómo crear un botón mini para web. Este botón, es recomendable que luego lo utilices como parte de una barra dentro del diseño de tu web. Son de mucha utilidad cuando debes incorporar varios botones y careces de espacio físico para hacerlo.

Pues bien, vamos a trabajar con Adobe Photoshop Cs5 en la tarea de diseñar un mini botón para página web.

PASO 1: Iniciamos Adobe Photoshop Cs5 y creamos un nuevo documento de 100×100 píxeles, a una resolución de 72 dpi. Luego, seleccionamos la herramienta “marco rectangular” de nuestra barra de herramientas. En “estilo” elegiremos la opción “tamaño fijo” y en los espacios para colocar los valores, ponemos 55 px y 15 px respectivamente. Hacemos un click sobre el área de trabajo y se habrá creado el rectángulo de selección.

Mini botón para web en Adobe Photoshop Cs5

PASO 2: Vamos a Edición>Rellenar y elegimos un color para el relleno. Presionamos Ctrl+D para perder la selección que hemos creado.

PASO 3: Hacemos doble click sobre la capa para poder ingresar a los estilos de capa. Activamos la opción “Bisel y relieve” y colocamos los valores como en la imagen siguiente.

Mini botón para web en Adobe Photoshop Cs5

PASO 4: Ahora, activamos la opción “Trazo” en el mismo panel de Estilos de Capa. Colocamos un valor de 1 px y seleccionamos el color que nos guste para el contorno de nuestro botón.

PASO 5: Elegimos una tipografía y con la herramienta de texto generamos uno sobre el botón. Al layer del texto también puedes agregarle un bisel y relieve ingresando a las opciones de Estilos de capa de Adobe Photoshop Cs5.

Mini botón para web en Adobe Photoshop Cs5

Tenemos como resultados un mini botón para web que hemos creado en Adobe Photoshop Cs5. Ahora, puedes incorporarlo a un panel con varios botones similares y luego agregarlo al diseño de tu página web.

1 Respuestas »

Dejar un comentario

Tenga en cuenta: la moderación de comentarios está habilitada y puede retrasar su comentario. No hay necesidad de volver a enviar su comentario.

¡SUSCRÍBETE GRATIS!

Nosotros

AskTutorial nace en Junio del 2010 en la ciudad de Chicago, IL con el fin de crear Tutoriales Educativos en Español dirigidos a la comunidad de habla hispana en Estados Unidos y alrededor del mundo. Gracias a la excelente respuesta del publico que diariamente ve nuestros videos nos hemos extendido a no solo crear video tutoriales, si no tambien ofrecemos información relevante de acuerdo a sus preguntas.

Archivos / Mes

Contenido Bloqueado Solo Para Seguidores

Para ver el contenido solo sígueme en cualquiera de estas redes sociales. ¡Muchas gracias por todo!