Page tree

Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Ayant évolué pas-à-pas à partir d’un design embryonnaire et vieux de six ans, le look actuel Le look de la vente en ligne SecuTix était figé, limité par des concepts qui ne correspondent plus aux tendances actuelles. Il avait besoin d’un nouveau look beaucoup fait peau neuve! A la fois plus frais, plus moderne et plus sobre, le nouveau thème graphique est aligné avec les tendances actuelles. Voici donc Equilibrium, un thème tout en harmonie et en équilibre qui va changer la vie l'expérience de vos internautes. 

Sélection de places Création de compte Récapitulatif de commande Dossier de commande

Un thème moderne et équilibré

Equilibrium est bien plus qu'une simple couche de peinturegraphique. Ce nouveau thème graphique a été l'occasion de est destiné à créer une meilleure expérience pour les vos utilisateurs. Le poids visuel entres entre les différentes informations à l'écran a été entièrement repensé pour créer une hiérarchie plus claire. Conséquence: tout semble plus équilibré. Au fil du temps, la complexité des pages avait augmenté et il était impératif de d'avoir , ce qui donne une impression d'équilibre. L'adoption d'un langage visuel plus en harmonie afin harmonieux permet de véhiculer toutes ces informations et réduit significativement la complexité des pages. L'espacement inter-éléments a été augmenté afin de mieux souligner le rythme du contenu des pages , ainsi que et de les laisser respirer vos contenus. La lecture de l'information s'en trouve facilitée. Cette réflexion a également été l'occasion de rendre le visuel plus sobre, avec des plus grandes notamment grâce au recours à des zones de blancs. Ces choix amènent de meilleurs repères aux permettent de mieux repérer les contenus imbriqués.

Equilibrium se veut donc plus moderne, prenant inspiration dans . Il s'inspire de la tendance du flat - design et notamment dans du Material Design, l'ensemble de règles de design proposées par Google. Pour accompagner cette évolution, Equilibrium a été construit autour de bâti sur la police de caractère Open Sans, crée créée par Steve Matteson et mise à disposition gratuitement par Google Fonts. C'est une police optimisée Optimisée pour le web et les interfaces mobiles, qui a cette interface propose une excellente caractéristique de lisibilité dans ses des lettres , et qui se décline en cinq épaisseurs.

Pour terminer, la Afin de remédier à une largeur de base du thème actuel était devenue trop petite. La qui devenait insuffisante, la colonne centrale de contenu passe donc de 700px à 970px, pour une . La mise en page globale qui utilise désormais 1220px sur les grands écrans. 

Au final, c'est un ticketshop plus moderne qui s'offre à vos internautes.

La

customisation

personnalisation graphique évolue

Tout comme avec le thème classique SecuTix, Equilibrium peut être adapté graphiquement afin de coller refléter votre charte graphique au plus près à votre charte graphique

Pendant tout Durant toute la période de validité de PizBernina V1, vous aurez le choix entre l'utilisation du thème classique et Equilibrium. La sélection s'opère sur la page "Thème internet" du point de vente concerné, où deux radio-buttons permettent la bascule. Pour des raisons de retrorétro-compatibilité, les champs personnalisables affichés (tels que couleur, image de fond, arrondi des bords, etc.) n'ont pas changés changé dans l'écran de paramètrageparamétrage; en revanche, ils ne produisent plus exactement les mêmes résultats. Ainsi, avant de basculer sur vers Equilibrium, nous vous recommandons de procéder à un reset (lien disponible en haut à droite de la page).

Info

Veuillez noter que le thème classique ne sera disponible que pour une période limitée. Nous vous encourageons fortement donc à procéder à la migration sur le nouveau thème durant PizBernina V1.

Recommandations d'usage

Afin de Voici une liste de recommandations d'usage pour profiter au maximum de l'élégance d'Equilibrium, sans le dénaturer mais tout en véhiculant votre identité visuelle, voici une liste de recommandations d'usage.

Police de caractère
Avec l'élargissement de la colonne centrale qui s'élargit, la mise en page gagne en flexibilité: vous pouvez désormais changer la police pour toutes les textes , et pas uniquement les titres.

Unité des couleurs de fond
Un des éléments fort forts de ce nouveau thème est l'unité dans le choix des couleurs. De ce fait, nous vous encourageons à utiliser la même couleur de fond pour la zone principale et pour le fond des titres. D'ailleurs si Si vous modifiez la couleur de fond principale , mais laissez le fond de titres vides, celui-ci s'adaptera automatiquement au fond principal.  

Similairement, il Il est important de comprendre qu'il y a existe trois couleurs de fond qui touchent pour les contenus. En , en anglais, "Body background color", "Background color" et "Embedded area background color". Ces trois variables servent à permettent de définir:

  • la couleur de fond principale du contenu
,
  • la couleur
utilisées
  • utilisée pour les alternances (par exemple: le fond alterne entre deux catégories de places, parfois appelé effet
pijama
  • pyjama)
ainsi que
  • la couleur de contenus imbriqués.

Pour un résultat efficaceoptimal, nous pensons qu'il est préférable de choisir trois couleurs proches différentiées mais différentes, et qui évoluent dans une seule la même direction: par exemple, les couleurs de base d'Equilibrium sont un blanc pur, un gris très léger et un gris un poil peu plus appuyé. À noter: la couleur imbriquée sert également de couleur pour les bords dans le thème. Il est préférable qu'elle se distingue un peu de la couleur principale du fond.

Images de fond
Il est toujours possible de mettre une de choisir la même image de fond globale à pour toute la page, mais nous attirons votre attention que si elle . Toutefois, si celle-ci est trop contrastée, ou si vous mettez ajoutez des effets de transparence sur les couleurs de fond internes, vous réduirez risquez de réduire la lisibilité des contenus.
L'image de fond sur la zone centrale n'est plus disponible. 

Boutons et liens
Equilibrium apporte davantage de granularité aux boutons d'appel à action (Call to action).

Les actions principales sont toujours représentées La granularité des appels à actions a été revue et augmentée. Les actions principales restent représentés par des boutons de couleur distinctive. En revanche, les actions secondaires se déclinent désormais en trois niveaux.

  • Les plus importantes sont
en
  • de couleur distinctive et
accompagnées
  • s'accompagnent d'une icône.
  • Les actions simples
perdent l'icône. Pour terminer, les
  • n'ont pas d'icône associée
  • Les actions qui ne sont pas souhaitables (
ex:
  • par exemple, une annulation) ne sont pas en couleur
,
  • et
prennent simplement
  • apparaissent dans la couleur du texte standard.

Signalons également que la possibilité d'arrondisne arrondi s'applique plus qu'au désormais à d'autres domaines que les boutons.

Couleur du texte par défaut
La variable de couleur du texte par défaut s'applique sur à de très nombreux éléments, mais parfois avec de petits effets d'allègement (au-travers d'une légère opacité). Ne vous étonnez donc pas si certains éléments apparaissent un poil peu plus clairs ou plus foncés: c'est un effet de nuance voulu par recherché dans Equilibrium.

Mapping des couleurs

L'image suivante décrit précisément quelles les variables qui influencent quelles les aspects visuels dans Equilibrium. Un Retrouvez ces variables en consultant le document: equilibrium-color-mapping.pdf.

Equilibrium Color Mapping