Ver destacados

Crear botón web profesional personalizado en Photoshop CS6

Tutorial con vídeo que enseña cómo crear botones personalizados para tu web de forma profesional usando Photoshop CS6.
Escrito por
18.2K Visitas  |  Publicado may 31 2017 16:39
Favorito
Compartir
Comparte esta pagina a tus Amigos y Contactos usando las siguientes Redes Sociales


Si conoces Photoshop sabrás que este potente editor permite crear y utilizar un sinfín de efectos, sombreados, colores, trazados… esto se traduce en un gran abanico de posibilidades para poder modificar el contenido de imágenes o capas individuales.

 

Gracias a las posibilidades que nos ofrecen las herramientas dentro de Adobe Photoshop, se incluye la idea de que podamos crear algo nosotros mismos desde cero. Photoshop ya viene con elementos cargados pero podemos personalizarlos o inventarlos. Si tienes una web o similar, el tutorial de hoy puede resultarte de ayuda.

 

En este tutorial veremos dos formas de poder diseñar nuestro propio botón, de forma manual creando un estilo propio, o de forma automática con estilos predefinidos.

 


1. Crear un botón profesional con estilo personalizado en Photoshop


Con este método crearemos un estilo de forma manual con nuestro propio estilo.

 

Paso 1

Lo primero será crear una forma de rectángulo redondeado que se convertirá en nuestro botón. Para ello vamos a la ventana de herramientas y seleccionamos en forma Rectángulo redondeado.

 

 

Paso 2

Dentro de la capa de la forma creada hacemos clic sobre ella y seleccionamos Opciones de fusión.

 

 

Paso 3

Ahora introducimos unos valores similares a los que estás viendo en la imagen. Primero en el efecto de Bisel y relieve.

 

 

Paso 4

Introduce los valores que ves a continuación en Sombra paralela.

 

 

Paso 5

Como ves ya tendríamos nuestro botón creado. Hay que recalcar que el color principal se modifica como en cualquier forma haciendo doble clic sobre la capa.

 

 

Paso 6

Para que se quede guardado nuestro estilo, ve a las Opciones de fusión como en el paso 3 y 4. Ahora selecciona la opción de Estilo nuevo debajo de Ok y Cancelar. Activa las casillas de guardar los efectos, da un nombre y guarda tu nuevo estilo.

 

 

Paso 7

Si ahora vas a pestaña de estilos verás que está tu estilo personalizado para poder aplicar a cualquier forma a partir de ahora.

 

 

 


2. Crear un botón profesional con estilo predefinido en Photoshop


Si no tienes tiempo de crear un estilo de forma manual tranquilo, Photoshop ya incluye estilos predefinidos fácilmente de aplicar sobre nuestras formas.

 

Paso 1

La ventana de Estilos suele aparecer por defecto pero por si no te aparece, ve a Ventana – Estilos y pulsa sobre ello para que se active la ventana.

 

 

Paso 2

Ahora en la ventana de Estilos haz clic sobre el menú de tres rayas que aparece.

 

 

Paso 3

Selecciona la opción de Estilos de Web y después en añadir.

 

 

Paso 4

Ahora tan solo tendrás que seleccionar el estilo que más te guste y aplicarlo a tu forma. Puedes añadir cualquier categoría de las vistas en el paso anterior.

 

 

 

Si te has atascado en algún paso aquí tienes el videotutorial con el que ver cómo diseñar tu botón profesional de forma manual y automática.

 

 

 

 

Los estilos en Photoshop son realmente útiles para aplicar en nuestros diseños ya que nos evita tener que configurarlo cada vez que queremos aplicar un mismo efecto. De esta forma siempre tendremos un estilo guardado personal.

 

Photoshop ofrece cantidad de posibilidades. Aquí te mostramos una colección de tutoriales gratis para que puedas aplicar de manera sencilla y rápida diferentes efectos y retocar de la mejor manera todas tus fotografías.

¿Te ayudó este Tutorial?

Ayuda a mejorar este Tutorial!
¿Quieres ayudarnos a mejorar este tutorial más? Puedes enviar tu Revisión con los cambios que considere útiles. Ya hay 0 usuario que han contribuido en este tutorial al enviar sus Revisiones. ¡Puedes ser el próximo!