I modelli a blocchi cambieranno tutto

Pubblicato: 2020-03-24
Screenshot di un gruppo di blocchi di vendita di libri.
Sezione di vendita di libri da un tema personalizzato.

Era circa un anno fa. Stavo felicemente disegnando un tema per aspiranti romanzieri. Volevo anticipare la concorrenza e commercializzare un tema specifico per gli scrittori che avrebbero tentato la sfida del National Novel Writing Month 2019.

NaNoWriMo, in breve, è un vortice di un mese in cui migliaia di persone da tutto il mondo si muovono rumorosamente sulle loro tastiere per scrivere un romanzo manoscritto di 50.000 parole. Un mese di pura forza di volontà, caffè a gallone e notti insonni in cambio di gloria. Non ci sono gran premi o contratti editoriali garantiti alla fine del viaggio. Ottieni un certificato, alcuni coupon e il diritto di vantarti. Ho completato la sfida nel 2018.

Ispirato dalla mia vittoria di pochi mesi prima, ho costruito un tema per coloro che avrebbero intrapreso il viaggio l'anno successivo. Volevo anche ampliare il suo fascino a chiunque potesse essere un aspirante romanziere ma non necessariamente partecipare alla sfida. O forse anche a qualcuno che ha appena pubblicato il suo primo libro. Forse questa sarebbe un'opportunità per portare alcuni nuovi utenti di WordPress nella nostra comunità.

Ho delineato un layout della home page per mostrare come gli utenti possono presentare il loro ultimo libro con un pulsante di acquisto. Poi, mi è venuto in mente.

Come potrebbe qualcuno creare questa pagina di vendita di libri senza una solida esperienza con l'editor di blocchi?

Ho usato il plugin Gutenberg per mesi e mesi prima che arrivasse su WordPress 5.0. Conoscevo i dettagli del sistema.

Il design era semplice. Usando il supporto principale e il blocco di testo, un'intestazione, un paio di paragrafi e un pulsante, avevo creato qualcosa che potrebbe essere stato troppo complesso per l'utente medio. Non ero nemmeno entrato nelle opzioni personalizzate di colore, dimensione del carattere e stile blocco che accentuavano il layout.

Questa semplice combinazione di blocchi aveva il potenziale per essere eccessivamente complicata per alcuni. Avevo altri piani per layout più complessi. Altri autori di temi avevano assunto combinazioni più grandi di blocchi. Per gli utenti finali, probabilmente stavano entrando in un mondo che non aveva senso. Vedrebbero bellissime demo di temi e si sentirebbero frustrati quando non riuscivano a far funzionare le cose. L'editor di blocchi non era, e non è ancora, abbastanza intuitivo per consentire agli utenti meno esperti di creare layout oltre le basi.

Ho optato per un tutorial passo dopo passo per guidare i miei utenti nella creazione di questa semplice sezione di vendita di libri. Tuttavia, la documentazione non è sempre la risposta migliore. Anche quando gli utenti lo trovano e lo leggono, i risultati non sono sempre accurati. Sarebbe stato molto più semplice avere un pulsante che, una volta cliccato, inserisse questa sezione direttamente nell'editor. L'utente può quindi personalizzarlo per adattarlo al proprio contenuto.

È qui che entrano in gioco i modelli di blocco.

Gli autori di temi dovrebbero essere in grado di creare combinazioni uniche e complesse di blocchi con stili personalizzati. Gli utenti dovrebbero essere in grado di farlo sembrare come la demo .

Da quando ho "costruito" (uso questo termine in modo approssimativo) il mio primo tema WordPress nel 2005, ho visto o tentato ogni tipo di soluzione a questo problema. Modelli di pagina. Opzioni del tema. codici brevi. Widget. Lo chiami. Sono stati tutti provati prima. Ciascun metodo ha fornito grossi ostacoli agli utenti. Alcuni ( ehm, shortcode ) hanno lasciato il contenuto degli utenti nel caos e hanno creato un effetto di blocco in cui sono finiti legati al loro tema.

È passato molto tempo per qualcosa di nuovo.

Cosa sono i pattern a blocchi e in che modo miglioreranno l'esperienza utente?

Screenshot di un modello di blocco della colonna dei prezzi.
Sezione colonne prezzi personalizzati.

Cosa succede quando un utente vuole creare un layout con più colonne di opzioni di prezzo come mostrato nello screenshot sopra? Buona fortuna. La maggior parte non potrebbe produrlo con il sistema a blocchi. Anche senza schemi di blocco, il tema avrebbe bisogno di alcuni stili di blocco personalizzati per renderlo possibile. I plugin probabilmente colmeranno il vuoto per un output così complesso e hanno affrontato le tabelle dei prezzi in vari modi nel corso degli anni. E se potessimo produrre layout come questo all'interno di temi o in plugin molto più semplici?

È possibile con schemi a blocchi.

In parole povere, uno schema a blocchi è un gruppo di blocchi. Core WordPress, temi e plug-in saranno in grado di registrare modelli con impostazioni predefinite allegate.

Dal punto di vista dell'utente medio, i modelli di blocco sono sezioni predefinite che possono utilizzare per creare layout. Questi layout possono essere qualcosa di semplice come la sezione del libro precedente in questo articolo alle colonne dei prezzi più complesse. Con questi modelli disponibili, gli utenti saranno in grado di creare layout complessi con un semplice clic.

Il sistema a blocchi ha gettato le basi per un futuro molto diverso e compatibile con il futuro rispetto a quello che abbiamo vissuto nel corso degli anni. Alla fine della giornata, la maggior parte dei blocchi sono solo un semplice vecchio HTML. I modelli di blocco non saranno altro che la registrazione di un gruppo di questi blocchi. Quando un utente cambia tema, il suo contenuto rimane intatto, anche quando il nuovo tema non registra gli stessi schemi.

La versione 7.7 del plugin Gutenberg ha fornito la prima iterazione di un'interfaccia per i pattern. È di base e subirà molte altre iterazioni prima di essere pronto per l'uso in produzione. Alla fine, ci sarà un'interfaccia completamente integrata per la selezione da più modelli. L'utente vede qualcosa che desidera utilizzare. Fanno clic su quel modello. Viene inserito nel post.

Niente più opzioni di temi complicate. Niente più zuppa di codici brevi. Niente più ore di frustrazione per chiederti perché non puoi creare quella prima pagina personalizzata mostrata in quella demo del tema accuratamente realizzata.

Potrei essere un po' ottimista. I modelli di blocco richiederanno un enorme consenso da parte della comunità degli sviluppatori di temi e plugin. Sebbene il core di WordPress fornisca diversi modelli popolari per impostazione predefinita, non copriranno in alcun modo l'ampiezza del design che è possibile quando gli autori di temi mettono al lavoro le loro capacità artistiche.

Sono sempre stato entusiasta dell'editor di blocchi. Tuttavia, mi è sempre sembrato di essere più entusiasta del potenziale che del prodotto finale. Ero in uno stato costante di attesa che diventasse ciò che pensavo potesse essere. Sì, sto ancora aspettando. Tuttavia, armeggiare con una prima versione del sistema di pattern sembra che stiamo arrivando al punto in cui possiamo fare quelle cose fantastiche che l'editor avrebbe dovuto permetterci di realizzare. È stata una lunga attesa e abbiamo ancora un po' da fare. Ma ho una rinnovata passione per il progetto dopo aver sperimentato il lavoro che è stato fatto finora.