Divi 3.0 ya está aquí ¡intuitivo, rápido, invisible, genial!

Te guste o no, la realidad es que el tema Divi se ha convertido en poco tiempo en un auténtico estándar entre los temas WordPress profesionales, y te aseguro que nos por casualidad, sino por sus muchas virtudes.

Y no es que 20% de descuento en el paquete Developer simplemente accediendo desde este enlace haya hecho nada nuevo en realidad, sino que ha tomado la idea de los temas multipropósito y la maquetación visual llevándola a otro nivel, mejorando la experiencia del usuario y, en definitiva, facilitando la creación web para todo tipo de usuarios, y también para los desarrolladores profesionales.

Pero eso ya lo sabías ¿no?

divi 3 react

Las novedades de Divi 3.0

Hoy toca hablar del lanzamiento de Divi 3.0, que acaba de salir a la luz, con una experiencia de maquetación visual totalmente nueva que cambiará para siempre el modo en que creas webs con el constructor Divi, a mejor por supuesto.

El nuevo editor en portada convive con el anterior constructor del editor, y ambas experiencias son totalmente coincidentes e intercambiales, lo que implica que si ya eres usuario de Divi y has adquirido cierto grado de maestría con la interfaz del constructor Divi, podrás dar el salto al nuevo constructor en portada con una curva de aprendizaje nula.

De hecho, lo primero que te llamará la atención es que en la barra de admin cuando ves tu web tendrás un nuevo botón para Habilitar el constructor visual, al lado del de Editar página, y ahí empieza la magia.

habilitar Divi 3 en portada

Por supuesto, siempre puedes seguir usando al interfaz previa e, incluso una vez dentro de la misma sigues teniendo la oportunidad de lanzar el nuevo constructor visual de Divi 3.0.

lanzar constructor visual divi 3

Hay montones de cosas que hacen que sea excitante este nuevo editor visual, pero sobre todo que mientras lo utilizas todos los cambios aparecen al instante en la página. Puedes hacer clic, arrastrar, soltar y editar la página directamente, en vez de utilizar el editor de bloques.

Pero lo que más llama la atención, especialmente si ya has utilizado otros maquetadores en portada, es lo rápido que es el nuevo constructor Divi en portada, además de adaptable.

Olvídate de tener que actualizar la página para ver los cambios, de barras de carga Ajax, lo que tienes es manipulación instantánea gracias a React. De hecho es ReactJS el responsable de hacer que Divi 3.0 disponga del maquetador en portada más rápido del mercado.

En este vídeo tienes, en poco más de 2 minutos, una estupenda introducción de lo que te espera…

La experiencia de la maquetación visual

Cuando lanzas el maquetador visual en portada de Divi ves tu página exactamente como se muestra en tu web y, al contrario que con la versión anterior del constructor Divi, en el que los elementos de la página están representados por bloques, los elementos del maquetador visual en portada se representan por sí mismos, los ves tal cual son.

Puedes hacer clic en cualquier sección, fila o módulo y modificar los ajustes del elemento como lo harías en el constructor anterior, pero todo con tu página a la vista.

Cuando estás en el maquetador visual en portada se mejora enormemente la experiencia de edición, especialmente al acceder a los ajustes, infinitamente más intuitivo que en la versión anterior.

Pero lo mejor es que cuando haces un cambio se muestra al instante, pero al instante de verdad. Toda la maquetación la haces en tu navegador, por lo que no hay que hacer llamadas Ajax para cargar elementos o actualizar el diseño, y al utilizar React, la actualización del DOM es tremendamente eficiente.

Vamos, que crear una nueva página es muy muy rápido.

Uno de los conceptos vitales de la nueva experiencia de maquetación visual es que es una interfaz de usuario invisible. Lo que tienes es una experiencia de maquetación totalmente natural, sin ninguna interfaz de usuario que se interponga delante de la visión natural de tu página.

divi 3 3

Por ejemplo, si haces clic en un texto podrás editarlo directamente sobre la página, en vez de tener que abrirlo en un panel de ajustes.

Si arrastras una fila desde su borde podrás hacerla más grande o pequeña sin tener que activar ningún “ancho personalizado” en los ajustes de la fila y luego tener que poner unidades de tamaño o lo que sea. Todo es más natural.

El nuevo editor integrado en portada

