Développer une application mobile iOS et Android de qualité et à moindre coût avec Xamarin et Microsoft Azure

Développer une application mobile iOS et Android de qualité et à moindre coût avec Xamarin et Microsoft Azure

J’ai écris cet article pour 123Presta dans le but de présenter Xamarin et Microsoft Azure à ses clients. J’ai le plaisir de le partager également sur mon blog. Bonne lecture 🙂

 

Aujourd’hui, créer une application mobile est presque indispensable à tout projet. Vous avez un site e-commerce ? Y associer une application mobile permettra de booster les ventes grâce à une meilleure expérience utilisateur. C’est vrai pour tous vos projets, que ce soit un site internet, un service de prestation B2B ou B2C, ou tout simplement une application mobile seule.

Seulement, développer une application mobile est complexe et peut s’avérer très coûteux. Il faut s’adapter à Android, iOS, et/ou Windows Phone, aux petits écrans ou aux tablettes. Parfois, il faut même se connecter à un serveur distant afin d’échanger des données via internet.

Il existe des dizaines de technologies pour développer des applications mobiles, chacune ayant ses avantages et ses inconvénients. Dans cet article je m’attarderai plus en détails sur une solution proposée par Microsoft. Celle-ci permet de répondre de manière très adaptée à toutes ces contraintes : Xamarin et Microsoft Azure.

 

Vous avez besoin d’une application mobile ? Il faut en créer trois !

Aujourd’hui, d’après le cabinet d’étude Kantar, plus de 73% des smartphones possédés par les français sont Android. 24% sont iOS et seulement 2.5% Windows Phone. C’est pourquoi il est important, pour tout projet d’application mobile, de viser au minimum les systèmes d’exploitation Android et iOS.

 

xamarin microsoft azure ios android

Android et iOS sont deux systèmes différents. De ce fait, le développement d’application mobile ne se fait pas avec les mêmes technologies, ni de la même manière. De plus, le design des applications sont également différents entre Android et iOS. Un utilisateur Android a l’habitude d’avoir le bouton de l’action principale de la page courante en bas à droite. Au contraire, l’utilisateur iOS a l’habitude de l’avoir en haut à droite. De même, un utilisateur Android a l’habitude de voir les onglets affichés en haut. Alors qu’ils sont affichés en bas sur iOS.

Il existe de nombreuses différences, tant sur l’emplacement des contrôles que sur les choix des couleurs et des apparences. D’ailleurs, Google et iOS ont leur propre Guidelines (Material Design pour Android contre HIG pour iOS). Et pour garantir la meilleure expérience utilisateur possible à 100% de vos utilisateurs, il faut respecter ces Guidelines. L’image suivante présente la même application, avec un design adapté à chaque plateforme :

xamarin microsoft azure ios android

 

Une application mobile ne se suffit rarement à elle seule

Une application mobile doit généralement être accompagnée par un serveur. Ce dernier va stocker des données et permettre aux applications (mobiles ou web) d’accéder et de modifier ces données. Par exemple, une application mobile « réveil matin » n’a pas besoin de serveur et d’accès internet pour fonctionner. Mais une application associée à un site e-commerce, ou à un site d’actualités aura besoin d’un serveur. En effet, c’est ce serveur qui va envoyer les articles, via internet, que l’application mobile doit afficher à l’utilisateur.

xamarin microsoft azure ios android

Résumons. Pour un projet mobile, il faut :

  • designer et développer l’application sur Android,
  • designer et développer l’application sur iOS,
  • mettre en place et développer le serveur.

Toutes ces différentes actions nécessitent des connaissances et des savoir-faire techniques différents. Elles représentent chacunes des métiers différents : designer, développeur Android, développeur iOS, ingénieur système et réseau et développeur « back-end » pour le serveur.

 

Quelles compétences et savoir-faire pour créer une application mobile ?

