Sterimed - leader mondial des solutions d'emballage stériles

Création d'une application web pour salons et visites commerciales

Job

Application commerciale web

Client

Sterimed

Année

2019

Sterimed a sollicité l’agence pour la création d’une application web utilisée sur les salons et en rdv commerciaux.

Celle-ci se lance en mode plein écran (comme une app) : le navigateur internet est alors invisible.
Le commercial accède à l’application via une icône personnalisée, placée sur le bureau de sa tablette.
Une connexion internet est nécessaire pour profiter de certaines possibilités.

Elle compte sept écrans principaux. Chaque écran est atteignable grâce à un bouton dédié sur l’écran d’accueil.
La barre d’outils supérieure permet la gestion de deux listes. Chacune fonctionne comme le panier d’un site marchand.
Lorsque l’utilisateur consulte un écran, un bouton apparaît à gauche dans la barre d’outils. Il permet de revenir à l’écran d’accueil.

sterimed trade application mockup

Ecran d’accueil de l’application web responsive

Application web présentation de produits

Ecran présentation de produits

1 – Présentation des derniers produits (Sterimed innovates)

Chaque produit est présenté grâce à une vidéo et un court texte. A sa suite, un ensemble de boutons permet les actions suivantes :

1 – 1 Accéder à des plaquettes détaillées

Pour des informations détaillées sur le produit, il est possible de consulter sa plaquette au format pdf.
L’intégration d’une bibliothèque spécifique a contourné les problèmes connus d’ouverture de pdfs sur iPad. Elle affiche directement le pdf dans une pop-up au dessus de la page courante.
Ainsi la lecture de pdfs fonctionne quelque soit la tablette utilisée, même si aucun lecteur pdf n’est présent.
L’utilisateur retourne sur la page en cours en cliquant simplement sur l’icône “fermer” de cette pop-up.

1 – 2 Envoyer les liens de téléchargement de ces plaquettes

Lorsqu’une plaquette intéresse l’utilisateur, l’application lui offre la possibilité de l’envoyer dans sa messagerie. Un bouton “Send this pdf to your e-mail” figure ainsi sous chaque produit.
Une liste centralise les pdfs sélectionnés facilitant ainsi la gestion de ces derniers, notamment la suppression. Elle est visible dans l’écran “Your requested pdfs”.
Une fois la liste complétée, l’utilisateur saisit son adresse e-mail. Le message est alors automatiquement envoyé à cette adresse.
Pour une délivrabilité optimale du message, le message contient un ou plusieurs liens de téléchargement et non le ou les fichiers eux-mêmes.
Le répertoire contenant les fichiers est protégé afin que l’utilisateur n’est accès qu’aux fichiers demandés.

Application web envoi de pdf

Formulaire d’envoi de pdfs via e-mail

Application web commande d'échantillons

Formulaire de demande d’échantillons

1 – 3 Demander un échantillon du produit

Au fur et à mesure de sa navigation, l’utilisateur peut cliquer sur le bouton “Ask this product sample”. Comme pour les pdfs, une liste particulière centralise ses demandes. Une fois rempli le formulaire, ces informations sont stockées en base de données. Le formulaire est minimal pour une saisie rapide.
Le salon terminé, le service dédié extrait la liste des demandes afin de procéder aux envois.

2 – Consultation de plaquettes commerciales (Sterimed library)

L’écran permet la consultation des principales plaquettes de l’entreprise. Une douzaine ont été intégrées.
Pour chaque plaquette présentée, les fonctionnalités offertes sont identiques à celles figurant sur l’écran “Sterimed innovates” :

  • consultation du pdf attaché au-dessus de la page et indépendamment de tout lecteur externe,
  • envoi de liens de téléchargement à l’adresse e-mail indiquée par l’utilisateur.

La liste d’envoi de liens est commune à toute l’application. Ainsi son utilisation est simplifiée et la saisie du formulaire faite une seule fois, pour une expérience utilisateur réussie !

Application web plaquettes commerciales

Ecran de consultation des plaquettes commerciales

Application web sondage

Ecran sondage

3 – Participation à un sondage (Let us know what you think)

Le sondage est court pour ne pas décourager l’utilisateur. Il compte 8 questions.
Par souci de rapidité de réponse, les QCM et les échelles linéaires (évaluation de 1 à 5) ont été privilégiées. La réponse aux questions linéaires se fait grâce à des émoticônes colorées pour un côté plus “friendly”.
L’utilisateur est incité à soumettre le sondage grâce à une promesse.  Elle consiste à pouvoir visualiser les bonnes réponses dans l’écran de remerciement pour sa participation.
Chaque sondage est sauvegardé dans la base de données spécifique à l’application. Elle est hébergée sur le serveur Sterimed. On évite ainsi les solutions non propriétaires pour une meilleure maîtrise de l’outil, notamment un accès permanent aux données.
Ces dernières sont exportables au format excel.

4 – Lecture de vidéos (Sterimed cinema)

Sept vidéos sont consultables directement depuis l’application. Comme pour la consultation des pdfs, chacune s’ouvre dans une pop-up au-dessus de la page. Conserver ce type d’affichage quelque soit le média améliore l’expérience utilisateur.

5 – Présentation d’une application (Sterisheet app)

L’application Sterisheet est dédiée aux centres de stérilisation. Le film de présentation est intégré directement au sein de la page. Il se lance automatiquement à son ouverture.
Il est suivi d’un QR Code pointant vers sa page d’installation et d’une infographie récapitulant ses principales fonctionnalités. De façon incitative, le QR Code est répété en fin de page et chacun est suivi de la mention “Scan me!”.

6 – Présentation de la démarche écologique de l’entreprise (Save the earth)

Le contenu de la page est issu d’une plaquette non incluse dans l’écran “Sterimed librairy”. Il est néanmoins possible d’ajouter cette plaquette à sa liste d’envoi.
Un mini sondage est proposé en fin de page. Il s’agit de trois questions Oui/Non. Les réponses sont bien sûr stockées en base. Elles sont exportables en .xls pour une exploitation ultérieure.

Application web vidéos, app et écologie

Ecrans vidéos, présentation app et démarche écologique

Fonctionnalités supplémentaires

Un timer bascule l’application automatiquement vers l’écran d’accueil au bout de 3 minutes sans activité (interaction).
Lors du basculement, les listes sauvegardées sont remises à zéro. Ainsi cette fonctionnalité libère les commerciaux de la réinitialisation de l’application lorsqu’un visiteur abandonne sa cession. Bien utile lorsque les tablettes sont en libre-service sur un salon !

L’application est en conformité avec les RGPD. Dès l’écran d’accueil, l’utilisateur est invité à accepter les conditions d’utilisation. Si acceptation, chaque demande d’envoi de liens pdf est stockée dans la base de données. Ainsi les commerciaux connaissent les produits ou familles de produits qui intéressent vraiment leurs visiteurs. Ils peuvent recontacter ces derniers en connaissant leurs centres d’intérêt.
Enfin, comme il s’agit d’une application web, un id de suivi Analytics a été intégré pour analyser son trafic. Par exemple, quel écran a le plus intéressé les visiteurs.
Il est à noter que cette application est privée, à l’inverse d’un site internet.