¿Cómo hacer rollover botones en Photoshop?

los botones del rollover son las imágenes que se ven cuando se pasa el ratón sobre muchos botones de la página Web. Otros estados de botón pueden tener sus propias imágenes, incluyendo los estados hizo clic y discapacitados. Haciendo botones rollover en Photoshop distingue su programa o página Web desde otros medios de comunicación. También le permite crear botones con formas interactivas que se relacionan con la función de su aplicación. Para un juego que representa dragones, por ejemplo, se podría crear un botón cuya apariencia normal es el ojo cerrado de un dragón, y cuya apariencia vuelco es el ojo de dragón abierto.

Instrucciones

1 Haga clic en el comando "Nuevo" del menú "Archivo", a continuación, haga clic en el elemento "Web" desde el control desplegable "predeterminados".

2 Haga clic en el icono de la paleta de herramientas en forma de rectángulo redondeado para ejecutar la herramienta "Rectángulo redondeado", a continuación, en la muestra de color por encima de la lona. Haga clic en un color que desea para el botón de la paleta que aparece.

3 Haga clic hacia el lado izquierdo del lienzo, a continuación, arrastre hacia la derecha para definir el botón. La divulgación a completar la forma del botón. Haga clic en la opción "Estilos" en el menú "Windows" para mostrar una paleta de estilos de botones predefinidos.

4 Pase el cursor del ratón sobre la galería de iconos de estilo, a continuación, haga clic en uno de los estilos cuyo nombre incluye "normal". Por ejemplo, haga clic en el estilo de "biselado normal". El término "normal" indica que el estilo es para el estado del botón activado, no de vuelco.

5 Haga clic en el icono "T" en la paleta de herramientas para ejecutar la herramienta "Texto", a continuación, arrastre el botón para definir un cuadro de texto. Escriba el texto que desee para el botón en el cuadro de texto, a continuación, haga clic en el icono de marca de verificación situada por encima de la lona para finalizar el texto del cuadro de texto.

6 Haga clic en el comando "Combinar visibles" del menú "Capas" para combinar el texto y efectos en una sola imagen. Haga clic en el comando "Duplicar" del menú "Capa" para duplicar el botón correspondiente al estado de rollover.

7 Utilice las instrucciones del paso 4 al aplicar un estilo de botón para el botón duplicado. Sin embargo, haga clic en un estilo cuyo nombre incluye "por encima del ratón" en lugar de "normal". Por ejemplo, haga clic en el estilo de "biselado por encima del ratón". Este será el aspecto del botón cuando el usuario pasa el ratón sobre ella

8 Utilice las instrucciones del paso 4 al aplicar un estilo de botón para el botón duplicado. Sin embargo, haga clic en un estilo cuyo nombre incluye "MouseDown" en lugar de "normal". Por ejemplo, haga clic en el estilo de "biselado mousedown". Este será el aspecto del botón cuando el ratón está sobre ella y que se ha hecho clic.

9 Haga clic en el menú "Archivo" "Guardar para Web" de comandos, a continuación, haga clic en la pestaña "4-up" para ver cuatro imágenes que muestran diferentes calidades de imagen para el botón seleccionado. Haga clic en una imagen cuya calidad que encuentre aceptable, y cuyo texto debajo de la imagen incluye el tipo de archivo "GIF". Los botones son por lo general en el formato GIF, en gran parte debido a que por lo general requieren poca memoria de disco.

10 Haga clic en "Guardar" para abrir el cuadro de diálogo "Guardar optimizada". Escriba un nombre en el cuadro de texto "Nombre", que indica que la imagen es el botón de imagen cambiante, no la normal. Por ejemplo, escriba "rollover.gif." Haga clic en "Guardar" para guardar el botón de imagen cambiante.

11 Utilice las instrucciones desde el paso 8 para ocultar la capa del botón de imagen cambiante y revelar la capa de los botones normales. Utilice las instrucciones de los pasos 9 y 10 para salvar el botón normal con un nombre como "normal.gif" o "enabled.gif."