Les administrateurs peuvent changer la marque de l'expérience du signataire de plusieurs façons. En particulier, les administrateurs peuvent modifier les éléments suivants :

Par défaut, l'aspect et la convivialité de l'Signer Experience adhère à la marque de OneSpan Sign :

La mise à jour du logo et de la palette de couleurs permet d'insérer les éléments de l'image de marque de votre organisation dans l'Signer Experience. Par exemple :

Renouvellement de l'image de marque de l'OSS avec un nouveau schéma de couleurs et un nouveau logo

Personnalisation du logo

Les logos de compte dans le Signer Experience peuvent être configurés indépendamment pour toutes les langues prises en charge. Pour toutes les langues de votre compte qui n'ont pas de logo désigné sur cet écran, le système utilisera par défaut la version anglaise du logo pour cette langue.

Spécifications du logo

Propriété du logo Spécifications
Taille du fichier 1 Mo maximum
Format de fichier

.jpg

.png

.gif

.bmp

.svg

Dimensions optimales

258px par 40px

Si votre logo est plus grand que ces dimensions, l'image sera réduite pour s'adapter à l'espace alloué. Si votre logo est plus petit que ces dimensions, il sera étiré pour remplir l'espace alloué.

Contexte Un fond transparent est préférable, mais pas obligatoire

Pour modifier le logo qui sera utilisé lors de l'Signer Experience :

  1. Allez sur Admin > Personnalisation de la signature.
  2. Glissez et déposez votre logo dans la section de téléversementt de la page, ou cherchez l'emplacement de votre logo et sélectionnez-le.
  3. Continuez à ajouter des logos pour chaque langue de votre compte (facultatif).
  4. Sélectionnez la langue appropriée pour chaque logo téléversé.
  5. Cliquez sur Mettre à jour les logos.
  6. Cliquez sur Aperçu pour revoir vos modifications, en utilisant le sélecteur de langue pour vérifier les changements de logo pour chaque langue.

Renouvellement de l'image de marque de l'OSS avec un logo personnalisé

Utilisez le bouton Aperçu pour visualiser les modifications apportées à cette page. Utilisez les icônes Ordinateur de bureau, Tablette et Mobile en haut de la fenêtre d'aperçu pour voir comment vos modifications s'afficheront dans chaque format.

Associations de couleurs

Les couleurs suivantes peuvent être mises à jour avec votre schéma de couleurs personnalisé :

  • Primaire
  • Alertes (Succès, Avertissement, Erreur, Info)
  • Bouton de signature

Les valeurs de couleur peuvent être formatées en Hex ou RGBA.

Les couleurs par défaut sont conformes aux normes d'accessibilité. Si vous mettez à jour ces couleurs, vous devez vous assurer que la conformité ADA est maintenue.

Association de couleurs Éléments affectés
Primaire

Tous les boutons et les éléments de menu de niveau supérieur sont affichés dans la couleur primaire. La couleur de survol de ces éléments est une nuance plus claire de la couleur primaire (calculée par le système).

Succès

Cette couleur est utilisée pour les alertes de réussite et la bordure de la boîte de signature acceptée.

Avertissement

Cette couleur est utilisée pour les alertes d'avertissement.

Erreur Cette couleur est utilisée pour les alertes d'erreur et les conseils de l'outil de validation des champs.
Information

Cette couleur est utilisée pour les alertes d'information.

Signature

Définit la couleur des boîtes de signature avant qu'elles ne soient acceptées. Notez que les boutons de signature et de signature facultative ont un niveau d'opacité qui leur est appliqué, pour permettre à tout texte d'arrière-plan d'être vu. Ainsi, les champs de signature peuvent apparaître légèrement différents des autres boîtes qui utilisent la même couleur.

