ev|Apps Builder - H2.2016 - Présentation des nouveautés


Note : Ceci est un document de sortie de version.
  • Certaines copies d’écran peuvent être légèrement différentes de la version finale car l’amélioration du design est un processus continu jusqu’à la date de sortie.
  • Les pages du wiki détaillant les différents points vont être mises à jour prochainement. Pour vous tenir informé sur leur disponibilité : Open url.png Nouveautés du wiki

       Open url.png  voir Erreurs connues

Mode Public

Principe général

Le mode Public permet de créer des applications dont tout ou partie du contenu est accessible à tous les utilisateurs, sans qu’il leur soit nécessaire de se loguer. Vous pouvez ainsi créer un portail dont la 1ère page présente un catalogue des services et une base de connaissance accessible à tous les utilisateurs (pages publiques), et dont la page permettant de commander un service nécessite d’être logué (page privée).
Note : Chaque page de l'application peut être déclarée publique ou privée, à l'exception de la première page qui doit nécessairement être publique (point d’entrée dans l’application).

  • Lorsqu'un utilisateur lance une application publique, celle-ci s'ouvre sans connexion ; la barre principale de l'application s'affiche sous la forme ci-dessous, en mode Invité.
             partie 1 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_5c0dcb0b.png
  • Lorsqu'un utilisateur tente d'accéder à une page privée d'une application, la boîte de login standard l'invite à se connecter (hors SSO).
             partie 1 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_10bcadd8.png
    Une fois connecté, la barre principale de l'application est affichée sous la forme ci-dessous.
             partie 1 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m3ebf7db4.png

