Interactive Print Content Module Quickstart Le lien entre vos imprimés et le monde numérique DOCUMENTATION UTILISATEUR V 1.0 mai 2013
Table des matières Introduction 3 Prérequis 3 Connexion au système 3 Interface de base 4 Produits 4 Jauge de consommation 4 Liste des contenus ipc, onglet «Contents» 4 Liste des contenus ipc, onglet «Plugins» 4 Plugin concours 5 Plugin «Notifications» 6 Création d un contenu ipc 9 Interface «Contents» 11 Boutons d action sur le contenu ipc 11 Nouvelle couverture pour le contenu ipc 11 Statistiques du contenu 11 Processus de création du contenu ipc 12 Logiciel d édition des contenus - ipc Content Editor - Quickstart 13 Onglet «Quickstart» 14 Liste des templates disponibles 15 Actions sur les boutons 20 Publication de votre contenu 20 Lancement de votre contenu 20 Exemple d une application réalisée avec Quickstart 21
Introduction Ce document a pour objectif de vous présenter la solution ipc printeva + et son fonctionnement. ipc printeva+ est une solution développée pour BVA marketing direct SA par Practeo Media SA. Multimédia et multi-écrans, elle permet de créer rapidement et simplement des contenus interactifs. Grâce à l association d un code ipc printeva + (QR compatible) et d une nouvelle technologie, vous pouvez désormais créer un lien direct entre vos imprimés et le monde numérique. Le logiciel de mise en page en ligne est très simple. Vous trouverez ci-après toutes les explications détaillées pour une création de contenus en quelques clics! Prérequis Notre logiciel de création de contenus interactifs est un système de gestion en ligne, qui nécessite : 1. d une connexion Internet avec un navigateur Internet 2. du plugin Adobe Flash Player installé sur votre ordinateur (adresse d installation : http://get.adobe.com/fr/flashplayer/) 3. de l application ipc Scanner installée sur un smartphone ou une tablette sous Android ou ios (achat sur App Store ou Google Play). Connexion au système Pour commencer, vous devez vous connecter sur notre CMS (Content Management System) à l adresse http://datas.iqr.ch/ipccms avec le navigateur internet de votre choix et saisir votre nom d utilisateur et mot de passe.
Interface de base Après avoir saisi vos données de connexion, l interface suivante s affiche : Produits Jauges de consommation Liste des plugins Liste des contenus ipc Produits Le logiciel de mise en page ipc Quickstart s affiche dans le menu déroulant. Jauge de consommation Vous pouvez visualiser en temps réel la consommation engendrée par votre contenu. En effet, la jauge «Hosting» permet de suivre la taille disponible de votre hébergement et la jauge «Trafic» permet de suivre la consommation de vos clients ou utilisateurs. Liste des contenus ipc printeva +, onglet «Contents» Cet onglet affiche la liste de vos contenus ipc. Les possibilités de création et de gestion seront traitées plus loin dans ce document.
Liste des contenus ipc printeva +, onglet «Plugins» En cliquant sur cet onglet, les «plugins» à votre disposition sont affichés, à savoir : Plugin «Concours» Plugin «Notifications» Plugin concours Le plugin «Contests» permet la gestion complète de concours via la technologie ipc printeva +. En cliquant sur l icône «Contests» vous obtenez la liste des concours que vous avez créés. Pour ajouter un concours, vous pouvez cliquer sur le bouton «Add Contest».
Cliquez ensuite sur «Add Contest» pour ouvrir l éditeur. Complétez le champ avec le nom de votre concours (par exemple «Gagnez un ipad») et cliquez sur le bouton «Save». Le concours apparaît alors dans la liste. Nombre de participants Liste des participants au concours Nous verrons par la suite comment intégrer le concours dans votre contenu ipc. Plugin «Notifications» Afin de pouvoir avertir vos utilisateurs de nouveaux contenus ou pour les informer d une nouveauté, vous avez la possibilité d envoyer des notifications par le système «push». En activant les notifications pour un contenu (voir plus loin «Création d un contenu»), un message s affichera chez vos clients leur demandant s ils veulent recevoir les notifications (le message est personnalisable). En acceptant, l utilisateur s abonne gratuitement aux notifications «push» pour le contenu téléchargé et sera donc informé en temps voulu. Pour envoyer une notification «push», cliquez d abord sur l onglet «Plugins» puis sur le bouton «Notifications».
L interface suivante s affiche : Pour créer une notification «push», cliquez sur le bouton «Add Notification» et remplissez les champs suivants :
Send Date Message Content opening Send this message to all users subscribe those contents : Date d envoi du message, vous pouvez programmer à l avance des messages Le message que vous désirez envoyer (max 100 caractères) Vous pouvez indiquer le nom du contenu à ouvrir lorsque l utilisateur ouvre la notification (un nouveau contenu par exemple) Pour chaque contenu, des utilisateurs se sont inscrits aux pushs notifications. Vous pouvez définir à quels utilisateurs vous voulez envoyer la notification. Par exemple : à tous les utilisateurs qui se sont inscrits aux pushs notification pour le contenu «Concours pour gagner un ipad» et «Concours pour gagner une invitation à l avant-première». Date et heure de l envoi Enregistrez votre notification «push» en cliquant sur «Save». Le message sera envoyé à la date et à l heure souhaitées.
Création d un contenu ipc printeva + Pour créer un nouveau contenu ipc printeva +, cliquez sur l onglet «Contents» puis : 1. Cliquez sur le bouton «Add Content» 2. Saisissez les champs suivants :
Content name : Content/Release date : Internal note : Folder content : Content export : ipc Top : Customers notifications : Start content Le nom de votre contenu ipc printeva +. Ce nom sera affiché dans l historique d ipc Scanner lorsque le code sera scanné par l utilisateur. Il est donc important que le nom soit représentatif du contenu. Vous pouvez laisser la date par défaut, cette option permet de trier les contenus dans le CMS par date. Vous pouvez ajouter des renseignements internes sur le contenu, ces renseignements seront affichés sur le CMS uniquement. Vous avez la possibilité de trier vos contenus dans des répertoires, comme sur un ordinateur. Si vous avez créé des répertoires vous pouvez choisir l emplacement où le contenu sera classé. Dans cette section vous pouvez définir les canaux de diffusion de votre contenu. Par défaut, chaque contenu sera lancé par un ipc Code pour un affichage optimal sur les appareils mobiles et tablettes. Vous pouvez également exporter votre contenu sur d autres plateformes : 1. Publier le contenu sur votre site web grâce à «ipc WebPlayer». Un code html, intégrable sur votre site web, sera affiché dans l onglet «Codes» (gratuit) 2. En option payante, vous pouvez créer une application séparée avec votre icône et votre contenu publiée sur les App Stores (sur demande, avec supplément) Dans ipc Scanner, l onglet «ipc Top» affiche les contenus les plus populaires. Si vous désirez participer et diffuser votre contenu à la communauté ipc, vous pouvez cocher l option ipc Top. En cliquant sur la check box, vous pouvez activer l option «notifica notifications» que nous avons traité plus haut dans ce document. Vous pouvez notifica également personnaliser le message que l utilisateur va voir avant d accepter les notifications à l ouverture du contenu. Create a new content => création d un nouveau contenu en mode libre. Create a new content from copy with => création d un nouveau contenu à partir d un autre contenu que vous avez déjà créé (copie). 3. Cliquez sur le bouton «Save».
Interface «Contents» Suite à la création du code ipc, le contenu apparait sur l interface «Contents». Boutons d action sur le contenu ipc printeva + Poids du contenu ipc Imprimer les codes ipc publics Statistiques du contenu Edition des informations Lancer l éditeur de contenu Quickstart Suppression du contenu ipc Nouvelle couverture pour le contenu ipc printeva + Le lien «New cover», sous l image noire permet d ajouter une couverture personnalisée au format.jpg (619 x 453 pixels), qui s affichera lors du téléchargement du contenu et dans la liste historique de l application ipc Scanner. Interface d upload d une nouvelle couverture Après chargement d une couverture Statistiques du contenu Si vous avez souscrit au service de statistiques, vous pouvez accéder aux statistiques de téléchargement en cliquant sur l icône «Stats».
Vous pouvez accéder aux rapports suivants : 1. Nombre de scans 2. Nombre d accès via l historique d ipc Scanner 3. Nombre de visiteurs uniques 4. Le matériel utilisé par vos clients (ipad, iphone, Samsung, etc.) 5. Les différents types de connexion (wifi ou 3g) 6. Les versions des systèmes d exploitation (ios et Android) Processus de création du contenu ipc printeva + Une fois le contenu ipcprinteva + créé vous pouvez suivre la procédure d édition du contenu en cliquant sur les boutons de processus. Lancer le logiciel de composition des codes ipc Publier votre contenu afin qu il puisse être chargé par vos clients Codes publics Si vous éditez votre contenu ipcprinteva + en cliquant sur le bouton «Edit» vous pouvez modifier votre contenu sans qu il soit accessible à vos clients. En effet, le logiciel d édition contient un code de test qui vous permet de tester votre contenu avant sa publication. Une fois que votre contenu est prêt vous pouvez cliquer sur le bouton «Publish». Cette action permet de rendre public votre nouveau contenu.
Logiciel d édition des contenus - ipc Content Editor - Quickstart En cliquant sur le bouton «Edit» vous avez lancé l éditeur de contenu «ipc Content Editor». Ce dernier s ouvre sur la page «Home». Un onglet «Quickstart» apparaît également au menu.
Onglet «Quickstart» En sélectionnant l onglet «Quickstart», le module de création rapide est lancé : Sauvegarder votre contenu Code de test Ajouter un son pour toute l application Ajouter une page (onglet) Zoom de la page Lors de la création de votre contenu, un «code de test» vous permet de tester votre application sur tablette ou smartphone avant de la publier. A chaque modification, avant de tester le nouveau contenu, n oubliez pas de cliquer sur le bouton «Sauvegarder». Pour ajouter une page à votre contenu, il suffit de cliquer sur le bouton «New page». La fenêtre de paramétrisation apparait. Vous pouvez paramétrer votre page en remplissant les champs suivants : Page title : Tab icon : Navigation colors : Page content : Nom qui sera affiché sous l icône. Par exemple : «Home» ou «Concours» L icône qui sera affichée sur le bouton. Vous pouvez choisir parmi les icônes de base ou ajouter vos propres icônes en cliquant sur le bouton «Other icon», votre icône personnalisée sera idéalement de 160 x 160 pixels au format.png ou.jpg Vous pouvez personnaliser la couleur de la barre de navigation. Dans l ordre la première couleur correspond à la couleur de fond de la barre, la deuxième, la couleur du bouton sélectionné et la troisième, la couleur des textes. Vous pouvez sélectionner le template que vous souhaitez utiliser.
Liste des templates disponibles Dans le menu déroulant «Page content», un certain nombre de templates ont été prédéfinis afin de pouvoir créer rapidement et simplement un contenu. En sélectionnant un template, une deuxième partie du formulaire s affiche selon votre choix. Movie Permet de créer un nouvelle page avec une vidéo. Cliquez sur ce bouton pour choisir une vidéo sur votre ordinateur Vous pouvez ajouter une vidéo aux formats.flv,.mp4,.mov ou.avi. Le système va automatiquement compresser la vidéo pour les smartphones. Image Permet de créer un nouvelle page avec une image. Cliquez sur ce bouton pour choisir une image sur votre ordinateur Vous pouvez ajouter une image au format.jpg ou.png. La taille idéale est de 960 x 540 pixels.
Link over image Permet de créer une nouvelle page avec une image et un lien qui ouvre une page Internet au «clic» de l utilisateur. Dans notre exemple, sur le smartphone ou la tablette, le navigateur web intégré lancera la page www.mybva.ch au «clic» sur l image. Vous pouvez ajouter une image au format.jpg ou.png. La taille idéale est de 960 x 540 pixels. Link Permet d ouvrir une page Internet directement au «clic» sur la barre de navigation. Diashow Permet d ouvrir une page avec un diashow. Pour ajouter des images, cliquez sur le bouton «NEW» et sélectionnez les images dans votre browser. Pour modifier l ordre de passage des images, il vous suffit de les sélectionner avec votre curseur et de les glisser à l emplacement voulu (drag and drop). Si vous désirez que le diaporama tourne en mode automatique, vous pouvez cocher l option «Change automatically the images» et déterminer le nombre de secondes d intervalle entre les images. Si cette option est désactivée, les images du diaporama devront être consultées manuellement sur votre écran.
Locations (géolocalisation) Permet d ouvrir une carte interactive et d y ajouter des points sous la forme de punaises. Lorsque l utilisateur appuie sur l onglet, le système va automatique zoomer la carte entre la position actuelle de l utilisateur (pour autant que le GPS soit actif) et le point le plus proche (par exemple un magasin ou un dépôt). Dans le point 1, vous devez indiquer l adresse du centre de la carte. Si le GPS n est pas actif ou pas disponible, le smartphone utilisera cette donnée par défaut. Par exemple, nous pouvons insérer «place de la Gare, Lausanne» et cliquer sur le bouton «>» pour rechercher l adresse exacte sur la carte. Il est également possible d ajuster avec plus de précision la position de la punaise sur la carte en cliquant sur le bouton «Map» et en faisant glisser la punaise avec le doigt.
Le point 3 «Locations to display» permet d ajouter les punaises sur la carte. Il suffit de cliquer sur le bouton «+» et de compléter les paramètres dans le point 4. Voici le résultat, après avoir ajouté plusieurs points :
Contests Permet d ajouter un concours qui a été créé dans le CMS (voir plugin Contest) Le menu déroulant «Contest» liste automatiquement les concours créés. Vous pouvez ajouter une image de fond aux formats.png ou.jpg. Les dates «Start date» et «End date» permettent de gérer de manière automatique si les utilisateurs peuvent participer au concours ou si un message est affiché. Un formulaire d inscription sera automatiquement lancé lorsque l utilisateur clique sur l image. ipc Content Permet de lancer au clic sur le bouton un autre contenu ipcprinteva + (par ex. un PDF) déjà créé et enregistré dans «Contents». Le nouveaus contenu sera alors directement téléchargé et ouvert séparement sur l écran de votre tablette ou smartphone. En le refermant avec la petite croix, vous retournerez automatiquement sur le menu de votre contenu principal. Changer l ordre des boutons
Actions sur les boutons En tout temps vous pouvez modifier la disposition des boutons dans le menu ou éditer votre contenu ipcprinteva + en passant le curseur sur le bouton (onglet). Une icône outil (pour éditer le template) et deux flèches (pour changer l ordre des boutons) apparaîtront et vous permettrons d effectuer les modification souhaitées. Publication de votre contenu Une fois que vous avez testé et sauvegardé votre projet en cliquant sur l icône «Save the layout» vous pouvez fermer le «Content Editor». Pour rendre public le contenu que vous venez de créer ou éditer, vous devez cliquer sur le bouton «Publish». Lancement de votre contenu En cliquant sur le bouton «Codes» vous obtenez la liste des codes du contenu, chaque code correspondant à une page.