¿Es Smart Slider 3 el mejor plugin de deslizamiento de WordPress?

Raramente escribo reseñas de plugins, y yo nunca escribo sobre sliders. Pero hoy estoy haciendo una excepción con Smart Slider 3.

No sólo es el mejor plugin deslizante disponible, sino que también es un ejemplo para todos los fabricantes de plugins gratuitos y de primera calidad de cómo se debe hacer un plugin.

Así que vamos a ver por qué creo que Smart Slider 3 es fantástico.

Nota: Esta no es una revisión pagada. Me gustó tanto el plugin que quise compartir el porqué con usted. Hay una versión gratuita de Smart Slider disponible, que ofrece más funciones que la mayoría de los plugins premium, así que si sólo estás interesado en la versión gratuita sigue leyendo – te lo haré saber cuando llegue a las funciones de pago.

¡Este artículo es 100% libre de afiliados!

Nunca aceptaremos dinero para promocionar a otros, todo lo que lees es genuino. Aprende más.

¿Qué es Smart Slider 3?

Smart Slider 3 es un plugin que puedes usar para crear deslizadores y colocarlos en cualquier lugar de tu sitio web. Puedes armar todo lo que quieras con su poderosa interfaz de construcción, animaciones afinadas entre las diapositivas y -con la versión pro- crear animaciones de elementos de capas para hacer que las cosas se muevan dentro de los deslizadores.

He visto plugins que pueden hacer esto antes, pero no como este. Smart Slider se ve y se siente como Sketch 3. Cuando empecé a usar Sketch en lugar de Photoshop, mi sensación era: “¡¿Por qué no se ha hecho esto antes?!” Smart Slider trae la interfaz y la facilidad de uso de Sketch (capas, inspector de propiedades, vistas previas) a la creación del deslizador.

La interfaz de edición de diapositivas

Un poco sobre los deslizadores

Antes de que profundicemos en el plugin, tengo que sentar las bases: Odio los deslizadores.

Los odio de la misma manera que algunos odian las fotos de bebés, de comida o de ventas: No hay nada malo en tomar estas fotos, pero el constante ataque de ellas puede ser abrumador.

Se ha investigado mucho sobre los deslizadores y cómo son perjudiciales para las conversiones y el SEO. Creo que el mayor problema es que casi todos los temas premium tienen un deslizador en la primera página. Es un gran atractivo para la vista, así que cuando alguien compra un tema comienza a usarlo sin pensar, lo cual es un problema porque sólo hay una cosa peor que un deslizador innecesario, y es un deslizador mal hecho.

Creo que los deslizadores de baja calidad contribuyen en gran medida a las bajas conversiones. He notado en mi propio comportamiento de navegación que he permanecido más tiempo en un sitio web para ver el contenido de un deslizador visualmente llamativo.

Leer
Una guía reflexiva para elegir los temas y plugins perfectos para tu sitio de WordPress

Al final, tengo que admitir que creo que los deslizadores tienen su lugar. Si los usas inteligentemente (sin ánimo de hacer un juego de palabras) pueden ser un activo valioso para tu sitio. Sin embargo, si los usas mal, bajarán tus conversiones y te perjudicarán el SEO – al igual que cualquier otro elemento de tu página.

Además, Smart Slider te permite crear visuales que no son diapositivas Puedes crear un solo deslizador de diapositivas con animaciones, lo que te permite crear elementos que parecen imágenes estáticas con pequeñas y sutiles animaciones para captar la atención del visitante.

Un poco sobre los Plugins Premium

Ahora que he descargado la mayor parte de mi ira en los deslizadores, déjame liberar las sobras en los plugins premium.

He notado que muchos de los plugins premium disponibles simplemente no son buenos – no cuando se tiene en cuenta que la gente está haciendo dinero con ellos. Esto es especialmente cierto para un plugin que aborda conceptos de UI extremadamente difíciles como los deslizadores.

Los autores de los plugins aparentemente tienden a no preocuparse por la experiencia del usuario y todo lo que quieren es un dinero rápido. Cuando compras una aplicación premium como Evernote o Sketch, esperas que la interfaz y las características adicionales (como el sistema de ayuda, la gestión de configuraciones, etc.) estén tan pulidas como el resto del producto – esperas calidad.

Smart Slider también cumple con esto. Desde el video de introducción inicial al sitio web, su icono, sus plantillas, el sistema de ayuda y la interfaz de usuario general, se puede ver que alguien se sentó y pensó en todo y aplicó la saliva y el pulido necesarios para hacer un producto adecuado, a diferencia de algo que parece que su vecino lo armó ayer.

