Diseño Web \ 21 Diciembre 2014

Trucos de Wix: Agrega efectos a tus imágenes y botones

Wix está lleno de funciones de diseño impresionantes y, aunque algunas de ellas son fáciles de usar y de encontrar, hay otras que requieren un poco más de esfuerzo para ser encontradas y usadas. Es por eso que estamos aquí, para centrar la atención en estas sorprendentes funciones que pueden haber pasado desapercibidas, hasta ahora.

¿Por qué utilizar esta función? Añadir efectos interactivos a tu página web hará de esta un lugar mas ameno y simpático. Lograrás que tus visitantes quieran pasar el mouse por sobre todas tus imágenes y botones. Hacer de tu sitio algo interactivo permitirá mantener a la gente en él durante períodos más largos de tiempo. Cuanto más tiempo pasen en él, es más probable que exploren tu sitio, se suscriban a tus listados de emails, o incluso que realicen una compra. Ahora que sabes por qué esta característica es tan fundamental, empecemos a mejorar tu presencia online. ¡Manos a la obra!

Un ejemplo impresionante: www.naomikizhner.com

Es difícil de negar: Naomi ha utilizado esta función a la perfección. Si eres como nosotros, probablemente tendrás que ver todas y cada una de las fotos en su sitio para que te des cuenta de cómo cada imagen “vuelve a la vida” con el color. Ella hizo el efecto aún más extremo mediante el uso de un enfoque minimalista en la combinación de colores y el diseño general de su sitio, usando un montón de escalas de grises y manteniendo la disposición ordenada. ¡Muy buen trabajo!

Cómo hacerlo en tu página web

¡Es tiempo de que te transformes en un experto! Aquí está el paso a paso:

Desde el Editor, haz clic en el icono Agregar > Botones y Menús > Botón de Imagen:


Haz doble clic en el botón de imagen para ir a la configuración:


Elige la visión de imagen por defecto y tu visión de imagen al pasar el mouse . Piensa en ello como un “antes y después” del efecto que viene a destacar tus imágenes.


Esto es lo que verás cuando pases el mouse sobre la imagen:


Y no lo olvides. Como se trata de un botón, debes agregar un link a alguna parte. La gente probablemente estará lista para hacer clic una vez que pasen por allí.


Consejo práctico: Es una gran idea preparar tus imágenes con anterioridad. Para hacer que esta magia suceda, necesitarás dos versiones de tu imagen. Una opción clásica es una versión en blanco y negro y una en color. Estas pueden ser creadas utilizando el increíble editor de imágenes de Wix, ¡sin moverte del Editor!


Hay incluso cosas más divertidas que puedes hacer con esta función

Hay muchas direcciones interesantes que puedes tomar utilizando este efecto. Aquí hay unos cuantos ejemplos más que simplemente, nos encantan.

Utiliza textos emergentes (pop-ups) que aparezcan cuando pases el mouse es otra gran manera de poder interactuar con los visitantes del sitio:


Utiliza una imagen que se mueva o cambie ligeramente  de lugar cuando el mouse pase sobre ella:


Alterna entre imágenes vectoriales, que están muy de moda:


¡Las posibilidades son infinitas, descubre las tuyas y haz de este efecto algo propio!

¿Listo para hacer todo esto en tu propia página web? ¡Crea un sitio web gratuito con Wix!