Découvrez Ibexa DXP v4.0 : la refonte complète de l’interface utilisateur pour améliorer l’expérience utilisateur

L'interface utilisateur (UI) d'Ibexa DXP a subi une refonte majeure pour améliorer l'expérience utilisateur (UX) et aider les éditeurs et les créateurs de contenu à gagner du temps dans leur travail, au quotidien. Sur la base des commentaires de nos utilisateurs finaux et de l'expertise d'une équipe UX interne nouvellement créée, nous avons réorganisé la conception graphique et modifié des fonctionnalités clés afin de simplifier la navigation, favoriser la concentration, minimiser la confusion et fournir des flux de travail encore plus simplifiés.

Il s'agit du deuxième article d'une série de blogs en trois partie, offrant un aperçu des nouvelles fonctionnalités incluses dans le lancement à venir de notre dernière version du logiciel, Ibexa DXP v4.0. Le précédent article de cette série présente le nouveau catalogue produit d'Ibexa - avec la puissance d'un PIM.

Une partie importante du développement des produits d'Ibexa DXP est basée sur les commentaires et les demandes de nos clients et les utilisateurs finaux. Leur contribution nous est précieuse lors de la conception de nouvelles fonctionnalités ou de l'amélioration de celles existantes, car personne n'est mieux placé pour fournir de tels commentaires que ceux qui travaillent le plus dans l'interface utilisateur d'Ibexa DXP. Lors de l'exécution quotidienne d'actions répétitives, il devient évident de mettre en lumière quelles parties de l'interface pourraient être conçues de manière plus intuitive ou conviviale, pour améliorer l'efficacité du travail et réduire le nombre d'actions nécessaires pour accomplir une tâche.

Un processus de refonte centré sur l'utilisateur

Le renouvellement de l'interface utilisateur d'Ibexa DXP a été lancé avec le changement de marque d'eZ Systems vers Ibexa et la création d'une équipe UX interne dédiée au développement et à la pérennité des capacités et de la convivialité d'Ibexa DXP. L'équipe travaille en étroite collaboration avec les départements ingénieurie et gestion de produit afin de fournir des outils améliorés et de meilleures expériences à nos utilisateurs finaux.

Natalia Becla, Senior UX Designer et Responsable d'équipe chez Ibexa, nous explique l'approche de son équipe en matière de conception UX et UI : "Dans notre travail, nous avons mis en œuvre la conception centrée sur l'utilisateur (UCD). C'est un processus itératif, où les concepteurs se concentrent sur les utilisateurs en les impliquant dans le processus de conception, à chaque étape. Grâce à l'utilisation de divers frameworks et de plusieurs méthodes, nous avons recueilli les commentaires des utilisateurs et amélioré le produit en fonction de leurs attentes et de leurs objectifs commerciaux. Les commentaires recueillis lors des tests utilisateurs nous servent de guide, indiquant explicitement quels domaines de l'UX et de l'UI nécessitent encore des améliorations et de l'attention, pour fournir le meilleur produit de qualité.

Bien que l'interface utilisateur d'Ibexa DXP ait été continuellement développée et enrichie de nouvelles technologies et capacités depuis la création de l'entreprise en 1999, le moment était maintenant venu pour un examen approfondi et hautement structuré de la conception de l'interface utilisateur et de l'UX afin de remettre en question la structure de navigation et le graphisme global de la conception de notre DXP. En collaboration avec la plus grande agence de recherche en Pologne, notre équipe UX/UI s'est lancée dans une étude analytique pour découvrir quels aspects - visuels et fonctionnels - de l'UX/UI devraient être prioritaires dans ce processus de refonte.

Conception actuelle et nouvelle de l'interface utilisateur : la nouvelle interface utilisateur utilise des arrière-plans sombres pour mettre en évidence les éléments de menu clés et un arrière-plan plus clair sur l'espace de contenu pour une visualisation et un contraste optimaux. La barre d'outils actuelle a été remplacée par des boutons afin d'optimiser l'espace. La recherche est maintenant visible dans la barre du haut.