Creando un deslizador

Inicialmente, se le saludará con sus deslizadores a la izquierda y con recursos útiles a la derecha. Esta pantalla ya muestra la atención a los detalles que me gustan de este plugin. Puedes ordenar los controles deslizantes por nombre o por fecha de creación. También puedes elegir un montón de pequeñas acciones útiles a la derecha, pero la acción principal es mucho más grande y se nota más con un diseño agradable.

Fíjate en que todos los botones de acción que usas para añadir un deslizador son verdes, los botones de acción de importancia secundaria son azules y el resto son grises. Muy intuitivo.

La vista inicial

Añadiendo un deslizador de muestra

Si tienes la versión gratuita tendrás acceso a cuatro deslizadores gratuitos. Si tienes la versión pro, tendrás acceso a una biblioteca de más de 100 deslizadores pre-construidos, que pueden darte un gran punto de partida.

Algunos deslizadores de muestra

Sliders From Scratch

Si quieres empezar un nuevo proyecto, empieza por seleccionar una plantilla. Los usuarios gratuitos tienen acceso a cuatro, mientras que los usuarios profesionales tienen 11 a su disposición.

Crear un deslizador

Una vez creado, puedes empezar a configurar las opciones generales y añadir diapositivas. Es probable que quieras jugar con los ajustes generales inicialmente y luego modificarlos según sea necesario una vez que hayas creado algunos controles deslizantes.

Opciones de deslizamiento

Dos secciones con pestañas le dan acceso a una gran cantidad de opciones. La primera sección establece los ajustes reales, la segunda sección se centra en los visuales.

La primera sección permite cambiar la configuración general, el tamaño, la reproducción automática, la animación de capas, la optimización, la configuración avanzada y otras configuraciones.

Leer
¿Qué tan rápido actualizas WordPress?

Ajustes generales del Smart Slider

La segunda sección le da control sobre los elementos de la interfaz de usuario creados por el deslizador. Flechas, balas, controles de reproducción automática, miniaturas, sombras y más.

Ajustes visuales del Smart Slider

Configuración de la diapositiva

La mayor parte de tu tiempo lo pasarás en el editor de diapositivas montando tu diapositiva. Mientras que Smart Slider es sensible, la interfaz es mejor en altas resoluciones. Sus capas serán listadas a la izquierda.

Pase el cursor por encima de cualquier capa para verla resaltada en el área de vista previa. Haz clic en una capa para que aparezcan sus detalles en el panel de abajo, donde podrás modificar los detalles del elemento, las animaciones (para usuarios profesionales) y la configuración de la capa.

Puedes usar el editor visual para reposicionar la capa arrastrándola y soltándola. Por supuesto, puedes conseguir el mismo resultado usando las opciones de posicionamiento de la pestaña de capas. Otro pequeño detalle: Deshacer con cmd + z funciona muy bien – un buen toque.

Para añadir un nuevo elemento, sólo tienes que hacer clic en los botones de la parte superior. Los usuarios libres pueden elegir entre seis elementos: Imagen, encabezado, texto, botón, Vimeo y Youtube. Los usuarios profesionales tienen nueve elementos adicionales para elegir: Lista, icono, título, transición, iframe, vídeo, HTML y área.

El editor de diapositivas

Al hacer clic en un elemento, se añadirá a la lista de capas y a la vista previa. Empieza a editar inmediatamente y verás todo en tiempo real en la vista previa. Cada elemento tiene un montón de opciones adicionales que puedes ajustar a tu gusto. Esta es otra área en la que brilla el Smart Slider. Echa un vistazo a la configuración de la fuente de un elemento:

Configuración de la fuente

No sólo puedes establecer colores, alturas de línea, espaciado y otros elementos, sino que puedes previsualizarlo ahí mismo, añadir CSS extra y elegir entre los preajustes de la derecha. Incluso puedes guardar tus configuraciones como un nuevo preajuste, lo que minimizará el tiempo que necesitas dedicar a tus elementos si tienes un montón de similares.

En la parte superior de la vista previa se encuentran los ajustes de la propia diapositiva. Se puede establecer un nombre, una descripción y un enlace, además del fondo, la animación y otras opciones.