La technologie pour développer une application mobile native Android est le Java. Pour iOS, il s’agit de Swift. Pour le serveur, il faut des connaissances en sécurité informatique, infrastructure et matériel informatique. Il faut également connaître les bases de données et un langage de programmation tel que PHP par exemple. Lorsque vous êtes entrepreneurs, vous n’avez pas les moyens de former trois équipes disposant de toutes ces compétences. Heureusement, il existe de nombreux moyens de procéder. Je vais vous en présenter un que j’estime excellent tant pour les entrepreneurs ou PME que pour les grands groupes.

Cette technologie est appelée Xamarin. Elle permet de coder une seule fois pour avoir une application mobile native Android, iOS, et Windows Phone. Ajoutez à cela Microsoft Azure pour votre serveur et vous répondez à tous les critères. Le bonus est que vous n’utilisez qu’une seule technologie : celle de Microsoft et son langage de programmation C# .NET.

 

Xamarin : une technologie de développement unique pour vos applications mobiles

Xamarin est né du projet Mono. C’est une société américaine fondée en 2011 et qui a été rachetée par Microsoft en 2016. Ce rachat a rendu l’utilisation de Xamarin complètement gratuite, alors qu’une licence de 2000$ / an était requise auparavant. Xamarin a donc l’avantage d’être gratuit, mature, enrichi et maintenu par des équipes d’ingénieurs de pointe.

Le principe de Xamarin est de permettre de développer des applications mobiles natives avec une seule technologie et en écrivant le code une seule fois. Pour cela, l’offre de Xamarin se divise en deux principes : Xamarin, et Xamarin.Forms. Avec Xamarin, 80% du code est partagé entre les projets Android, iOS, et autre. Les 20% restant sont à produire spécifiquement pour chaque plateforme et concernent l’interface graphique de l’application. Avec Xamarin.Forms, 100% du code est partagé.

xamarin microsoft azure ios android

Choisissez Xamarin.Forms si votre application mobile ne demande pas beaucoup de personnalisation sur l’interface graphique. Généralement, ce sont les applications destinées aux professionnels, dont la valeur n’est pas dans l’effet « waouh ! » mais dans les données affichées. Au contraire, si votre application demande une personnalisation avancée de l’interface graphique, choisissez Xamarin classique. Voici un exemple d’application créée avec Xamarin.Forms : 1 seul code, 3 plateformes, 3 affichages différents et adaptés :

xamarin microsoft azure ios android

Xamarin pour des applications performantes

Avec une seule technologie et un seul code, on peut produire une application pour Android, iOS, et Window Phone. Le coût de développement et de maintenance est donc amoindri, presque divisé par trois. Et contrairement aux technologies hybrides, les applications mobiles créées avec Xamarin sont des applications natives. En effet, Ionic ou React Nativ embarquent une surcouche dans l’application mobile pour fonctionner. Quant à Xamarin, il applique sa surcouche au moment de la compilation afin de « traduire » le code Xamarin en code natif. Grâce à cela le résultat est identique qu’avec une application codée en natif. La fluidité et les performances de l’application ne sont pas impactées et sont optimales.

Xamarin comporte tout de même un inconvénient. Afin de fonctionner, les ingénieurs de Microsoft doivent faire le lien entre le code Xamarin et le code natif de chaque plateforme. Cela engendre parfois des problèmes techniques pour les développeurs. Par exemple pour des fonctionnalités encore non gérées par Xamarin mais existantes dans Android ou iOS. Toutefois, avec le temps cet inconvénient s’estompe et il est très rare de tomber dans un tel cas aujourd’hui.

 

Azure : connectez vos applications mobiles au Cloud à moindre coût

Nous venons de voir comment développer une application mobile multi-plateformes à moindre coût. Voyons maintenant comment connecter cette application à un serveur, ou au Cloud. La solution que je souhaite vous présenter consiste à utiliser Microsoft Azure. Azure est le Cloud de Microsoft. Avec Azure, vous pouvez héberger des sites web ou des bases de données. Egalement, vous pouvez accéder à des fonctionnalités pré-construites telles que l’identification d’utilisateur ou la reconnaissance vocale. Enfin, Azure permet de créer vos propres fonctionnalités répondant à votre problématique métier.