Natalia Becla décrit plus en détail ce processus analytique : « Au début de la phase conceptuelle, nous avons lancé un panel de test utilisateur. Nous avons engagé des utilisateurs dont les profils correspondaient à nos personas (aux représentations fiables et réalistes des segments d'audience clés pour référence), allant des éditeurs et des spécialistes du e-commerce aux développeurs. Les discussions avec les utilisateurs nous ont permis de mieux comprendre comment Ibexa DXP est utilisé. »

L'objectif du panel de test utilisateur était d'apporter les commentaires des utilisateurs à chaque étape du processus de développement en identifiant les principaux points faibles avec l'interface utilisateur actuelle et sa navigation (architecture de l'information), en aidant à valider les nouvelles conceptions de l'interface utilisateur et en testant la nouvelle conception pour identifier ses potentiels problèmes UX/UI et suggérer des améliorations.

"Nous avons rapidement réalisé que bien que la plupart des changements que nous avons apportés semblent minimes, c'est l'accumulation de ces petits problèmes qui a créé chez les utilisateurs un sentiment de frustration face au produit actuel", explique Natalia Becla. « Leurs attentes sont élevées, ce qui n'est pas surprenant, car nous travaillons tous avec de nombreuses applications logicielles différentes. Par exemple, si une table est triable dans une autre application, ils s'attendent à voir la même chose dans Ibexa. De même, la recherche était un problème clé à résoudre. Nous utilisons tous Google plusieurs fois par jour avec des résultats instantanés et justes. Nous avons donc d'abord étudié le problème afin que la barre de recherche soit toujours disponible. Nous travaillons toujours à l'amélioration de la qualité de la recherche, mais nous avons déjà fait de grands progrès vers la bonne direction. »

Natalia Becla est Senior UX Designer chez Ibexa, avec une expérience complète dans la création d'applications métier. La majeure partie de son expérience provient de la conception d'applications Web SaaS, où ses compétences en analyse, conception et recherche d'utilisateurs sont mises à profit.

Quoi de neuf ?

Bien que l'interface utilisateur ait été entièrement repensée, elle est si intuitive que les utilisateurs existants peuvent s'y habituer rapidement. De plus, les nouveaux utilisateurs sont susceptibles de percevoir la nouvelle interface utilisateur de manière si intuitive qu'ils peuvent effectuer la plupart des tâches par eux-mêmes. Les processus liés à la création et à l'édition des éléments de contenu et des produits ont été simplifiés, les clics inutiles ont été éliminés avec l'introduction de menus contextuels, et la conception graphique fournit plus de conseils visuels en promouvant les fonctionnalités clés et les outils fréquemment utilisés.

Navigation plus fluide, gestion de contenu plus intuitive

Pouvoir naviguer dans l'interface utilisateur sans effort a un impact majeur sur l'efficacité du travail des utilisateurs finaux et constitue un élément crucial de l'expérience utilisateur globale, en particulier pour les utilisateurs qui gèrent un grand nombre de sites Web sur différents marchés ou pour plusieurs marques. L'un des domaines prioritaires du processus de refonte de l'interface utilisateur d'Ibexa a été d'améliorer la navigation dans l'interface en restructurant des parties de l'architecture de l'information pour rendre la navigation dans - et entre - différentes sections et outils plus fluide et plus intuitive.

La refonte graphique favorise la concentration

La nouvelle conception graphique de l'interface utilisateur affecte la plupart des fonctionnalités et des outils. L'arrière-plan de la section de navigation principale a été assombri pour faire ressortir les onglets d'outils et les icônes, et pour séparer la section de navigation de la zone de contenu (où le contenu est géré). La couleur d'arrière-plan de la zone de contenu reste blanche pour de nombreuses raisons, parmi lesquelles le contraste, la visibilité du texte et la lisibilité.

La démarcation claire, par des panneaux colorés, aide les utilisateurs à se concentrer sur les tâches qu'ils font, comme mentionné ci-dessus, la zone blanche est l'endroit où ils créent du contenu. La zone grise plus claire montrant l'arborescence de contenu facilite la navigation entre les différentes parties d'un site Web. Le panneau de gauche bleu foncé est l'endroit où les utilisateurs peuvent naviguer dans le backend de la plate-forme. Le panneau le plus à gauche avec des icônes est un niveau de navigation encore plus élevé, montrant les différents modules d'Ibexa DXP.

