Services Mobiles

La gestion du multi-screen par le “responsive design”

par Olivier Milcent (@omilcent), DG France et CMO de Momac

Le webdesign est entré dans une nouvelle ère, celle du multiscreen. Le sujet est identifié depuis plus de 10 ans, mais c’est seulement depuis peu que les concepteurs de sites web n’envisagent plus de créer un site sans réfléchir à son rendu sur smartphones et tablettes.

Dans le sillon du HTML5,  le responsive design est devenu l’un des termes les plus en vogue de l’industrie du web. Le concept est séduisant: permettre d’adapter automatiquement la mise en forme d’une page HTML selon la taille et la résolution du navigateur ou l’OS.

Cette transformation s’applique à la structure de la page, ses images, ses polices et tout autre élément de style, grâce à différentes techniques offertes par CSS3.

Le responsive design est une réponse nouvelle aux problématiques de fragmentation des navigateurs, et remet en cause les méthodes traditionnelles de conception d’un site web ou mobiles.

Prenons l’exemple de l’excellent http://css-tricks.com

Faites le test en réduisant la largeur du navigateur, et voyez le résultat sur la mise en forme des menus et des éléments de la page.

Comment ça marche ?

Un site web doit aujourd’hui s’afficher pour des écrans variant entre 240px et 1920px. Un vrai défi pour les designers ! L’une des premières techniques est d’utiliser la technique de fluid grid permettant de rendre proportionnel tout élément de la page. Par exemple, au lieu de dimensionner une cellule de tableau à 200px, on lui attribuera 20% de la ligne du tableau. Il en va de même pour les polices que l’on définira en « ems » en non pas en pixels.

Ensuite, on utilisera la technique CSS des medias queries, qui depuis CSS3 permettent d’appliquer une feuille de style selon

• La hauteur ou la largeur d’un écran
• L’orientation de l’écran
• Le ratio LxH
• La résolution et le nombre de couleur

La combinaison de media queries et de différentes CSS permet donc d’afficher un rendu propre à chaque taille du navigateur. On peut donc, plus facilement qu'avant, concevoir une version web, tablette et smartphone, à partir d’un même noyau de site.

La gestion des images est plus complexe. Il faudra faire en sorte que chaque image s’adapte facilement à la transformation de la page. Il faudra également prévoir plusieurs versions d’images afin de ne charger que celle qui correspond au besoin final.

C'est quoi ROPO ? (Research Online, Purchase Offline), le mobile va exploser les usages !

ROPO, Research Online, Purchase Offline phénomène de la recherche, de l'information sur un produit, un service via Internet à l'acte d'achat dans le monde physique ! l'IAB France pose cette question : Comment mesurer l’influence du Web sur l’achat en magasin et comment le prendre en compte dans sa stratégie marketing ? Sur des secteurs où l’affiliation permet de générer l’intention d’achat, l’effet ROPO peut être significatif. Lire le dossier ROPO sur iAB. Regarder les slides de GFK sur le process de l'achat de H&M (dommage il ne parle pas de mobile)

Part des achats s’effectuant ROPO par types de produits / services

• Voitures = 42 %
• Appareil photo / camescope numérique : 32 %
• Mobilier / meubles de maison : 31 %
• Appareils domestiques : 31 %
• Matériel informatique : 29 %

Le phénomène va exploser dans les années qui arrivent avec le mobile, car les outils, les technologies, les applications vont favoriser les usages de recherche d'information autour et sur le lieu de vente !! Le challenge, c'est de déclencher l'acte d'achat en magasin, puisque vous êtes sur place !! Ci-dessous quelques slides sur la technologie du NFC qui pourra à terme être décisif en étant couplé à des apps, web apps sur les outils de recherche, mais pas seulement !

La recherche local couplé à la recherche vocale, si vous avez un Smartphone Android ou iOS vous pouvez utiliser le champ recherche de Google en lui parlant, par exemple : "je recherche des chaussures Adidas" à ce jour vous aurez une présentation de publicités et de sites web qui ne sont pas au format mobile, mais on imagine que Google va aller plus loin et que les marques devront prendre en compte ce type de recherche avec une experience utilisateur autour du mobile !