Este nuevo editor integrado en portada es un modo totalmente novedoso, pero sobre todo natural e instantáneo, de editar textos de manera totalmente visual.

Olvídate de buscar módulos de texto, abrirlos uno a uno hasta encontrar el que contiene lo que buscas, desplazarte hasta la caja de texto, modificar tus textos, previsualizar los cambios, guardar y actualizar de nuevo.

¿No sería mejor que cuando estás viendo la página simplemente haces clic en el texto que quieres modificar y lo editas a tu gusto, viendo los cambios al instante, directamente como se verán?

Pues eso es lo que tienes con el nuevo editor visual en portada de Divi 3.0, quizás una de las experiencias más satisfactorias, útiles y prácticas de esta nueva versión de Divi.

Las capturas anteriores están bien, como muestra de todo lo que puedes utilizar, pero como mejor se ve es en acción, aquí lo tienes:

editor divi 3 2

¿O prefieres otro vídeo? Empieza a babear…

La interfaz invisible y personalizable

Divi 3.0 introduce un nuevo concepto de interfaz de maquetación visual que te permite modificar tus páginas en portada, pero lo que hace realmente especial de esta nueva interfaz, creada con React y Flux, es su cualidad de ser invisible y totalmente personalizable.

La tecnología que utiliza Divi 3.0 es la misma que el equipo de WordPress.com utilizó para Calypso, y ha permitido crear un maquetador tremendamente rápido, sin tiempos de carga o espera.

Cuando haces clic en un módulo o sus ajustes para modificar o configurar su contenido o diseño se abre al instante delante de tus ojos.

Puedes hacer clic en un párrafo y empezar a escribir directamente texto en tu página, o seleccionar texto y aplicarle formatos. No necesitas previsualizar cambios porque los estás viendo en directo, todo pasa delante de tus ojos, en tiempo real.

divi 3 guardando

Lo que hace que Divi 3.0 sea realmente especial no es solo la velocidad y naturaleza visual del maquetador, sino la simplicidad y lo intuitivo de su interfaz, por eso le han llamado “interfaz invisible“, ya que se basa en la filosofía de diseño de que “el mejor diseño es el que no se ve“.

interfaz personalizable divi 3

Es más, una buena interfaz no debe seguirte, debe predecir tus intenciones y ofrecerte las herramientas que necesites, cuando las necesites. Eso es lo que solemos definir como “intuitivo”, algo que escuchamos a menudo pero que no experimentamos con tanta frecuencia.

Con Divi 3.0 es lo que tenemos, de verdad.

Cuando activas el nuevo maquetador ni siquiera te das cuenta de que está ahí. A medida que exploras la página es cuando van apareciendo los controles, sin abarrotar ni estorbar en el diseño de tu página.

Pero además, también puedes personalizar la interfaz para que se ajuste a tu pantalla, a tu contenido y así adaptarse a tus preferencias particulares. Es una experiencia de diseño sin igual.

¿Lo vemos? Ponte algo de música y dale al reproductor…

Deshacer, rehacer, copiar, pegar, historial de revisiones, pero mejor

guardar deshacer historial divi 3

Divi hace tiempo que ofrece deshacer acciones, rehacerlas, e incluso un historial de revisiones, pero con el nuevo maquetador visual en portada la experiencia va aún más allá.

No es solo que funcione, que ya lo hacía, sino que estas funcionalidades son uno de los mejores ejemplos de lo rápida, intuitiva y eficaz que es la nueva interfaz invisible, y la tecnología que la hace posible.

Además, deshacer o rehacer en el nuevo maquetador visual en portada es especialmente útil para comparar modificaciones recientes y ver las diferencias en tiempo real.

Siempre ha sido una de mis herramientas favoritas de Divi, de las que lo distinguen del resto de maquetadores visuales, pero es que con el nuevo maquetador es una auténtica gozada, dan ganas hasta de jugar con él, y sino mira como funciona en este otro vídeo.

¿Conclusión?

En realidad no hay ninguna conclusión, máxime cuando acaba de salir a la luz Divi 3.0 y nos queda mucho que disfrutar esta nueva experiencia y aprovechar sus ventajas para crear nuevos y mejores diseños, sin tener que imaginar nada ni perder tiempo y cientos de clics, viendo los resultados de nuestras modificaciones en tiempo real.