Pour ajouter des couleurs personnalisées à l'Signer Experience :

  1. Allez sur Admin > Personnalisation de la signature.
  2. Faites défiler l'écran pour trouver la section Couleurs .
  3. Cliquez sur le carré coloré de l'élément que vous voulez modifier (Primaire, Succès, etc.).
  4. Saisissez la valeur hexadécimale ou les valeurs RGBA de votre couleur personnalisée. En option, vous pouvez cliquer dans le panneau de couleur pour sélectionner votre choix de couleur.
  5. Répétez les étapes ci-dessus pour tous les changements de couleur que vous devez effectuer.
  6. Cliquez sur Mettre à jour les couleurs.
  7. Cliquez sur Aperçu pour revoir vos modifications.

Autres options de personnalisation

Il existe d'autres moyens de personnaliser votre compte OneSpan Sign à l'image de votre organisation :

Les intégrateurs peuvent modifier et/ou supprimer certains éléments visuels de l'Signer Experience pour permettre une expérience client de marque. Vous pouvez utiliser ces options pour intégrer de manière transparente le processus de signature à votre propre application.

Les exemples de code suivants illustrent la manière de spécifier les couleurs primaires et secondaires de l'Signer Experience. Ils définissent l'aspect général de l'interface, également appelé « image de marque ».

package com.silanis.esl.sdk.examples;

import java.util.Map;

public class SigningStyleExample extends SDKSample {

    public Map<String, Object> createdSigningThemes, retrievedSigningThemes, updatedSigningThemes, removedSigningThemes;
    public String signingThemesStringToCreate = "{\"default\":{\"color\":{\"primary\":\"#5940C3\"}}}";
    public String signingThemesStringToUpdate = "{\"default\":{\"color\":{\"primary\":\"#5940C3\",\"secondary\": \"#F31C8B\"}}}";

    public static void main(String... args) {
        new SigningStyleExample().run();
    }

    @Override
    protected void execute() {

        // Create default signing theme
        createdSigningThemes = eslClient.getSigningStyleService().createSigningThemes(signingThemesStringToCreate);

        // Get default signing theme
        retrievedSigningThemes = eslClient.getSigningStyleService().getSigningThemes();

        // Update the default signing theme
        updatedSigningThemes = eslClient.getSigningStyleService().updateSigningThemes(signingThemesStringToUpdate);

        // Delete default signing theme
        eslClient.getSigningStyleService().deleteSigningThemes();

        removedSigningThemes = eslClient.getSigningStyleService().getSigningThemes();
    }
}

Les intégrateurs peuvent modifier et/ou supprimer certains éléments visuels de l'Signer Experience pour permettre une expérience client de marque. Vous pouvez utiliser ces options pour intégrer de manière transparente le processus de signature à votre propre application.

Les exemples de code suivants illustrent la manière de spécifier les couleurs primaires et secondaires de l'Signer Experience. Ils définissent l'aspect général de l'interface, également appelé « image de marque ».

using System;
using System.IO;
using Silanis.ESL.SDK;
using Silanis.ESL.SDK.Builder;
using System.Collections.Generic;

namespace SDK.Examples
{
    public class SigningStyleExample : SDKSample
    {
        public static void Main (string [] args)
        {
            new SigningStyleExample ().Run ();
        }

        public IDictionary<string, object> createdSigningThemes, retrievedSigningThemes, updatedSigningThemes, removedSigningThemes;
        public string signingThemesStringToCreate = "{\"default\":{\"color\":{\"primary\":\"#5940C3\"}}}";
        public string signingThemesStringToUpdate = "{\"default\":{\"color\":{\"primary\":\"#5940C3\",\"secondary\": \"#F31C8B\"}}}";

        override public void Execute ()
        {
            // Create default signing theme
            createdSigningThemes = eslClient.GetSigningStyleService ().CreateSigningThemes (signingThemesStringToCreate);

            // Get default signing theme
            retrievedSigningThemes = eslClient.GetSigningStyleService ().GetSigningThemes ();

            // Update the default signing theme
            updatedSigningThemes = eslClient.GetSigningStyleService ().UpdateSigningThemes (signingThemesStringToUpdate);

            // Delete default signing theme
            eslClient.GetSigningStyleService ().DeleteSigningThemes ();

            removedSigningThemes = eslClient.GetSigningStyleService ().GetSigningThemes ();
        }
    }
}