Les nombreuses API créé par les développeurs (startup..) d'applications sont utilisables maintenant et permettent de construire dès aujourdh'ui une expérience autour de la recherche local pour les marques afin de dainer le traffic dans les magasins !! Les acteurs de lafrenchmobile.com sont ici pour vous aider sur le sujet !

Softbank investit 200 millions de $ dans InMobi

C'est un investissemnt important dans ce secteur, surement le plus important depuis le rachat de  AdMob par Google ! InMobi lancé aux Etats-Unis et début de l'année dernière en Europe avait obtenu environ 15 millions $ en financement initial. Le réseau de publicité mobile a environ 340 millions d'utilisateurs répartis dans 165 pays et gère environ 47 milliards de publicités par mois.

"L'industrie de la publicité mobile va certainement éclipser toute autre forme de publicité numérique dans les prochaines années et nous allons certainement parier sur elle" fondateur et directeur général Naveen Tewari.

Une interview de la DG France de suite.. !

C'est quoi les MEMS ? le marché des capteurs !

C'est le marché du micro-electro-mechanical systems, vous avez dans vos smartphones un accéléromètre, gyroscope, micro qui permettent aux gens de parler, filtre à ondes acoustiques qui facilitent l'accès à Internet sans fil.....etc. Les MEMS offrent de nombreuses fonctions de base qui font de vos smartphones des machines plus puissantes et intelligentes. C'est un marché à suivre pour l'innovation des applications !

Site Web Us sur le sujet : http://www.memsnet.org/news/

Une nouvelle génération de capteurs MEMS va voir le jour ce qui permettra d'avoir d'autres usages sur les smartphones, capteur de pression, capteur pour un meilleur usage des caméras et projecteur pico, capteur de température..... pour stimuler la croissance de ce marché énorme : 52,25 milliards de dollars en 2011, avec un taux de croissance annuelle de 37 %. Les revenus MEMS pour les mobiles & tablettes atteindront 1,21 milliard de dollars, soit environ 50 % du total de consommation des MEMS.


Deux nouveaux dispositifs MEMS ont été introduits cette année. L'un était une nouvelle manette de jeu, lancé en avril par Knowles Electronics. Le joystick MEMS avec capteurs optiques ou magnétiques, est plus mince et moins gourmands en énergie. L'appareil devrait  prochainement trouver son chemin dans les accessoires de jeu pour les mobiles et tablettes !

La deuxième nouveauté MEMS de l'année est un thermopile, introduit en mai par Texas Instruments. C'est un capteur de température sans contact, pouvant être placés dans un téléphone et tablette afin de contrôler la température du téléphone. En contrôlant la chaleur dissipée, le thermopile aide à mieux ajuster les opérations du processeur ainsi que repousser ses limites pour en extraire des performances optimales. Avec ce type de capteur ont peut imaginer autre chose ?? Starbuck en étant la cible.......

C'est quoi le HbbTV ?

Hybrid Broadcast Broadband TV ou "HbbTV", est une initiative pan-européenne autour d'un consortium (entre autre TF1, Sony, France télévision; Samsung, Philips, Open Tv, Astra) visant à harmoniser la diffusion et la transmission de programme pour le consommateur final à travers les téléviseurs connectés et les décodeurs. Grâce à l'adoption du HbbTV, les consommateurs seront en mesure d'accéder à de nouveaux services auprès des fournisseurs tels que les radiodiffuseurs, les fournisseurs et fabriquant , y compris lacatch-up TV, la vidéo à la demande (VoD), la publicité interactive, la personnalisation, le vote, les jeux et bien sur la couche sociale  ainsi que des services liés aux programmes tels que le texte numérique et EPG.

C'est quoi la technologie (codec) WB-AMR ? la voix HD sur votre mobile

