Aller au contenu principal
Type
Application mobile / autres
Client
Securitas
Mise en ligne
2014
Univers
Services

Après la réalisation du site mobile Profession Securitas dédié aux équipes, l’Agence LunaWeb continue d’accompagner Securitas France sur le digital. Au menu de ce début d’année, la refonte du site Infos Securitas, entièrement dédié à la communication des actualités et dossiers thématiques autour de l’activité des différents métiers du Groupe Securitas.

À destination des clients et prospects, ce « web-magazine » ventile, à fréquence bimestriel, de l’information récente et qualifiée autour de cas clients, de billets d’expertise sur des problématiques métiers pointues, les actualités du Groupe, etc.

Il a pour vocation de présenter la large gamme de services et expertises de Securitas France ; par le biais de contenus à forte valeur ajoutée et toujours basée sur des cas terrain. Le client y trouvera l’information utile et fiable pour la sécurité / la sûreté de son entreprise.

Infos-Securitas-recherches-graphiques

Côté support web, l’objectif de cette refonte était multiple :

  • challenger l’organisation des contenus et l’architecture de l’outil,
  • augmenter la visibilité de ces contenus très qualifiés, et par là-même contribuer à l’émergence des expertises métiers,
  • proposer un design adapté à tous les modes de lecture, notamment en mobilité,
  • initier une charte digitale fidèle aux codes de la marque, en proposant des innovations ergonomiques et graphiques utiles à l’utilisateur final.

Sur le plan technique, qui dit « webzine » dit capacité à faire vivre le support très régulièrement afin d’alimenter l’audience en contenus frais, et proposer des outils de mise en relation simples et efficaces.

Quel process utiliser ?

Pour l’ensemble du projet et de l’accompagnement, nous avons commencé par un travail d’analyse et de contextualisation ; consistant à :

  • définir l’ADN du Groupe en matière d’identité digitale,
  • s’imprégner des codes de sa communication,
  • rechercher différents axes pour le design, l’expérience utilisateur, en développant un vocabulaire dédié au web.

Après ce travail de recherche, un prototype HTML / CSS a très vite été produit, afin de valider nos différentes hypothèses graphiques, fonctionnelles et techniques, l’administrabilité de l’outil étant développé dans une seconde phase.

N’oublions pas que la contrainte de conception d’un outil en Responsive Design suppose de pouvoir, très tôt, réaliser une mise en situation des contenus et fonctionnalité d’un site sur chacun des terminaux cibles : PC, tablette et mobile, en testant bien entendu le rendu et les interactions sur différentes tailles, réclusions et orientations…

Recherche et création

Trouver un écrin adapté à ce type de problématique est ardu : il ne s’agit ni d’un blog, ni d’un site communautaire. C’est un magazine d’information en ligne.

Différentes recherches visuelles et fonctionnelles ont donc été effectuées, tenant compte de la rigueur de la charte graphique, et basé sur un principe de simplicité d’usage impératif. Différents éléments se sont imposés : le gris et blanc, l’épure, la photographie.

La nature des contenus, connue dès le départ, nous a conduit à réaliser un travail typographique important, en mettant en place un système utilisant des lettrines, des trames, du gris optique…

2-Infos-Securitas-Recherches-graphiques

Sur le concept global de cet outil, la nécessité absolue de rendre d’abord service à l’utilisateur —le lecteur de ce magazine web—  nous a motivé à mettre un accent tout particulier sur la lisibilité et la mise en scène des contenus. Nous nous sommes inspirés des liseuses en ligne (comme la tablette Kindle, ou le dispositif Readability), dans leur capacité à faire abstraction des outils de navigation pour laisser l’utilisateur se concentrer sur le contenu, rien que le contenu.

Infos-Securitas-Recherches-wirframes

Cette phase de conception fait, très tôt, intervenir la problématique de l’interaction utilisateur. On ne conçoit donc plus 100% « à plat », sur des maquettes graphiques ou ergonomiques (dites wireframes), car les enjeux de la navigation tactile et multi-écrans nous imposent de raffiner progressivement un produit brut et basique jusqu’à obtenir le prototype le plus abouti ; lequel peut alors être décliné en version finale.

Petit à petit, en réalisant des choix selon le contexte d’usage (comment naviguer au doigt sur mobile, comment afficher/masquer la fonctionnalité selon les dimensions de l’espace d’affichage, etc.), nous avons constitué un produit dont le contenant s’adapte aux contenus, lesquels ont là aussi dû subir une petite « mise en conformité ergonomique ».

Le résultat

Après quelques semaines, on obtient un bien joli magazine en ligne ; lequel laisse la part belle aux contenus, mais aussi à la photographie, proposant à la fois une lecture linéaire (par numéros) et transversale (selon le thème choisi).

Le web-magazine Infos Securitas vu sur tablette

Un très grand merci à l’équipe Marketing et Communication de Securitas pour sa collaboration et sa disponibilité, ce projet exploratoire fut un plaisir partagé !