Microsoft Azure est utilisable gratuitement, et propose des services payants afin d’améliorer la puissance et les capacités des serveurs loués. C’est très pratique : pendant le développement de votre projet, vous n’avez pas de trafique, donc pas besoin de serveurs puissants. Une fois que votre projet est terminé et rencontre un succès fou, vous pouvez choisir d’augmenter la puissance des serveurs. Cela permet de rendre vos sites ou applications plus robustes face aux centaines ou milliers d’utilisations simultanées.

Xamarin optimisé pour s’interfacer avec Azure

Xamarin et Azure sont deux technologies différentes, mais appartenant à Microsoft. Grâce à cela, un développeur Xamarin peut intégrer des fonctionnalités Azure dans son application mobile en quelques clics. Et ce, sans avoir besoin d’apprendre un autre langage de programmation ! Les notifications push, l’identification d’utilisateur via plusieurs réseaux sociaux, ou encore la pagination des données pour des transferts plus rapides sont là quelques exemples de fonctionnalités qui ne coûtent plus que quelques clics à mettre en oeuvre, contre plusieurs heures de développement avec des applications natives.

Une fonctionnalité que j’apprécie tout particulièrement est la synchronisation des données entre le serveur et l’application mobile. Azure et Xamarin vous permettent de gérer très facilement le fonctionnement hors ligne des applications. Il est possible de configurer une base de données sur le serveur qui sera partiellement ou entièrement dupliquée sur l’application mobile et synchronisée de manière automatique. Cela permet à vos utilisateurs de naviguer sur l’application sans connexion internet. Tout cela, toujours en quelques clics pour votre développeur, contre des jours entiers de travail en natif.

 

Mise en oeuvre et retour d’expérience avec le projet Moovenow

L’application Moovenow, destinée au grand public, a été développée avec Xamarin classique. C’est une application Android et iOS, qui fait effet de réseau social, d’annuaire, et d’organisateur d’événements dédiés aux sportifs. L’application a été développée en interne par une start-up Grenobloise en 400 jours/homme. Le serveur n’utilise pas

Le choix s’est porté vers Xamarin classique car les interfaces graphiques devaient être très personnalisées. En effet, le design demandait des couleurs ou des formes spécifiques, et des animations. La start-up disposait de peu de moyen. C’est pourquoi il n’était pas envisageable de recruter un développeur Android et un développeur iOS pour ce projet. Il n’était pas non plus envisageable de payer la formation à un développeur pour l’une ou l’autre plateforme.

Un projet réussi grâce à Xamarin

Voici une capture d’écran de Moovenow sur iOS, et deux captures d’écran de Moovenow sur Android. On peut remarquer les interfaces graphiques complètement personnalisées pour une image de marque mise en valeur. Les applications suivent bien les guidelines Android et iOS.

    xamarin microsoft azure ios android

Le projet a été réussi, bien que le temps de développement prévu pour l’application iOS ait été dépassé. Ce retard était dû au manque de connaissance de la plateforme iOS par le développeur. La technologie est la même pour toutes les plateformes. Malgré tout, un point clef de réussite est une bonne culture générale de chaque plateforme pour le développeur.

Si c’était à refaire, il faudrait s’assurer que le client a réellement besoin d’un design élaboré justifiant l’utilisation de Xamarin au détriment de Xamarin.Forms. En effet, cela augmente tout de même de ¼ le temps de développement, donc le coût de production. Il faudrait également s’assurer de l’expérience du ou des développeurs avec les technologie Microsoft C# .NET et de leur culture générale sur chaque plateforme visée (Android, iOS, …).

 

Et vous, quels sont vos projets d’application mobile ?