Los patrones de bloques lo cambiarán todo

Publicado: 2020-03-24
Captura de pantalla de un grupo de bloques de venta de libros.
Sección de venta de libros a partir de un tema personalizado.

Fue hace aproximadamente un año. Estaba felizmente diseñando un tema para aspirantes a novelistas. Quería adelantarme a la competencia y comercializar un tema específicamente para escritores que intentarían el desafío del Mes Nacional de Escritura de Novelas 2019.

NaNoWriMo, para abreviar, es un torbellino de un mes en el que miles de personas de todo el mundo golpean sus teclados para escribir un manuscrito de novela de 50,000 palabras. Un mes de pura voluntad, café a raudales y noches de desvelo a cambio de gloria. No hay grandes premios ni contratos de publicación garantizados al final del viaje. Obtiene un certificado, algunos cupones y derechos de fanfarronear. Completé el desafío en 2018.

Inspirándome en mi victoria unos meses antes, construí un tema para aquellos que harían el viaje el año siguiente. También quería ampliar su atractivo para cualquiera que pudiera ser un aspirante a novelista pero que no necesariamente participara en el desafío. O tal vez incluso a alguien que acaba de publicar su primer libro. Quizás esta sea una oportunidad para traer algunos nuevos usuarios de WordPress a nuestra comunidad.

Esbocé un diseño de página de inicio para mostrar cómo los usuarios podían presentar su último libro con un botón de compra. Entonces, me di cuenta.

¿Cómo podría alguien construir esta página de ventas de libros sin una sólida experiencia con el editor de bloques?

Había estado usando el complemento de Gutenberg durante meses y meses antes de que aterrizara en WordPress 5.0. Conocía los entresijos del sistema.

El diseño era sencillo. Usando el bloque principal de medios y texto, un encabezado, un par de párrafos y un botón, creé algo que puede haber sido demasiado complejo para el usuario promedio. Ni siquiera me había metido en las opciones personalizadas de color, tamaño de fuente y estilo de bloque que acentuaban el diseño.

Esta simple combinación de bloques tenía el potencial de ser demasiado complicada para algunos. Tenía otros planes para diseños más complejos. Otros autores de temas habían asumido combinaciones de bloques más grandes. Para los usuarios finales, probablemente estaban ingresando a un mundo que no tenía sentido. Verían hermosas demostraciones de temas y se frustrarían cuando no pudieran hacer que las cosas funcionaran. El editor de bloques no era, y todavía no es, lo suficientemente intuitivo para que los usuarios con menos conocimientos construyan diseños más allá de lo básico.

Opté por un tutorial paso a paso para guiar a mis usuarios en la creación de esta sencilla sección de venta de libros. Sin embargo, la documentación no siempre es la mejor respuesta. Incluso cuando los usuarios lo encuentran y lo leen, los resultados no siempre son precisos. Habría sido mucho más sencillo tener un botón que, al hacer clic, insertara esta sección directamente en el editor. El usuario podría personalizarlo para que se ajuste a su contenido.

Ahí es donde entran los patrones de bloques.

Los autores de temas deberían poder crear combinaciones únicas y complejas de bloques con estilos personalizados. Los usuarios deberían poder hacer que se vea como la demostración .

Desde que “construí” (uso este término vagamente) mi primer tema de WordPress en 2005, he visto o intentado todo tipo de solución a este problema. Plantillas de página. Opciones de tema. Códigos cortos. Widgets. Tu dilo. Todos han sido probados antes. Cada método presentó grandes obstáculos para los usuarios. Algunos ( ejem, códigos abreviados ) dejaron el contenido de los usuarios en ruinas y crearon un efecto de bloqueo en el que terminaron atados a su tema.

Ya es hora de algo nuevo.

¿Qué son los patrones de bloques y cómo mejorarán la experiencia del usuario?

Captura de pantalla de un patrón de bloque de columna de precios.
Sección de columnas de precios personalizadas.

¿Qué sucede cuando un usuario desea crear un diseño con varias columnas de opciones de precios como se muestra en la captura de pantalla anterior? Buena suerte. La mayoría no podría producirlo con el sistema de bloques. Incluso sin patrones de bloques, el tema necesitaría algunos estilos de bloques personalizados para hacerlo posible. Es probable que los complementos llenen el vacío para una salida tan compleja y han estado abordando las tablas de precios de varias maneras a lo largo de los años. ¿Qué pasaría si pudiéramos producir diseños como este dentro de temas o en complementos mucho más simples?

Es posible con patrones de bloques.

En pocas palabras, un patrón de bloques es un grupo de bloques. El núcleo de WordPress, los temas y los complementos podrán registrar patrones con configuraciones predefinidas adjuntas.

Desde el punto de vista del usuario promedio, los patrones de bloques son secciones predefinidas que pueden usar para crear diseños. Estos diseños pueden ser algo tan simple como la sección del libro anterior en este artículo hasta las columnas de precios más complejas. Con estos patrones disponibles, los usuarios podrán crear diseños complejos con solo hacer clic en un botón.

El sistema de bloques sentó las bases para un futuro muy diferente y compatible con el futuro de lo que hemos experimentado a lo largo de los años. Al final del día, la mayoría de los bloques son simplemente HTML antiguo. Los patrones de bloques no serán más que el registro de un grupo de estos bloques. Cuando un usuario cambia de tema, su contenido permanece intacto, incluso cuando su nuevo tema no registra los mismos patrones.

La versión 7.7 del complemento Gutenberg envió la primera iteración de una interfaz para patrones. Es básico y se someterá a varias iteraciones más antes de que esté listo para su uso en producción. Eventualmente, habrá una interfaz completamente integrada para seleccionar entre múltiples patrones. El usuario ve algo que quiere usar. Hacen clic en ese patrón. Se inserta en la publicación.

No más opciones de temas complicados. No más sopa de shortcode. No más horas de frustración preguntándose por qué no puede crear esa página principal personalizada que se muestra en esa demostración de tema cuidadosamente diseñada.

Puedo ser un poco optimista. Los patrones de bloques requerirán una participación masiva de la comunidad de desarrolladores de temas y complementos. Si bien el núcleo de WordPress incluirá varios patrones populares de forma predeterminada, de ninguna manera cubrirán la amplitud del diseño que es posible cuando los autores de temas ponen a trabajar sus habilidades artísticas.

Siempre me ha entusiasmado el editor de bloques. Sin embargo, siempre sentí que estaba más entusiasmado con el potencial que con el producto final. Estaba en un estado constante de espera para que se convirtiera en lo que pensé que podría ser. Sí, todavía estoy esperando. Sin embargo, jugar con una versión anterior del sistema de patrones parece que estamos llegando al punto en que podemos hacer esas cosas asombrosas que se suponía que el editor nos permitiría lograr. Ha sido una larga espera, y todavía nos queda un poco por recorrer. Pero tengo una pasión renovada por el proyecto después de experimentar el trabajo que se ha hecho hasta ahora.