Le développement multiplateforme sur mobile, réalité ou fiction?

Le développement multiplateforme sur mobile, réalité ou fiction? Cyril Cathala 20 Septembre 2014

SOMMAIRE L avenir de la mobilité : natifvs web... 3 L explosion du marché des mobiles... 3 Entre coût et référencement, quid du modèle adapté... 5 Les outils multiplateforme d aujourd hui (et de demain?)... 5 Choisissez vos armes!... 7 La solution à moindres coûts : HTML/Javascript/CSS... 7 Qualité maximale : au plus près du natif... 8 Vers une stratégie évolutive : HTML vers natif... 8 L entre deux, stratégie hybride... 9 L application d entreprise et déploiement... 9 Conclusion... 10 1

Qui est l auteur? Cyril Cathala Expert.NET spécialisé dans les technologies XAML / C# (Windows 8, Windows Phone, Silverlight, WPF) Passionné par le domaine du mobile, Cyril aime s y plonger via des projets Windows 8, Windows Phone et Azure. Tour à tour speaker, formateur, blogueur, UX master, il participe activement aux communautés développeurs, et n hésite pas à voler au secours des développeurs en péril au travers (notamment) de l accélérateur d applications Windows Phone! 2

L avenir de la mobilité : natifvs web L explosion du marché des mobiles Depuis plusieurs années, la vente des smartphones et tablettes est en plein essor, au détriment des PC qui voient leurs ventes stagner. Les statistiques montrent que les utilisateurs naviguant sur internet depuis un mobile, les mobinautes, sont en nette augmentation et dépasseraient même les internautes. Le web n est plus le seul univers connecté de prédilection, la nouvelle norme sur mobile est aux applications, point d entrée d un univers intégré à son périphérique et accessible uniquement (ou presque) depuis un magasin d applications (ou store). Ce changement dans la consommation du digital amène une fracture notable dans l usage des périphériques d aujourd hui. Les nombreuses différences induites par ces form factors demandent aux développeurs de s adapter à chaque système et langages de développement, chaque déclinaison d écran (portrait, paysage, petit, grand...), chaque interaction (tactile, clavier/souris). 3

Le challenge est élevé pour cibler tous les périphériques et répondre à l attente des utilisateurs. Du côté du web mobile, des solutions se mettent en place, avec notamment le responsive design induit par les nouvelles normes de CSS3 et ses media queries. HTML5 (et ses compagnons Javascript et CSS3) tente de conquérir le coeur des mobinautes, pour une expérience optimale s adaptant à tous les formats. L expérience web mobile devient de plus en plus riche mais ne rivalise pas encore avec le développement d applications natives, qui ont directement accès aux spécificités du périphérique et à des thèmes graphiques adaptés. En (vraiment) résumé, nous pourrions comparer les 2 approches par le tableau suivant : Web mobile Application native Standard multiplateformes Version du site déclinée format mobile Faibles coûts Référencement via moteur de recherche Expérience limitée aux possibilités de navigateur En ligne uniquement Spécifique à la plateforme Meilleures performances Coûteux Référencement via Store Maintenance Respect de l expérience utilisateur Support du hors ligne 4

Entre coût et référencement, quid du modèle adapté Lorsqu on sait que chaque store prélève une partie des bénéfices (généralement 30%) sur tous les paiements effectués autour des applications, cela peut refroidir bien des business par exemple basés sur des abonnements. Dans ce cas, l approche «web app» peut être préférable. Reste à prendre en compte l aspect visibilité. Que représente une application web présente uniquement sur le vaste web comparée à un magasin d applications? Cette composante de visibilité marketing peut jouer en faveur des applications natives, tout dépend du public visé et de la notoriété du produit. D autre part, la justification des coûts peut être intrinsèque au rôle de l application. Par exemple, une application permettant de remplir sa feuille d imposition, utilisée donc 1 seule fois par an, justifie-t-elle un investissement de plusieurs milliers d euros? Le débat fait rage : web mobile ou application native? Et s il existait une autre solution alliant le meilleur des deux mondes? Les outils multiplateforme d aujourd hui (et de demain?) Lorsqu on aborde le développement d applications natives, c est-à-dire lorsqu on développe dans le langage spécifique à un système d exploitation (ex.: Objective C pour ios), cela demande des compétences particulières et propres à chaque plateforme. Evidemment, tout dépendra des besoins : 5