Son del tipo de herramientas que realmente ayudan a crear mejores webs, pues realmente diseñamos en vivo, pero además ahorran mucho tiempo de desarrollo, consiguiendo mejores resultados en mucho menos tiempo.

El tiempo de Divi 3.0 empieza ahora, y tiene mucho futuro por delante. Divi se ha ganado el cariño de miles de usuarios, y de desarrolladores, pues realmente es una herramienta que ayuda a crear mejores webs para uno mismo o para los clientes, y ahora, con la nueva versión Divi 3.0, ha tenido unas mejoras tan importantes, pero sobre todo relevantes de cara a los resultados y la optimización que seguramente se convierta en poco tiempo en uno de los frameworks más utilizados y exitosos, si no lo es ya.

De momento, el nuevo Divi Framework 3.0 está disponible para Divi y Extra, y dentro de nada también para el constructor Divi, con el que podrás gozar de esta maravilla en cualquier tema que quieras.

Y si ya usas Divi, la nueva versión es totalmente compatible con las versiones anteriores, lo que significa que tus páginas, secciones y módulos seguirán funcionando como antes.

¿Cuanto cuesta Divi 3.0?

Si ya tienes cuenta en Elegant Themes no tienes que pagar nada, la nueva versión está incluida como cualquier otra actualización de todos los temas y plugins de tu cuenta. De hecho ya están listos para actualizar o descargar en tu área de miembro o en el escritorio de tu WordPress.

actualizar a divi 3

Y si aún no eres de Elegant Themes, puedes tenerlo, además de otros 86 preciosos temas para todo tipo de usos, y plugins tan fantásticos como Monarch o Bloom, por suscripciones desde 89€ al año o 249$ de por vida.

Yo utilizo temas de Elegant Themes desde hace años y realmente merecen la pena, son bonitos, están bien programados y son tremendamente eficaces.

Además, por el lanzamiento de Divi 3.0 tienes un 20% de descuento en el paquete Developer simplemente accediendo desde este enlace. con lo que su precio se queda en 70$, e incluye los 86 temas y todos los plugins y sus actualizaciones durante 1 año.

¿Quieres probar Divi 3.0?

Estás de enhorabuena, solo tienes que ir a esta demo y empezar a maquetar directamente en la portada, directamente, sin tener que registrarte ni nada.

AVISO: esta publicación es de hace dos años o más. Si es un código o un plugin podría no funcionar en las últimas versiones de WordPress, y si es una noticia podría estar ya obsoleta. Luego no digas que no te hemos avisado.

Valora este artículo para mejorar la calidad del blog ...

Al hacer una valoración se recoge una cookie con la IP de tu dispositivo

FlojitoNo está malEstá bienMe ha servidoFantástico (13 votos, promedio: 4,31 de 5)
Cargando…

Autor: Fernando Tellado

Fernando Tellado, apasionado de WordPress, profesor, consultor y ponente. Maquero cansino, padre de tres hijos y de una perrita Beagle, Bilbaíno de nacimiento, Español de corazón y ciudadano de donde me quieran. Autor del libro WordPress - La tela de la araña. Mi blog personal es Navegando con red, donde he crecido como escritor en la red y ofrezco mis visiones acerca de la Web 2.0 y la blogosfera.

Comparte esta entrada en
468 ad

Centro de preferencias de privacidad

Cookies imprescindibles

Se usan para saber si ya aceptaste nuestras políticas, si ya estás suscrito a nuestra newsletter, para reconocer el estado de tu sesión si la tuvieses y para servir más rápidos los contenidos.

No se captura IPs ni siquiera para el servicio de Analytics así que tu visita es privada.

JSESSIONID, _cfuid, wpSGCachePypass, mailerlite, gdpr, gawp
mailerlite, _cfuid

Cookies de terceros

Usamos cookies de terceros con servicios, también garantes de tu privacidad, que analizan tus usos de navegación para que podamos mejorar los contenidos, si ya estás suscrito al boletín y los elementos compartidos en redes sociales y el formulario de comentarios.

1P_JAR, APISID, CONSENT, HPSID, NID, SAPISID, SID, SIDCC, SSID, disqus_unique, disqusauth
disqus_unique, disqusauth
1P_JAR, APISID, CONSENT, HPSID, NID, SAPISID, SID, SIDCC, SSID

Pin It on Pinterest

Share This