Ce sera la référence dans vos mobiles pour un meilleur son, le développement d'un nouveau CODEC (le WB-AMR) va permettre une qualité des communications vocales de très grande qualités. La France est pionnière en matière de voix haute définition, les opérateurs mobiles français comptent parmi les premiers au monde à déployer la « Voix HD », qui implique, d’une part, d'équiper l'ensemble du réseau et, d’autre part, pour l’utilisateur, de disposer d’un téléphone mobile adapté.

Le codec WB-AMR offre une meilleure qualité audio grâce à l’utilisation d’un spectre de fréquences plus large, de 50 à 7000 Hz, par rapport au codec vocal à bande étroite actuel qui exploite la plage de 300 à 3400 Hz.

Orange est l'un des premiers à saisir l’opportunité de se différencier des autres systè- mes par une meilleure qualité de voix.(voir l'offre sur un Nokia N8) Nous avons eu l'occasion de tester sur des Nokia E72 le son HD (il faut être sur le réseau 3G pour les l'émission et la réception et avoir 2 mobiles qui embarque le codec WB-AMR) et c'est vraiment impressionnant ! votre conversation devient si naturelle que vous avez presque l'impression de vous trouver dans la même pièce que votre interlocuteur. Ci-dessous la disponibilité géographique de la Voix HD en 2010 pour Orange

Quelques chiffres (Juin 2010 par Orange) :

- 96 % des clients ayant testé le service sont satisfaits des appels en Voix Haute Définition,

- 86 % des testeurs estiment que la compatibilité avec la voix HD sera un critère de choix lors de l’achat de leur futur mobile,

- 76 % des testeurs seraient prêts à changer de mobile pour bénéficier de la Voix Haute Définition. 

L'intégration dans les mobiles se fera avec le renouvellement car le traitement de la voix HD se fait par le biais d’un chipset intégré dans le mobile ! l’utilisation de la voix HD ne consomme pas plus de batterie qu’une communication voix classique

SFR aussi se lance sur la voix HD qui se généralisera sur l'ensemble du parc mobile français.

Comparez le son standard et HD

En qualité HD :

En qualité standard :

C'est quoi les annonces Hyperlocales sur mobile ?

L'enterprise Rent-A-Car est parmi les premiers entreprises qui utilisent les annonces publicitaires hyperlocal de Google, qui donne la distance entre l'utilisateur et l'entreprise locale. Google ne facture que les annonceurs lorsque les utilisateurs cliquent pour visiter le site ou sur le numéro de téléphone indiqué dans l'annonce.

Google et Rent-A-Car se sont rendu compte que les annonces mobiles qui fonctionnent le mieux sont celle qui fournissent des informations utiles aux utilisateurs, comme la distance pour retrouver l'entreprise, les heures d'ouvertures ou de l'informations sur les ventes.

Un autre acteur US c'est Where dont les taux de clics ont augmentés de façon spectaculaire, permettant de commencer à vendre des annonces pour des prix assez élevés. Présent sur le Web et le mobile qui permet un service de recherche hyperlocale, c'est à dire où vous vous trouvez. Trouver des événements, restaurants, de l'essence bon marché et des coupons de réduction..... De nouvelles fonctionnalités, comme la météo et la circulation font de l'application quelques choses de très pratique et devient la seule chose dont vous aurez besoin pour rester connecté avec votre environnement local.

La croissance Hyperlocales

En général, la catégorie d'annonces locales mobile connaît une croissance énorme. Des études montre que la publicité locale devrait atteindre 2,02 milliards de dollars en 2014, c'est un taux de croissance annuel de 56,9%. En France le même phénomène mais avec un peu de retard et une dispersion des services sur plusieurs applications ! La plus aboutie reste Pages Jaunes mais pas beaucoup de challenger !! 

C'est quoi le storytelling avec Nokia ?

Aujourd’hui, le Storytelling est la version moderne de cet art de la transmission et de la conviction par le pouvoir des histoires. On le trouve parfois traduit en français par communication narrative. C’est une discipline en plein développement dans les domaines de la stratégie, du marketing et de la communication des entreprises et des organisations. 