De nouveaux éléments visuels tels que des icônes, des onglets et des boutons repensés ont été introduits pour faciliter le travail des utilisateurs et faciliter le flux des utilisateurs en réduisant le nombre de clics ou d'actions qu'ils doivent effectuer pour accomplir une tâche. Par exemple, le bouton principal est maintenant rouge, et en utilisant cette couleur intense, les utilisateurs peuvent accélérer leur travail car il devient plus intuitif pour eux et ils savent instantatément quelle action ils doivent faire. Les nouveaux designs ont été décrits comme attrayants, modernes, frais et clairs dans les tests utilisateurs et les utilisateurs ont déclaré que la nouvelle navigation les aiderait à être plus efficaces.

La nouvelle fonctionnalité de catalogue produit d'Ibexa, qui sera introduite avec Ibexa DXP v4.0, a été développée simultanément avec la nouvelle interface utilisateur pour assurer une gestion simplifiée de potentiellement des milliers de produits. Le flux d'actions clés, la navigation et l'étiquetage des boutons dans le catalogue de produits sont les résultats du processus d'analyse, et le panel de test utilisateur a vérifié que la nouvelle interface utilisateur prend en charge les flux de travail utilisateur typiques. Les utilisateurs disposant de systèmes PIM actuels ou d'autres outils de gestion de produits, et d'offres de produits complexes, ont compris la plupart des tâches qu'ils devaient effectuer lors des tests utilisateur. Ils ont trouvé le déroulement d'une tâche logique et clair ; la nouvelle conception de l'interface utilisateur a été évaluée comme une excellente direction parmi les utilisateurs actuels et facile à saisir par les nouveaux utilisateurs.

La nouvelle fonctionnalité de catalogue produits : différents attributs (caractéristiques du produit) ou groupes d'attributs peuvent facilement être attribués aux types de produits grâce à l'interface simple de glisser-déposer.

La gestion de contenu numérique (articles, images, vidéos, documents, etc.) pour plusieurs sites Web nécessite une structure de gestion de contenu bien organisée qui offre une bonne vue d'ensemble de tout le contenu et un accès facile à celui-ci. L'interface utilisateur remaniée réintroduit le menu contextuel dans l'arborescence de contenu populaire d'Ibexa, qui vous permet d'effectuer plusieurs opérations permettant de gagner du temps directement dans l'arborescence de contenu : déplacer, copier ou supprimer des éléments de contenu et développer ou réduire les sections de menu de l'arborescence de contenu. Ce gif montre comment déplacer un élément de contenu :

Les fonctionnalités de glisser-déposer fournies par la nouvelle interface utilisateur permettent une gestion facile des différents éléments de contenu et paramètres dans des fonctionnalités telles que Page Builder, Ibexa Personalization et le nouveau catalogue de produits. Cette manière simple de gérer les pages Web, les produits et les différents paramètres est également appliquée à d'autres actions dans la nouvelle interface utilisateur, par ex. lors de la définition des types de contenu.

Fonctionnalité populaire dans le nouveau pack : le Page Builder d'Ibexa vous permet de créer de nouvelles pages Web rapidement et efficacement à l'aide de modèles prédéfinis et de blocs de contenu par glisser-déposer faciles à utiliser pour ajouter différentes parties de contenu à la page.

Plusieurs améliorations d'Ibexa Personalization seront livrées avec Ibexa DXP v4.0 en plus des améliorations visuelles fournies par la nouvelle interface utilisateur.

Ibexa DXP v4.0 arrive bientôt !

La nouvelle interface utilisateur sera lancée avec Ibexa DXP v4.0 au cours du premier trimestre 2022 et sera implémentée dans tous les produits Ibexa DXP ; Ibexa Content, Ibexa Experience et Ibexa Commerce. D'autres améliorations seront ajoutées à l'interface utilisateur dans les versions ultérieures.

Si vous souhaitez discuter de la manière dont vous pourriez tirer parti de votre portefeuille de produits sur une plate-forme d'expérience numérique avancée, veuillez nous contacter.