Découvrez la nouvelle fonctionnalité d’Ibexa DXP v3.3 : l’Éditeur d'Images

Ibexa DXP v3.3 introduit l’Editeur d’Images (Image Editor en anglais), qui vous permet d'éditer et de modifier les éléments d'image clés de manière simple et rapide. Cette fonction comprend notamment : le recadrage d’image, le pivot d’image et la détermination d’un point focal (focus) dans une image – cela garantit un affichage optimal du sujet principal de l’image sur tous les appareils et toutes les résolutions d’écran.

Il s'agit ici du premier article d'une série de blogs de prévisualisation en trois parties offrant un aperçu des nouvelles fonctionnalités incluses dans le prochain lancement de notre dernière version logicielle, la v3.3, bientôt disponible.

La fonction d'édition d'image intégrée, fournie avec Ibexa DXP v3.3, a été développée suite au souhait de nos clients de pouvoir effectuer des opérations d'édition d'image basiques sur les images téléchargées, de manière conviviale et efficace, tout en travaillant sur un contenu élément dans l'interface d'édition. Bien que chaque client et chaque projet puisse avoir des besoins différents, nous avons pris en charge les opérations d'édition d'image les plus recherchées dans cette première édition d’Éditeur d'Images.

L'interface de l’Éditeur d'Images comprend :

• L'image à éditer
• Une barre d'outils sur la droite avec trois options d'édition : Pivot d’images, Point focal (focus), et Recadrage
• Des fonctionnalités pour annuler ou rétablir les modifications d'image, ou encore réinitialiser l'image à son état d'origine
• Des Informations sur l'image sous l'image elle-même, affichant la dimension actuelle de l'image en pixels (largeur x hauteur)
• Les boutons Enregistrer et Annuler.

L’Éditeur d'Images est lancé en cliquant sur le bouton « Modifier » qui s’affiche sur les champs d’image en mode d’édition :

Vous pouvez vous concentrer sur un sujet ou améliorer l'expression visuelle d'une image avec la fonctionnalité « Recadrer ».

L'impact visuel et la composition d'une image peuvent être considérablement améliorés lorsque cette dernière est soigneusement recadrée. Le recadrage d'image peut mettre en évidence des éléments de la photo pour mieux exprimer l'histoire voulue ou supprimer les éléments distrayants. Le recadrage vous permet également de « zoomer » sur un sujet de l’image ou de modifier l’orientation de l’image.

L'option Recadrer de la barre d'outils de l’Éditeur d'Images affiche les formats de recadrage disponibles, notamment :

• 1:1 – Le format carré. La largeur et la hauteur de l'image sont égales.
• 3:4 – Pour chaque 3 unités de largeur, il y a 4 unités de hauteur, créant une forme de portrait rectangulaire.
• 4:3 – Pour chaque 4 unités de largeur, il y a 3 unités de hauteur, créant une forme de paysage rectangulaire.
• 16:9 – Pour le format grand écran, qui peut être 78% plus large que haut par exemple, l’image étant ainsi dimensionnée à 1920 x 1080 pixels.
• Personnalisé – Cela vous permet de recadrer l'image à votre guise, indépendamment des limitations d'un rapport hauteur / largeur prédéfini.

Lorsque vous cliquez sur le format souhaité, la zone de recadrage sera activée sur l'image et le rapport hauteur / largeur (largeur x hauteur) de la zone de recadrage apparaîtra dans les champs « Taille de recadrage ». Vous pouvez redimensionner la zone de recadrage ou la faire glisser vers la partie de l'image que vous souhaitez recadrer :

Vous pouvez supprimer le recadrage en cliquant sur le symbole X rouge ou éxecuter le recadrage en cliquant sur le symbole de coche verte. Une fois exécuté, l’Éditeur d'Images affichera votre image recadrée :

Exemples visuels des formats de recadrage prédéfinis disponibles dans l’Éditeur d'Images :

