Migrazione all’interfaccia utente touch

A partire dalla versione 6.0, Adobe Experience Manager (AEM) ha introdotto una nuova interfaccia utente denominata interfaccia touch (nota semplicemente come interfaccia touch). È allineato a Adobe Marketing Cloud e alle linee guida generali dell’interfaccia utente di Adobe. Questa è diventata l'interfaccia standard in AEM con l'interfaccia legacy, orientata al desktop, denominata interfaccia classica.

Se utilizzi AEM con l’interfaccia classica, devi intervenire per eseguire la migrazione dell’istanza. Questa pagina ha lo scopo di fungere da trampolino di lancio fornendo collegamenti a singole risorse.

NOTA

Un tale progetto di migrazione può avere un impatto significativo sulla tua istanza. Per le linee guida consigliate, consulta Gestione dei progetti - Best practice .

Nozioni di base

Durante la migrazione è necessario tenere presente le seguenti differenze (principali) tra l’interfaccia classica e quella touch:

Interfaccia classica	Interfaccia utente touch
È descritto nell’archivio JCR come una struttura di nodi. Ogni nodo che rappresenta un elemento dell'interfaccia utente è denominato widget ExtJS ed è rappresentato sul lato client da `ExtJS`.	Anche descritto nell’archivio JCR come una struttura di nodi. Tuttavia, in questo caso ogni nodo fa riferimento a un tipo di risorsa Sling (componente Sling), che è responsabile del suo rendering. Quindi l'interfaccia utente viene (sostanzialmente) sottoposta a rendering lato server.
`sling:resourceType` non utilizzato	`sling:resourceType` utilizzato ad esempio `cq/gui/components/authoring/dialog`
Nodi di dialogo: Nome: `dialog` jcr:primaryType: `cq:Dialog`	Nodi di dialogo: Nome: `cq:dialog` jcr:primaryType: `nt:unstructured`
Posizione JavaScript: Le parti imperative sono direttamente incorporate utilizzando listener o gestite in clientlibs.	Posizione JavaScript: Le parti imperibili non possono essere incorporate nella definizione della finestra di dialogo; separazione delle responsabilità.
Gestione degli eventi: I widget di dialogo fanno riferimento direttamente al codice JavaScript.	Gestione degli eventi: Javascript osserva gli eventi di dialogo.
Rendering eseguito dal client: Client crea in modo dinamico i componenti dell’interfaccia utente. Definizione del componente richieste client (Pull) (come JSON) dal server.	Rendering eseguito dal server: Il client richiede le pagine insieme all’interfaccia utente correlata. Il server invia (push) l’interfaccia utente come documenti HTML; utilizzo dei componenti dell'interfaccia Coral.

In altre parole, per migrare una sezione dell'interfaccia utente dall'interfaccia classica all'interfaccia touch si intende portare un widget ExtJS in un componente Sling. Per facilitare questa fase, l’interfaccia utente touch si basa sul framework dell’interfaccia utente Granite, che fornisce già alcuni componenti Sling per l’interfaccia utente (denominati componenti dell’interfaccia Granite).

Prima di iniziare, controlla lo stato e i consigli correlati:

Le nozioni di base per lo sviluppo dell’interfaccia touch forniscono una solida base:

Migrazione dell’authoring delle pagine

Le finestre di dialogo sono un fattore importante durante la migrazione dei componenti:

Sviluppo di componenti AEM (con interfaccia touch)
Migrazione da un componente Classic
Strumenti di modernizzazione AEM : per convertire le finestre di dialogo dei componenti dell’interfaccia classica in interfaccia touch
- Nell’interfaccia touch è disponibile un livello di compatibilità per aprire una finestra di dialogo dell’interfaccia classica all’interno di un wrapper per dell’interfaccia touch, ma questo ha funzionalità limitate e non è consigliato a lungo termine.
Personalizzazione dei campi di dialogo nell’interfaccia utente touch
Creazione di un nuovo componente campo dell’interfaccia Granite
Personalizzazione dell’authoring delle pagine (con l’interfaccia touch)

Migrazione delle console

È inoltre possibile personalizzare le console:

Personalizzazione delle console (per l’interfaccia touch)

Anche se non è direttamente correlato a una migrazione all’interfaccia utente touch, esistono problemi correlati che è bene considerare allo stesso tempo, in quanto sono anche la pratica consigliata:

NOTA

Vedi anche Sviluppo - Best practice.