LE NOVITÀ ANNUNCIATE DURANTE SHOPIFY UNITE 2021

“Migliorare il commercio per tutti, insieme”

 

Questo lo slogan per l’edizione 2021 della conferenza annuale di Shopify dedicata ai suoi Partner in tutto il mondo, Unite. Lo scorso anno, l’evento fu rivolto in particolare ai merchant, che si trovavano in una situazione mai sperimentata prima e che avevano bisogno di andare online il più velocemente possibile. Quest’anno il focus principale della conferenza sono stati gli sviluppatori, con annunci incentrati su “rivoluzionari cambiamenti all’infrastruttura, agli strumenti e le tecnologie che gli permettono di costruire app, temi e negozi su Shopify”.

Lo stesso CEO della compagnia Tobi Lütke, durante il suo discorso di apertura, ha riconosciuto l’importante contributo dell’ecosistema di partner e sviluppatori al successo di Shopify. La piattaforma e-commerce fornisce infatti una solida infrastruttura e gli strumenti necessari agli sviluppatori per creare nuove esperienze di shopping online in modo agile, creativo ed indipendente.

Tutti con lo stesso obiettivo comune: "migliorare il commercio per tutti, insieme".

Noi di Nama abbiamo seguito con entusiasmo Unite 2021. Ci è piaciuta sia per la portata e l’impatto delle novità annunciate, sia per il senso di comunità che si è venuto a creare tra i Partner Shopify durante la conferenza. Ci siamo registrate al server Discord in cui venivano discusse le nuove feature, dove si potevano porre domande ai membri dello staff Shopify e dove si è tenuta la sessione di “ask me anything” con il CEO della compagnia.

Shopify Discord post Unite screenshot

Durante Shopify Unite sono state annunciate tantissime novità che influenzeranno il nostro lavoro e renderanno Shopify ancora più attraente per i merchant. Abbiamo preparato una lista per ricapitolare gli annunci, divisa in quattro macro-temi:

Se siete curiosi e volete guardare la registrazione completa della conferenza potete trovarla qui (in inglese).

Online Store 2.0

Shopify store 2.0: uno screenshot del nuovo theme editor

Presentato come il più grande aggiornamento della piattaforma Liquid nella storia di Shopify, il principale annuncio dell’evento è sicuramente l’Online Store 2.0. Per i merchant questo significa maggiore flessibilità nella customizzazione del proprio negozio, mentre per gli sviluppatori significa un completo ripensamento dell’architettura dei temi.

Nuova architettura dei temi

La struttura dei temi è diventata modulare, pensata per funzionare come un insieme di blocchi lego che possono essere aggiunti, rimossi e spostati all’interno della pagina. Tutto questo per garantire la massima flessibilità ai merchant, che finalmente hanno a disposizione le sezioni su tutte le pagine del proprio negozio, direttamente dal theme editor.

La nuova architettura esegue il rendering delle pagine tramite template JSON invece che con template Liquid. Ogni template JSON contiene un oggetto che elenca le sezioni che compongono la pagina e i loro blocchi di contenuto. Anche le app esterne si comporteranno come sezioni e interagiranno con il tema tramite quelle che vengono chiamate App Extensions. Potranno essere aggiunte direttamente dal CMS e non lasceranno nessun residuo di codice quando rimosse.

Diventa molto semplice quindi l'esperienza creativa dei merchant, che hanno la possibilità di spostare la posizione di sezioni e app nella pagina, oltre che quella di creare diversi template direttamente dall'editor del tema, senza bisogno di codice personalizzato. Ecco un esempio del file JSON della pagina prodotto - ogni volta che viene effettuato un cambiamento nell'editor di tema, il template si aggiornerà automaticamente con il nuovo ordine e contenuto delle sezioni, un po' come faceva il file settings_data.json quando sono utilizzati i template Liquid.