Voulez-vous une application de qualité, performante et au design bien intégrée au système? Combien de temps avez-vous pour tout développer, et à quel budget? Le prélèvement sur les achats peut-il être un frein au business (exemple d une app avec abonnement)? Quel OS viser en priorité? Dois-je prendre en compte les OS émergents? Vous souhaitez migrer une application existante vers un autre OS, comment s y prendre? Plusieurs approches existent pour aborder le développement multiplateforme, chacune répondant à un ensemble de problématiques : Type Description Exemples Profil Langage Framework Javascript Site web responsive Aide au développement avec composants réutilisables jquery Mobile, Sencha Touch, Zepto JS, ImpactJS, LimeJS, iui, Wink Développeurs web Javascript Web vers natif Wrapper d app HTML/JS Single Page App Web app avec fonctionnalités natives Adobe PhoneGap Build, Uxebu, Sencha Touch v2, MoSync Développeurs web HTML/CSS/Javas cript Crosscompilation 1 langage compilé dans le langage natif cible Xamarin, Titanium Développeurs logiciel Langage supporté (C#, Javascript, Java ) Runtime Machine virtuelle qui fait tourner du code intermédiaire Adobe Air Développeurs logiciel Langage supporté (ActionScript, JS ) Bas niveau Composants graphiques bas niveau Utilisé pour les jeux Unity, MonoGame, DeltaEngine, Corona Développeurs jeux Langage supporté (C++, OpenGL ) Existe-t-il une approche meilleure qu une autre? 6

Choisissez vos armes! Pas de solution miracle ou d outil universel pour le développement multiplateforme, à chacun son scénario, en fonction du contexte et des objectifs. La solution à moindres coûts : HTML/Javascript/CSS Le classique trio HTML/JS/CSS reste le favori du développement multiplateforme peu onéreux, souvent au détriment de l expérience utilisateur. Les normes évoluent et tendent vers une expérience toujours plus proche du natif, grâce aux smartphones plus puissants et à l évolution de la norme (bientôt HTML5.1, puis HTML6...?). Malheureusement, les performances ne pourront jamais égaler le natif, et le look&feel de l OS est rarement respecté à 100%. Toujours est-il que cette approche est de plus en plus populaire, et est facilitée par de nombreux frameworks. La difficulté revient justement à choisir quels sont les frameworks les plus adaptés, quitte à en mixer plusieurs ensemble. Le choix se portera souvent sur les outils que les développeurs préfèrent et maîtrisent, nous pourrions en citer quelques-uns connus : Sencha Touch 2, Angular, XUI, Zepto... + - Moindres coûts Multiplateformes avec partage des vues Compétences HTML/JS/CSS réutilisables Ressources réutilisables depuis un site web mobile Performances moyennes Dépendant d un thème natif Beaucoup de problématiques javascript pour un rendu optimal Debug fastidieux 7

Qualité maximale : au plus près du natif Le développement natif reste roi pour des applications d exception : graphiquement en harmonie avec le système, performances et possibilités maximales. Dans ce cas, il convient d utiliser les contrôles graphiques de chaque OS, ce qui requiert l intervention de développeurs spécialisés. En gardant uniquement ce pan propre aux OS, il est finalement possible de dégager une brique réutilisable : la logique métier. Celle-ci pourra contenir les appels de données, les règles métier, certains paramètres et autre code indépendant de la plateforme et de la couche graphique. + - Réutilisable de compétences (C#, Javascript..) Réutilisation de la couche métier Performances optimales Design fidèle à l OS App de qualité Design non réutilisable Coût et maintenance Vers une stratégie évolutive : HTML vers natif Une autre stratégie consiste à itérer en plusieurs temps : débuter avec une solution type wrapper web pour un time-to-market rapide, puis basculer progressivement les applications vers du natif. Cela se fait fonctionnalité par fonctionnalité, écran par écran. 8

+ - Coût répartis sur le moyen / long terme Partie du design réutilisable Time to market potentiellement rapide Coût sur le long terme Premières versions moins qualitatives Compétences multiples requises (web et natif) L entre deux, stratégie hybride De la dernière approche en découle une autre similaire : le partager entre web et natif. Ainsi, l application se retrouve découpée en plusieurs parties : certains écrans nécessitant un développement natif (pour un rendu optimal), d autres se suffisant à du web embarqué, aisément réutilisable. + - Coûts répartis réduits Partie du design réutilisable Time to market relativement rapide Rendu potentiellement étrange d une page à l autre Compétences multiples requises (web et natif) L application d entreprise et déploiement Lorsqu on souhaite uniquement développer des applications d entreprise multiplateforme, le choix se restreint aux outils facilitant le déploiement en masse, voire proposant un portail d entreprise. 9

Dans ce cas, les contraintes de design sont moindres et on peut se permettre de s éloigner légèrement de l expérience utilisateur. Évidemment, plus on s en éloigne, plus le besoin en formation se fait sentir. + - Réutilisable de compétences internes Peu de contraintes sur le design Coûts de maintenance des outils de déploiement Conclusion De nombreux scénarios qui s adaptent à toutes les situations, ou presque L évolution des normes web modifiera probablement la donne d ici quelques années. En attendant, il faut savoir s adapter et miser sur le bon cheval. Vu les tendances actuelles, miser sur le web restera forcément rentable sur les 5 années à venir, ne serait-ce que pour la réutilisation de compétences et de ressources graphiques. Bien entendu, les utilisateurs d aujourd hui exigent qualité et performance, en tout cas si vous voulez répondre à tous leurs désirs. Aujourd hui, seul le développement d applications natives permet de garantir une expérience utilisateur optimale en tout point. Heureusement, plusieurs solutions matures existent pour développer en natif sur plusieurs plateformes tout en réutilisant des briques communes. La bataille du développeur sur mobile est rude mais en vaut la peine. Les armes sont là, encore faut-il réussir à choisir la bonne! 10

FIN 11