Notion d’utilisateur Public

  • Le mode Public repose sur la notion d’utilisateur Public et peut être géré en 2 endroits :
    • au niveau de l'application : il est possible de définir un utilisateur Public sur une application, qui est enregistré avec celle-ci. N'importe quel utilisateur peut alors avoir accès à l'application sans se connecter (et visualiser tout ou partie du contenu) car l'utilisateur Public est automatiquement sélectionné ;
    • au niveau des pages de l’application : une fois qu’une application a été définie comme publique (un utilisateur Public lui a été associé), chacune de ses pages peut être définie comme publique (accessible par n'importe quel utilisateur sans se connecter) ou privée (accessible uniquement en se connectant). La page d’accueil d’une application publique est par définition publique.
       
  • Affichage des données de la base Product name - ev itsm.png :
    • Si l’utilisateur Public est lié à un compte Product name - ev itsm.png, les données de la base Product name - ev itsm.png (pour le domaine de l’utilisateur Public) sont visibles par n'importe quel utilisateur de l’application, sans nécessité pour lui de se connecter.
               Example documentation icon FR.png  Application affichant des indicateurs publics ou la base de connaissance Product name - ev itsm.png sans connexion
       
    • Si l’utilisateur Public n'est pas lié à un compte Product name - ev itsm.png, les utilisateurs de l'application peuvent accéder à une page sans se connecter :
      • si la page n'affiche aucun widget contenant des données issues de Product name - ev itsm.png ;
        ou
      • si la page contient des données issues de datasources Product name - ev itsm.png basés sur un connecteur ayant un utilisateur enregistré (via l'adresse e-mail).

Dans les autres cas de figure, un message d'erreur apparaît lorsque l'utilisateur tente d'accéder à la page.

 

  • Les utilisateurs Public sont définis au niveau de la gestion des accès.
    • Tout utilisateur peut devenir un utilisateur Public, identifié via partie 1 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m1c01f675.png.
               partie 1 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m79a4d7a4.png
    • Un nouveau filtre Public User permet d'afficher uniquement les utilisateurs Public.
               partie 1 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m625edd82.png
       
  • Pour qu’une application dispose d’un mode Public, il faut qu’un utilisateur Public soit sélectionné au niveau de la boîte de propriétés.
             partie 1 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m7dcd7034.png

    1. Cliquez sur la zone No public user connected pour afficher la liste des utilisateurs déclarés Public. Ceux-ci doivent être paramétrés au préalable via la gestion des accès.
             partie 1 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_5a35fd01.png

    2. Sélectionnez l’utilisateur Public souhaité : automatiquement son identifiant est affiché dans la boîte de propriétés de l'application.
             partie 1 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_5da29aab.png

    3. Cliquez sur partie 1 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_3cd7683c.png pour supprimer l’utilisateur Public : automatiquement, l’application repasse en mode Privé.

Fonctionnement au niveau des pages

  • Chaque page de l'application peut être déclarée publique (accessible à n'importe quel utilisateur de l'application, sans se connecter) ou privée (accessible uniquement si l'utilisateur de l'application se connecte), à l'exception de la première page qui doit nécessairement être publique (point d’entrée dans l’application).
             Example documentation icon FR.png  Accès sans connexion à des indicateurs publics et à la base de connaissance Product name - ev itsm.png ; Accès avec connexion pour afficher Mes incidents
     
  • Un utilisateur d'une application contenant à la fois des pages publiques et des pages privées peut naviguer librement sur toutes les pages publiques. Lorsqu'il tente d'accéder à une page privée, la boîte de login est affichée.
             partie 1 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_1c5eee46.png
     
  • La gestion des pages publiques / privées s'effectue au niveau des propriétés des pages.
             partie 1 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m7ac3519b.png
    • partie 1 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_3841272f.png identifie une page privée ; partie 1 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m1c01f675.png identifie une page publique.
    • La première page n’est pas paramétrable.
    • Pour accéder aux fonctions de duplication et de suppression, cliquez sur partie 1 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m328c042d.png.
               partie 1 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_6d2a8061.png

Barre principale d'une application

        partie 2 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m3ebf7db4.png

Masquage global de la barre principale

La totalité de la barre principale de l’application, visible en mode Exécution, peut maintenant être masquée via une nouvelle propriété Show Main Toolbar ajoutée dans la boîte de propriétés et dans la boîte de création de raccourci.
Note : Le raccourci va surcharger le choix éventuel défini au niveau de l’application.

        partie 2 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_a12aabf.png
         partie 2 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m1e70c954.png

Masquage du menu des applications

Le menu partie 2 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_6adea54b.png permettant d’accéder à la liste des autres applications en mode Exécution peut maintenant être masqué via une nouvelle propriété Show App List ajoutée dans la boite de propriétés.
Note : Le fait de cacher le menu d'accès améliore les performances lors du lancement de l’application car la liste des autres applications n'est alors pas chargée.
         partie 2 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_5fa06863.png

Nouveau widget Authentification

Ce nouveau widget, disponible dans la catégorie Basic, permet de positionner la zone d’authentification partie 2 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_4b26d70d.png habituellement située en haut et à droite dans la barre principale de l'application n’importe où sur l’écran.
         partie 2 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m5ca445a5.png
         partie 2 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m793127c2.png

  • Les caractéristiques du widget Authentification sont identiques à la partie Authentification de la galerie.
  • Les propriétés du widget permettent d'afficher ou de masquer les composants de la barre d’authentification (l’avatar, le nom de la personne connectée et son profil, le bouton Logout Logout button.png), et de définir l'alignement de la zone d'authentification.
             partie 2 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m2f083c0b.png
  • Les propriétés Theme permettent de préciser les tailles et les couleurs des composants.
             partie 2 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_5866f63.png

Homogénéisation du Studio

Le Color Picker

Plusieurs outils de sélection des couleurs étaient accessibles dans les versions précédentes en fonction du contexte. Une seule boîte de sélection des couleurs est maintenant accessible depuis tous les endroits du Studio.
         partie 3 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_3351ce40.png

  • Ce nouveau Color Picker permet de sélectionner directement une couleur.
  • Le mode Avancé partie 3 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_42951612.png permet de sélectionner la couleur à appliquer via son code hexadécimal précédé d'un # (ex. : #0b0df0 pour la couleur Bleu) ou via son nom pour les couleurs standard (ex. : red pour la couleur Rouge).
             partie 3 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_14dd16ff.png

Le Font Picker

La boîte de sélection des polices a été homogénéisée pour avoir la même apparence quel que soit l'endroit d'où elle est lancée. Elle permet de sélectionner la police à utiliser et propose aussi un mode Recherche d'une police à partir de son nom.
Note : Les modifications de taille sont reportées en temps réel sur la page courante.

        partie 3 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m7ff76886.png

  • Propriété Select Font   v   : Ouvre la liste des polices.
    • La première partie de la liste contient les polices les plus courantes tandis que la deuxième partie contient une liste importante de polices moins courantes.
    • La zone de recherche permet de filtrer automatiquement les polices.
               partie 3 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_mfa9134e.png
  • Propriété Select Size   v   : Affiche une réglette permettant de sélectionner la taille souhaitée. Il est aussi possible de saisir la valeur dans la zone d’édition.
             partie 3 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_3ba762fe.png

L'Image Picker

L’outil de sélection d’images est maintenant disponible à la fois sur les menus et dans l’éditeur de texte.

  • L'onglet Icons Gallery vous permet de sélectionner une image disponible dans la galerie.
             partie 3 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_4f05d678.png
  • L'onglet Uploaded Images vous permet de sélectionner une icône parmi les images disponibles sur votre serveur ou en téléchargeant un fichier local. Une fois l'image sélectionnée, celle-ci est envoyée sur le serveur et devient disponible dans la liste des images. Note : Les images SVG sont maintenant supportées.
             partie 3 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_191b168b.png
    • partie 3 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_2447a3c9.png : permet de sélectionner une image sur l'un de vos disques.
    • partie 3 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m6dbab01.png: permet de sélectionner une image à partir de son adresse URL.
    • L’image en cours de sélection est indiquée par partie 3 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m20354cc2.png.
               partie 3 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_192a5510.png
    • Vous pouvez supprimer une image téléchargée en la survolant avec la souris puis en cliquant sur partie 3 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m4ccef0eb.png et en confirmant au message d'avertissement. Note : Les images envoyées sur le serveur sont locales à l’application. Si vous supprimez par erreur une image, seule l'application en cours est impactée.
               partie 3 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_191b168b - delete.png
  • L'onglet Image Link vous permet d'insérer rapidement une image à partir de son URL. Le lien de l'image est conservé dans le code Html, à la différence du bouton partie 3 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m6dbab01.png dans l'onglet Uploaded Images qui encode l’image en base 64.
             partie 3 wiki Easyvista Service Apps 2016_DECEMBER_FR_html Image Link.png

Implémentation dans l’éditeur de texte

Lorsque vous cliquez sur l'icône partie 3 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m88d5d23.png, le nouvel Image Picker est ouvert.
         partie 3 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_1980f403.png

Intégration dans le widget Menu

Lorsque vous cliquez sur l'icône associée à un élément de menu, le nouvel Image Picker est ouvert.
         partie 3 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_16e49ce4.png

Il peut également être ouvert depuis les propriétés d’un élément de menu.
         partie 3 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_2c5ae363.png

Améliorations sur l’éditeur de texte des applications

Nouveau gestionnaire d’images

La nouvelle gestion des images est décrite dans la section Image Picker.

Gestion des liens spéciaux via le Data Picker

Le Data Picker, qui permet de sélectionner un champ Product name - ev itsm.png, permet maintenant d’indiquer qu’il s’agit d’une image, d'un e-mail, d’un numéro de téléphone/skype via la nouvelle propriété special link tags.
         partie 3 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m50fcafec.png

Le code Html inséré est le suivant :

<img src="#[FIELD('xxxxxxx')]#" class="fr-draggable">
<tel:#[FIELD('xxxxxxx')]#>
<mailto:#[FIELD('xxxxxxx')]#>
<skype:#[FIELD('xxxxxxx')]#>

Paramétrage des couleurs des boutons

Lorsqu’un bouton est généré via l’éditeur de texte, il est maintenant possible d’en définir complètement les couleurs (en mode normal et lors du survol de la souris) via de nouvelles propriétés sous la zone Link / Button.
         partie 3 wiki Easyvista Service Apps 2016_DECEMBER_FR_html Button color.png

Nouveautés sur les datasources et widgets

Datasources

Optimisation du chargement

Dans les versions précédentes, tous les datasources étaient ouverts à l’ouverture d’une application en mode Conception. Dorénavant, seuls les datasources utilisés sur la page courante sont ouverts.

Compteur d’utilisation

Un compteur d’utilisation figure maintenant dans la liste des datasources utilisés dans une application.
         partie 4 1 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_513ef39f.png

En survolant le compteur, vous pouvez visualiser tous les widgets utilisant le datasource.
         partie 4 1 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_432b3ffa.png

Widget Menu

  • Des menus circulaires peuvent maintenant être créés via la nouvelle propriété Cell Border Radius permettant de définir le rayon du menu.
             partie 4 1 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_mb81fc63.png
             partie 4 1 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_63c77861.png
  • Les propriétés permettant de définir les couleurs à utiliser sur les éléments de menu lors du survol avec la souris ont été étendues.
             partie 4 1 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_57933f34.png
             partie 4 1 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m2939cef8.png
  • Le choix de l'icône du menu utilise le nouvel outil de gestion des images décrit dans la section Image Picker.

Style natif sur mobile

Lorsque vous utilisez un widget Search ou un widget Tab, une nouvelle propriété Device Native Style vous permet de demander que l’apparence de ces widgets prennent l’apparence des composants standard s’ils sont exécutés sur un iPhone ou un téléphone Android, et conservent leur apparence habituelle dans les autres cas de figure.
         partie 4 21 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_2bec89be.png
         partie 4 21 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_7848cb80.png

Widget Tab

  • La liste des onglets peut maintenant prendre différentes formes, via une nouvelle propriété Scrollable Tabs.
             partie 4 21 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m441d4ce2.png
  • Présentation habituelle, de la gauche vers la droite puis du haut vers le bas.
             partie 4 21 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m30976b32.png
  • Présentation en mode Scrolling, avec affichage sur une seule ligne, et la possibilité de faire défiler les onglets avec la souris (via les flèches gauche et droite) ou avec le doigt si le matériel le permet.
             partie 4 21 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_2b493946.png
  • depuis l'éditeur de texte, vous pouvez maintenant placer sur chaque onglet des images (via un Image Picker intégré) ou tout autre élément (via du code Html).
             partie 4 21 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_62729c6.png
             partie 4 21 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_6db1cc3f.png

    Note : Pour que la sélection soit correctement gérée sur les éventuelles images ajoutées, passez par l’utilisation d’un pictogramme de la galerie des icônes plutôt que par une image. Les icônes étant assimilées à des polices, elles bénéficient du même traitement graphique.

    • Sélection correcte appliquée à l'icône Cloud
               partie 4 21 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_3091e8f5.png
    • Sélection incorrecte appliquée à une image
               partie 4 21 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m54e7ccd8.png

Paramétrages spécifiques pour les mobiles

Paramétrage de l’affichage des lignes sur mobile

Le Responsive design, qui agit automatiquement pour adapter l’affichage sur les différents types de support de visualisation (navigateur sur un PC, une tablette ou un mobile), peut prendre certaines décisions peu judicieuses, en particulier sur mobile : l’automatisme va avoir en particulier tendance à positionner systématiquement les widgets les uns sous les autres.

        Example documentation icon FR.png  L'application ci-dessous contient un logo et un widget Authentification sur la 1ère ligne, puis un ensemble d'icônes positionnées sur la 2ème ligne.
         partie 4 23 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m2641a86a.png

Sur mobile, le widget Authentification est renvoyé au-dessous du logo.
         partie 4 23 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m328316c9.png

Il est maintenant possible d’agir sur le comportement des lignes en offrant la possibilité de garder solidaires les widgets contenus sur la ligne.
         partie 4 23 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_7f338e8.png

Comment s'effectue le paramétrage

  • Au niveau de chaque ligne, un nouvel indicateur partie 4 23 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_6ec69fd1.png partie 4 23 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m6be8c7b.png est ajouté, géré par les nouvelles options Stack on Small / Single Row on Small du menu contextuel de chaque ligne.
             partie 4 23 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_7aad4a87.png
  • Le mode actuel Stack on Small partie 4 23 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_6ec69fd1.png est le mode par défaut, qui place automatiquement les widgets les uns en dessous des autres.
             partie 4 23 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_27663906
  • Le nouveau mode Single Row on Small partie 4 23 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m6be8c7b.png force le placement des widgets les uns à la droite des autres pour la ligne concernée.
             partie 4 23 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m1f6d6ed7.png

Mode d’affichage du Studio écran large / mobile

Certains widgets peuvent être affichés uniquement sur mobile et/ou sur desktop via les options actuelles.
          Small options device.png

Dans les versions précédentes, les widgets destinés à s’afficher uniquement sur mobile disparaissaient du Studio ; ils étaient accessibles uniquement depuis la liste des widgets. 2 nouvelles icônes dans la barre d'outils sont maintenant disponibles permettant d'afficher ou de masquer ces widgets. 

  • En mode Desktop, tous les widgets sont affichés sauf ceux qui ne s’affichent que sur mobile.
  • En mode Mobile, tous les widgets sont affichés sauf ceux qui sont cachés en mode Mobile.
              Icons Small options device.png

Liens avec Product name - ev itsm - big.pngev|Service Manager

Nouveaux questionnaires supportés

Les nouvelles fonctions des questionnaires de la version la plus récente de Product name - ev itsm.png sont maintenant supportées : nouveau mode multi-sections, questions dépendantes des réponses précédentes, composants permettant de réaliser des enquêtes de type Survey.
Reportez-vous au document de sortie Product name - ev itsm.png H2 2016 - Présentation des nouveautés pour toutes les informations sur ces questionnaires.

        Open url.png  voir également Bonnes pratiques Questionnaires

Assistant Clôture des incidents

Un nouvel assistant permet de clôturer les incidents Product name - ev itsm.png via un custom widget. Sa mise en place est identique au custom widget Update Incident Wizard implémenté dans la version précédente de Product name - ev sas.png.
Reportez-vous au document de sortie Product name - ev sas.png H1 2016 - Présentation des nouveautés pour toutes les informations sur cet assistant.

        Open url.png  voir également Description du custom widget Update Incident Wizard

        partie 5 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m5a1c34f5.png

Afficher aucune donnée lorsque le datasource n’est pas filtré

Lorsqu'un widget Dataviewer est corrélé à un widget Search Filter, il est maintenant possible de ne rien afficher lorsqu'aucune recherche n’a été effectuée, ce qui améliore par ailleurs les performances.

  • Par défaut, toutes les données sont affichées dans le dataviewer lorsqu'aucune recherche n’est lancée.
             partie 5 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_3df2d714.png
  • Pour activer cette nouvelle fonctionnalité, utilisez la nouvelle case à cocher Force Search To Get Data des datasources liés à Product name - ev itsm.png, permettant d'éviter qu'un datasource non filtré ne remonte toutes les données.
             partie 5 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_m4c168d2d.png

Optimisations

Chargement des autres applications

Le temps de lancement des applications accessibles via le menu partie 5 wiki Easyvista Service Apps 2016_DECEMBER_FR_html_6adea54b.png (affiché dans la barre principale de l'application en mode Exécution) a été optimisé en ne chargeant pas ces applications si la barre principale n’est pas affichée ou si le menu d’accès est masqué.

Autres optimisations

  • Baisse de l’empreinte mémoire des applications.
  • Réduction du nombre d'échanges entre une application utilisant des datasources Product name - ev itsm.png et le serveur Product name - ev itsm.png.
Tags:
Modifié par Utilisateur inconnu le 2018/02/06 19:49
Créé par Administrator XWiki le 2017/01/20 10:05

Raccourcis

L'actualité mensuelle
•  Newsletter

Tous les changements
•  Service Manager
•  Service Apps
•  Self Help

Glossaire

Powered by XWiki ©, EasyVista 2020