{
  "sections": {
    "main": {
      "type": "main-page",
      "settings": {
      }
    },
    "1629360536d4f55a97": {
      "type": "image-with-text",
      "blocks": {
        "1629360536d4f55a97-0": {
          "type": "heading",
          "settings": {
            "heading": "Image with text"
          }
        },
        "1629360536d4f55a97-1": {
          "type": "text",
          "settings": {
            "text": "<p>Pair text with an image.<\\/p>"
          }
        }
      },
      "block_order": [
        "1629360536d4f55a97-0",
        "1629360536d4f55a97-1"
      ],
      "settings": {
        "height": "adapt",
        "color_scheme": "background-1",
        "layout": "image_first"
      }
    }
  },
  "order": [
    "main",
    "1629360536d4f55a97"
  ]
}

Questa nuova architettura è una risposta a due dei problemi principali che i temi di Shopify avevano in passato: la poca flessibilità per la personalizzazione da parte del merchant (eccetto per l'homepage) e garantire che le prestazioni del tema non siano influenzate negativamente dal codice di terze parti aggiunto tramite app o da codice custom per creare nuovi template prodotto, pagina o collezione.

Maggiore flessibilità per i contenuti del negozio

Assieme all'Online Store 2.0, un altro aggiornamento importante riguarda i metafield, frammenti di dati che possono essere aggiunti a prodotti, clienti e altri contenuti del negozio. In passato, i metafield erano aggiunti ai contenuti Shopify tramite app esterne. Ora i metafield potranno essere definiti e modificati direttamente dalla dashboard di Shopify, e poi selezionati come data source e collegati ad una specifica sezione dall'editor del tema.

Vanessa Lee, la Product Director dell'Online Store, ci ha anche mostrato una demo della nuova piattaforma di gestione contenuti di Shopify, Custom Content, che al momento è ancora in fase di sviluppo ma servirà a salvare i contenuti in qualsiasi formato all'interno di Shopify.

Dawn, strumenti per gli sviluppatori e nuovi standard per i temi

Tutte le nuove funzionalità dell'Online Store 2.0 come sezioni, template e metafield, sono state integrate nel primo tema open source realizzato da Shopify, Dawn. Questo tema è preinstallato in qualsiasi nuovo Development store creato dopo il 1 luglio, sostituendo Debut come tema predefinito. Carica il 35% più velocemente di Debut e utilizza JavaScript solo quando necessario, basandosi sulle funzionalità native del browser invece che su librerie JS e sui polyfill. È stato presentato durante Unite come il nuovo standard per lo sviluppo di temi Shopify.

Se siete curiosi di visitare un negozio online che sta già adottando tutte le funzionalità dell'Online Store 2.0, potete esplorare il sito di Netflix.

Oltre a Dawn, sono stati annunciati molti nuovi strumenti per gli sviluppatori:

  • Shopify CLI
    L'attuale Shopify CLI (command line interface) è stata ampliata per comprendere anche lo sviluppo di temi e ne sono stati aggiunti nuovi comandi, un linter per temi e l'hot reloading per CSS e Liquid

  • Integrazione Git per lo sviluppo di temi
    Un'ottima soluzione per le pipeline di integrazione continua e per la collaborazione con altri sviluppatori direttamente da Github.

  • Restyling della documentazione
    La documentazione per sviluppatori ha cambiato look, ha un font più leggibile e un'organizzazione più lineare basata sulla ricerca di esempi pratici piuttosto che teorica.

Screenshot piattaforma dev Shopify con nuova grafica

Dopo 3 anni, il 15 luglio è stato anche riaperto il Theme Store di Shopify agli sviluppatori per l'invio di nuovi temi. E già da metà Agosto si sono iniziati a vedere i primi temi compatibili con l'Online Store 2.0

Shopify checkout

Molti miglioramenti del checkout sono attualmente in fase di beta testing e verranno rilasciati verso la fine del 2021. Possono essere suddivisi in tre aree principali: estensioni del checkout, modifiche a Shopify Scripts e una nuova piattaforma per i pagamenti.

Estensioni del checkout 

Immagine app post purchase a checkout

Al momento, piccole modifiche al checkout sono possibili solo tramite l'editor del tema, mentre modifiche più sostanziali possono essere apportate (solo nei negozi Shopify Plus) tramite il file checkout.liquid.

Le checkout extensions, un insieme di API e componenti modulari, consentiranno agli sviluppatori di integrare le loro app Shopify direttamente all'interno del checkout, senza correre il rischio di "rompere" il file checkout.liquid. Le checkout extensions saranno anche compatibili checkout accelerati come ad esempio Shop Pay.

Sebbene le checkout extensions siano ancora in fase di sviluppo, Shopify ha aperto l'accesso beta alla prima checkout extension, l'app per checkout post-purchase.

Shopify Scripts

Solo i negozi Plus hanno accesso agli script Shopify, che consentono la creazione di una logica di backend personalizzata direttamente dalla dashboard Shopify. Ad esempio, con gli script Shopify, si possono riordinare i gateway di pagamento nel checkout. Ancora in fase di beta testing, la nuova versione migliorerà l'affidabilità, la velocità e consentirà agli sviluppatori di creare script utilizzando proprio setup di sviluppo locale preferito. Inoltre, anche gli script ora saranno installati tramite app, in modo da essere riutilizzabili e installati su più negozi.

Nuova Piattaforma Pagamenti

Soprattutto per quanto riguarda i gateway di pagamento, Shopify fa affidamento su sviluppatori e partner di pagamento di tutto il mondo per stare al passo con il numero di metodi di pagamento disponibili nei diversi paesi. Gli sviluppatori saranno presto in grado di creare gateway di pagamento come app Shopify anziché punti di integrazione legacy, Active Merchant e Hosted Payment SDK. La nuova piattaforma di pagamento sarà disponibile per gli sviluppatori alla fine del 2021.

Miglioramenti per lo sviluppo di app e focus sugli sviluppatori-imprenditori

Nel 2021, l'e-commerce è arrivato a rappresentare il 20% del commercio globale ed è diventato parte integrante dell'attività dei merchant in tutto il mondo. La domanda di sviluppatori di e-commerce che costruiscano soluzioni personalizzate per le esigenze di aziende piccole e grandi è davvero elevata. Shopify riconosce l'importanza dell'ecosistema di sviluppatori per portare clienti sulla sua piattaforma, e ha voluto posizionarsi come il posto in cui gli sviluppatori possono far nascere, crescere ed espandere la propria attività imprenditoriale.

Uno degli annunci più importanti di Unite che mette gli sviluppatori al primo posto riguarda la rimozione delle commissioni sul primo milione di dollari che gli sviluppatori guadagnano annualmente sull'App Store e sul Theme Store di Shopify. Oltre a questo incentivo finanziario, Shopify ha solidificato la propria infrastruttura e migliorato documentazione per permettere agli sviluppatori di app di far crescere le proprie aziende.

Sono stati rilasciati alcuni aggiornamenti per migliorare il flusso di lavoro di sviluppo dell'app: migliore documentazione con una maggiore leggibilità, una console per debugging aggiornata per aiutare con la creazione di App extensions, che ora sono necessarie per consentire alle app di interagire con i temi e Google Cloud Pub/Sub per migliorare l'interazione con i webhook.

Un nuovo algoritmo che crea delle raccomandazioni personalizzate specifiche per ogni merchant è stato introdotto nell'App Store e nella dashboard Shopify, per consigliare le app più adatte alle esigenze del negozio. Inoltre, sono stati annunciati dei nuovi pacchetti pubblicitari per quelle aziende che desiderano promuovere la propria app a pagamento.

Custom storefronts

Storefront API

I canali tradizionali di vendita su Shopify sono il negozio Online e Shopify POS. Negli ultimi anni Shopify ha investito sulle Storefront API, che consente di creare esperienze di acquisto che esulano dalle dinamiche tradizionali e che permettono agli sviluppatori di scegliere il framework e il linguaggio in cui sviluppare. Prendiamo l'esempio di ComplexCon, un festival dal vivo per gli appassionati di streetwear che si tiene ogni anno a Long Beach. Nel 2020 ha sostituito il suo evento di persona con una piattaforma di gioco online in cui gli ospiti potevano assistere a concerti, acquistare prodotti esclusivi e ordinare dai ristoranti locali. Tutto tramite lo storefront API di Shopify, che può accedere alle informazioni sui prodotti, creare ordini e controllare gli acquisti.

L'API GraphQL di Shopify Storefront a luglio ha raggiunto picchi di 1 milione di query al minuto, quindi uno degli obiettivi per quest'anno è portare il motore GraphQL in tutte le principali regioni geografiche e le funzionalità di Shopify entro 50 millisecondi da ogni acquirente. Sono stati anche aggiunti nuovi endpoint per ampliare il raggio di quello che si può creare attraverso lo Storefront API: alcuni degli annunci riguardavano la nuova @inContext GraphQL, API per i prezzi internazionali, API per piani di vendita, ritiro locale e altre integrazioni dirette con il check-out nativo di Shopify. È stato annunciato anche un aggiornamento allo schema API Storefront, che può essere visualizzato in anteprima qui.

Hydrogen

Hydrogen è stato presentato in anteprima durante Unite. Se lo Storefront API serve a interagire con il backend di Shopify, dove sono contenuti i dati dei prodotti, degli ordini e dei clienti, Hydrogen è un framework per creare negozi personalizzati. Si tratta di un framework costruito su JavaScript e React, con una serie di componenti standard studiati per l'e-commerce, come ad esempio il carrello, il selettore varianti o la galleria immagini prodotto.

Tobias Lütke coding live during Shopify Unite

È stato davvero divertente guardare Tobi scrivere codice usando Hydrogen e darci un'anteprima di come funziona, aggiungendo un color swatch alla pagina prodotto del suo negozio di snowboard, e poi sostituire l'immagine prodotto con un modello 3D del prodotto che interagisce con le opzioni delle varianti. Durante la demo ha anche menzionato Oxygen, che è una piattaforma di hosting per i negozi custom sviluppati con Hydrogen. Sia Hydrogen che Oxygen saranno rilasciati in contemporanea, forse entro la fine di quest'anno.

Il video completo della presentazione di Hydrogen è qui e nella stessa pagina è presente un form per ricevere notifiche sul lancio del framework. È importante notare che Hydrogen non sostituirà il modo tradizionale di sviluppare negozi e-commerce su Shopify, ma sarà un'alternativa disponibile per quegli sviluppatori che vogliono utilizzare linguaggi specifici o offrire esperienze di shopping custom.

Riflessioni su Unite 2021

Come avete potuto leggere, questo Unite è stato veramente ricco di contenuti e novità. Shopify sta scommettendo molto sulla sua comunità di sviluppatori, e allo stesso tempo sta fornendo delle linee guida e best practices per garantire che la qualità dei prodotti rilasciati (sia temi che app) sia alta e possa soddisfare le esigenze del numero sempre crescente di merchant sulla piattaforma.

Le novità annunciate quest'anno a Unite comportano circa 6-12 mesi di aggiornamenti per gli sviluppatori - bisognerà studiare, mettere in produzione e monitorare il tutto. Ma come parte dell'ecosistema Shopify, siamo contente di far parte della comunità che si sta impegnando per dare forma al commercio del futuro INSIEME.

 

Se hai bisogno di ulteriori suggerimenti o vuoi discutere le opportunità che possono nascere dalle nuove feature annunciate da Shopify, noi di Nama siamo sempre felici di fare una chiacchierata. Scrivici a info@namastudio.it!

Foto di Rossella Ferrandino

Note sull'autore

Rossella Ferrandino

Rossella è la Front End Developer di Nama, e si occupa di tradurre i requisiti strategici dei clienti in codice. Con un background in eventi e marketing a Londra, Rossella è diventata developer sul campo, prima come autodidatta e successivamente con diverse esperienze nel settore tech. È volontaria per Women Who Code, community dedicata all'empowerment delle donne nel tech. Il suo Pokémon preferito è Snorlax.