Migration vers l’interface utilisateur tactile

À compter de la version 6.0, Adobe Experience Manager (AEM) a introduit une nouvelle interface utilisateur appelée IU tactile (également appelé simplement IU tactile). Il est aligné sur Adobe Marketing Cloud et sur les directives générales de l’interface utilisateur de l’Adobe. L’interface utilisateur standard d’ est devenue AEM avec l’ancienne interface orientée bureau appelée IU classique.

Si vous avez utilisé AEM avec l’interface utilisateur classique, vous devez prendre des mesures pour migrer votre instance. Cette page est destinée à servir de tremplin en fournissant des liens vers des ressources individuelles.

REMARQUE

Un tel projet de migration peut avoir un impact important sur votre instance. Voir Gestion des projets - Bonnes pratiques pour obtenir des instructions recommandées.

Principes élémentaires

Lors de la migration, vous devez tenir compte des différences (majeures) suivantes entre l’IU classique et l’IU tactile :

Interface utilisateur classique Interface utilisateur optimisée pour les écrans tactiles
Est décrit dans le référentiel JCR comme une structure de noeuds. Chaque noeud qui représente un élément de l’interface utilisateur est appelé une Widget ExtJS et rendu côté client par ExtJS. Également décrit dans le référentiel JCR comme une structure de noeuds. Cependant, dans ce cas, chaque noeud fait référence à un type de ressource Sling (composant Sling), responsable de son rendu. L’interface utilisateur est (en fait) rendue côté serveur.

sling:resourceType

  • non utilisé
 sling:resourceType
  • utilisé
  • par exemple
    cq/gui/components/authoring/dialog

Noeuds de boîte de dialogue :

  • Nom: dialog
  • jcr:primaryType: cq:Dialog

Noeuds de boîte de dialogue :

  • Nom: cq:dialog
  • jcr:primaryType: nt:unstructured

Emplacement JavaScript :

  • Les parties impératives sont directement incorporées à l’aide d’écouteurs ou gérées dans des bibliothèques clientes.

Emplacement JavaScript :

  • Les parties impératives ne peuvent pas être incorporées dans la définition de boîte de dialogue ; la séparation des responsabilités.

Gestion des événements :

  • Les widgets de boîte de dialogue font directement référence au code JavaScript.

Gestion des événements :

  • Javascript observe les événements de boîte de dialogue.
Rendu effectué par le client :
  • Le client crée dynamiquement les composants de l’interface utilisateur.
  • Le client demande la définition du composant (extraction) (au format JSON) au serveur.
 Rendu effectué par le serveur :
  • Le client demande des pages avec l’interface utilisateur associée.
  • Le serveur envoie (push) l’interface utilisateur sous la forme de documents HTMLS ; à l’aide des composants de l’IU Coral.

En d’autres termes, la migration d’une section de votre interface utilisateur de l’IU classique vers l’IU tactile signifie la portage d’une Widget ExtJS à Composant Sling. Pour faciliter cela, l’interface utilisateur tactile est basée sur la structure de l’interface utilisateur Granite, qui fournit déjà certains composants Sling pour l’interface utilisateur (appelés composants de l’interface utilisateur Granite).

Avant de commencer, vérifiez l’état et les recommandations associées :

Les principes de base du développement de l’interface utilisateur tactile fourniront une base solide :

Migration de la création de pages

Les boîtes de dialogue constituent un facteur majeur lors de la migration de vos composants :

Migration des consoles

Vous pouvez également personnaliser les consoles :

Bien qu’il ne soit pas directement lié à une migration vers l’interface utilisateur tactile, il existe des problèmes connexes qui méritent d’être pris en compte en même temps, car ils sont également recommandés :

REMARQUE

Autres ressources

Pour plus d’informations sur le développement d’AEM, voir la collecte de ressources sous :

ATTENTION

Les outils de modernisation d’AEM sont un effort de la communauté et ne sont ni soutenus ni garantis par Adobe.

Sur cette page