Aujourd’hui, Tim Kring (le créateur de « Heroes ») et Nokia ont présenté Conspiracy For Good (CFG), le premier mouvement qui combine des actions virtuelles et des actions dans le monde réel en vue d'influencer des changements sociétaux grâce à la participation du public. CFG associe le storytelling original de M. Kring et la plate-forme Ovi de Nokia pour créer une expérience fictive radicale utilisant le cinéma interactif, le jeu sur mobiles et le jeu en réalité alternée (ARG), la musique et la participation physique pour faire le bien dans le monde. Les participants prendront part au développement de l’action et trouveront, à l’intérieur même de l’histoire, des outils et des indices utiles pour faire progresser la narration et, au final, engendrer des changements sociaux et pédagogiques en faveur d'une école élémentaire du monde réel : Chataika Basic School, situé dans le village de Chataika en Zambie Est. 

Avec Conspiracy For Good, notre objectif est d’attirer, d’engager et d’inspirer ce public à changer le monde réel en participant à la narration !

Avec OVI 

La participation de CFG sur Ovi prend plusieurs formes : une série d’applications existantes et à venir, dont des jeux classiques comme « Exclusions » et « Mainframe Liberator » qui déverrouillent les codes de sites Web confidentiels, Ovi Cartes pour guider des personnages dans l’histoire et Ovi Music, où des informations cachées dans des chansons peuvent être décodées afin de faire progresser l’histoire.

Au Royaume-Uni, les participants pourront télécharger une application spéciale dédiée au service de réalité augmentée Nokia Point & Find, appelé Conspiracy for Good: DeadDrop. Disponible dans la boutique Ovi du Royaume-Uni à la mi-juillet, l’application permettra aux joueurs de pointer des objets et des images du monde réel pour découvrir des indices et participer à des défis à l’occasion d'une série d'événements à venir à Londres.

C'est quoi la cartographie passive ?

La cartographie passive est un moyen simple de contribuer aux cartes. Elle est possible sur certains OS mobiles et notamment Android de Google. Elle démarre de temps en temps en fonction d'événements sur votre mobile, par exemple le déplacement du téléphone ou la connexion au réseau. Divers critères d'arrêts sont possible, par exemple lorsque le téléphone arrête de se déplacer ou que le maximum d'utilisation de la batterie par la cartographie passive est atteint. "C'est une solution à double-tranchant, il faut à tout prix respecter l'utilisateur" dit Philippe Girolami, créateur de Sensorly, le service de cartographie de la couverture GSM et WiFi. "Dans Sensorly, la cartographie passive est systématiquement signalée à l'utilisateur. De plus, la configuration permet de spécifier combien de batterie peut être consommée et même de complètement désactiver la cartographie passive!"

C'est quoi le Transmédia ?

Xavier Couture, Directeur des Contenus d’Orange explique ce qu’est le Transmédia sur l'un des sites de la marque "Refresh" "

L’arrivée de l’ère numérique et la diversification des réseaux de diffusion a profondément modifié les habitudes de consommation média du public : les frontières entre les écrans disparaissent progressivement, la dimension sociale et communautaire est de plus en plus prégnante. Passant naturellement d’un média à l’autre, les consommateurs suivent aujourd’hui leurs univers de contenus favoris sur tous les écrans. 

Cette évolution des usages représente une opportunité majeure pour les créateurs d'enrichir leur univers narratif et de mettre en scène des formats inédits, immersifs et interactifs, aux croisements du jeu, de la fiction et de la réalité. Pour les spectateurs, c’est l’occasion de vivre une expérience valorisante, attractive, communautaire, dans laquelle ils deviennent véritablement acteurs de l’histoire … C’est l’avènement du transmédia. Source et suite ici

Orange a la conviction que d'ici 5 ans, 50% des productions audiovisuelles seront plurimedia : une série TV, un film, un documentaire sur deux auront leur écho sur internet ou sur le mobile.