Vous pouvez créer une image plus élaborée avec la fonctionnalité Flip

Nos yeux regardent en premier la partie gauche d’un cadre d'image et les éléments se déplaçant de gauche à droite sont donc plus confortables à observer pour les yeux. Si les éléments se déplacent de droite à gauche, l'image peut sembler moins agréable à regarder à l’œil nu. Le pivot d’une image peut donc influencer l’endroit où l’œil se pose et renforcer votre narration en dirigeant les yeux du spectateur vers des éléments importants du cadre et créer ou intensifier l’émotion.

L’Éditeur d'Images vous permet de faire pivoter une image horizontalement ou verticalement. Un pivot horizontal donnera une image en miroir, tandis qu'un pivot vertical retournera l'image à l'envers.

Cet exemple montre comment la fonction de pivot horizontal de l’Éditeur d'Images peut créer moins de tension dans une image et diriger les yeux du spectateur à travers le cadre de manière plus confortable :

En combinant les fonctionnalités de recadrage et de pivot, vous pouvez créer une image qui est plus agréable en termes de composition, plus visible ou obtenir des effets créatifs impressionnants :

Vous pouvez également avoir un affichage optimal de votre image sur tous les appareils en déterminant un point focal (le focus) :

Le terme « point focal » a une variété de définitions selon le contexte. Dans l’Éditeur d'Images, la fonctionnalité Point focal (focus) vous permet de définir le sujet principal de votre image ; le sujet qui doit être mis au point et prendre en charge les exigences de conception réactive sur tous les appareils et résolutions d'écran.

Étant donné que le rapport hauteur / largeur n'est pas le même sur tous les appareils, le point focal (focus) ne restera pas toujours dans le cadre simplement en réduisant l'image. Vous devez vous assurer que le sujet principal sera affiché quel que soit l'appareil utilisé, en particulier pour le contenu où l'image est une partie importante de votre narration.

Lorsque vous cliquez sur le bouton « Afficher le point focal », l’éditeur d’images affiche le point focal par défaut, qui est placé au centre de l’image. La définition du point focal de votre choix se fait simplement en attirant le curseur du point focal sur le sujet de l'image sur laquelle vous souhaitez faire la mise au point. Vous pouvez réinitialiser la détermination de votre point focal en cliquant sur le symbole de la croix rouge.

Enregistrer vos modifications d'image

Lorsque vous êtes satisfait des modifications d'image que vous avez effectuées et que vous souhaitez quitter l’Éditeur d'Images, vos modifications sont enregistrées en cliquant sur le bouton Enregistrer. Votre image sera stockée dans le référentiel d'images dans son nouvel état modifié. Si l'image que vous avez modifiée est utilisée par plus d'un élément de contenu, un message d'avertissement s'affiche. Vous pouvez choisir d'enregistrer l'image modifiée en tant que nouveau fichier image (à utiliser uniquement pour l'élément de contenu que vous modifiez actuellement) ou d'appliquer l'image modifiée à tous les éléments de contenu dans lesquels elle est utilisée.

Augmentez votre efficacité en tant que créateur de contenu avec l’Éditeur d'Images

Bien que l’Éditeur d'Images ne remplace pas Photoshop ou d'autres programmes d'édition d'images à grande échelle, il vous permettra sûrement de travailler plus efficacement en tant que créateur de contenu chaque fois que vous aurez besoin d'effectuer des modifications basiques sur une image tout en créant du contenu dans votre plateforme Ibexa DXP. L’Éditeur d'Images s'assurera également que les éditeurs sans accès aux programmes de retouche photo ou sans expérience de l'utilisation de ceux-ci peuvent effectuer des modifications d'images simples sans la participation de graphistes ou de collègues qualifiés dans l'utilisation de programmes d'édition avancés.

Intégrez l’Éditeur d'Images à votre workflow de création de contenu !