El área de vista previa en sí tiene algunos controles prácticos. Puedes activar o desactivar el snapping, mostrar un fondo oscuro, establecer alineaciones, ocultar capas y más. Aún más útiles son los controles para ver tu diapositiva en la vista de escritorio, tableta y móvil. Por cierto, haz clic con el botón derecho del ratón en cualquier elemento de la vista previa para eliminar/copiar/duplicar la capa.

Capas de animación

La versión profesional te da opciones avanzadas de animación para que tus capas se muevan. El resultado se muestra mejor en uno de los deslizadores de la página de inicio de Smart Slider.

Animaciones de Smart Slider

Al crear animaciones puedes establecer animaciones in/out/loop y manejar eventos como hacer clic, entrar con el ratón, salir con el ratón, jugar y más. Puedes colocar tus animaciones en una línea de tiempo que permita arrastrar y soltar.

Esto esencialmente convierte a Smart Slider en algo similar a un editor de video. El proceso es esencialmente el mismo, colocas los eventos en una línea de tiempo que te dice cuándo empieza un evento, cuánto tiempo tarda y cuándo termina.

Leer
La guía definitiva para la elección de un marco temático de WordPress (más reseñas detalladas)

La animación de las capas es un proceso complejo, pero la interfaz de usuario de Smart Sliders hace que sea un proceso suave y agradable.

Línea de tiempo de la animación

Una vez hecho, cada deslizador puede ser insertado a través de un atajo, usando el icono del deslizador inteligente en el editor del post o usando el código PHP. Verás todo lo que necesitas para usar esto sobre las opciones generales del deslizador.

Por qué el deslizador inteligente es tan genial

Smart Slider está ahora en mis tres plugins favoritos. Es una gran decisión, pero es el mejor ejemplo de cómo debe ser un plugin de primera calidad.

Tiene una interfaz de usuario que obviamente ha sido dividida, probada e informada por la entrada del usuario. Elementos como casillas de verificación, botones de radio, selectores y otros campos no parecen fuera de lugar; toda la experiencia es fluida y unificada.

El proceso de activación pro es extremadamente simple. Ni siquiera necesitas ir a una página especial de activación. La primera vez que me topé con la necesidad de activación fue cuando quise importar un deslizador de prueba. Tengo una pequeña ventana que me dice qué es qué con un campo de texto justo ahí. Pegué el código, presioné “OK” y se activó y me llevó a los controles deslizantes de prueba.

Otro aspecto asombroso del plugin es lo rápido que es su JavaScript. Al decir eso, crear JavaScript que te permite manejar todo, desde la creación del deslizador hasta la animación, mostrarlo y previsualizarlo en vivo es complejo es una burda subestimación. Asegurarse de que las interacciones del usuario en la administración y la visualización de diapositivas en el front-end es nada menos que un milagro.

Envolviendo

Smart Slider es lo que quiero que sean todos los plugins, y lo que creo que todos los plugins deberían aspirar a ser. ¿Estarías de acuerdo con que la aplicación Airbnb o Evernote fuera inferior sólo porque fuera gratis? Sé que no lo estaría. Parece que, finalmente, el desarrollo de plugins de WordPress está alcanzando la calidad que las aplicaciones de escritorio y móviles nos han mimado.

Si necesitas crear deslizadores o quieres una sola imagen con animaciones sutiles en tu sitio web, Smart Slider 3 te ofrece la solución, sin importar lo que quieras lograr. Puedo recomendar de todo corazón la versión gratuita. Ya proporciona más funcionalidad que cualquier otro plugin de deslizadores, incluso que muchos de los de primera calidad.

Si necesitas la potencia de la versión pro o quieres apoyar el desarrollo de un software asombroso echa un vistazo a la versión pro, no te decepcionarás.

1,6 millones de superhéroes de WordPress leen y confían en nuestro blog. Únete a ellos y recibe entradas diarias en tu bandeja de entrada – ¡gratis!

El bueno

  • Interfaz asombrosa
  • La versión gratuita contiene muchas características
  • Fácil de trabajar con
  • Suave experiencia administrativa

El Malo

  • El retroceso podría funcionar para eliminar elementos
  • Las animaciones de capas tienen una curva de aprendizaje

Veredicto del WPMU DEV

  • El precio:
  • Calidad y amplificación; Usabilidad:
  • La actuación:
  • Belleza y modernidad:
  • En general: Visita el sitio web

1,6 millones de superhéroes de WordPress leen y confían en nuestro blog. Únete a ellos y recibe entradas diarias en tu bandeja de entrada – ¡gratis!

Etiquetas:

  • deslizadores

Deja una respuesta