Lancé en 2010 par Apple, l’iPad a pris une part importante du marché mobile. Et bien qu’il soit similaire à l’iPhone dans son fonctionnement, il offre une expérience différente du smartphone, se rapprochant davantage d’un petit desktop. Alors qu’un écran d’iPhone compte 727 040 pixels, l’écran d’iPad, lui, en comptabilise 3 145 728 : soit 4,3 fois plus de surface à exploiter ! Pas évident pour une application qui souhaite être disponible sur les deux devices (smartphone et tablette). Il est très souvent nécessaire d’adapter l’ergonomie et l’UI (User Interface), l’UX (User Experience) étant très différente d’un écran d’iPhone à celui d’un iPad. Certaines applications telles que Swift Playgrounds sont d’ailleurs présentes uniquement sur iPad. À l’inverse par exemple, l’application Snapchat est disponible uniquement sur iPhone. Anticiper les usages et prévoir une étude ergonomique en amont est donc indispensable.

Bien sûr, chaque projet est différent et tout dépendra de votre cahier des charges. Mais si votre stratégie s’oriente vers une déclinaison iPad, cet article vous aidera à identifier les enjeux de chaque possibilité.

Les 3 déclinaisons possibles

Selon vos contraintes et votre budget, trois principales solutions s’offrent à vous :

Aucune déclinaison : l’interface de votre application iPhone sera simplement étirée de manière grossière sur iPad. Avec cette solution, bien souvent les éléments sont espacés et très gros. La lecture devient difficile.

Déclinaison légèrel’interface est adaptée aux proportions des contenus. On pourra par exemple mettre l’accent sur un arrière plan visuel tout en préservant les proportions du contenu principal. Avec cette solution, aucune modification ergonomique n’est apportée mais l’affichage est optimisé pour rendre la lecture relativement confortable.

Déclinaison ergonomique : l’interface est entièrement repensée et adaptée à la navigation iPad. Une réflexion ergonomique sera réalisée en fonction de l’usage de vos clibles, de la taille de l’écran dans ses orientations verticales et horizontales. Cette solution apporte une réelle adaptation aussi bien au niveau de l’UX que de l’UI. L’arborescence de l’application peut, par exemple, être complètement différente pour laisser place à une navigation plus iconisée (les onglets d’un menu pouvant devenir des icônes ou des images).

 

Exemples de déclinaisons

Image-Aucune-déclinaison-1.png

Application Weight Watchers
Aucune déclinaison

Image-Déclinaison-légère.png

Application Linkedin
Déclinaison légère

Image-déclinaison-ergonomique.png

E-catalogue Legrand
Déclinaison ergonomique
(Conception Wopata)

Pourquoi adapter une application iPad ?

D’abord parce que l’usage de la mobilité est différent sur iPad et qu’il faut le prendre en compte dans l’expérience utilisateur. D’un point de vue personnel, on l’utilise bien souvent à la maison, dans un cadre familial, là où plusieurs utilisateurs le prennent en main. Il est considéré comme un petit ordinateur de salon dans la mesure où il permet de faire une recherche sans avoir à allumer l’ordinateur et qu’il est plus confortable qu’un iPhone dans la lecture de l’information.

Côté professionnel, l’iPad participe à la transformation digitale des entreprises. Très utiles aux équipes de terrain (commerciaux, formateurs, maîtres d’oeuvre, etc.), ses applications deviennent, tour à tour, outil d’aide à la vente (eADV), logiciel de planification, interface d’accès à distance au cloud de l’entreprise et bien d’autres. Les interfaces BtoB doivent donc être très intuitive et simple dans leur navigation pour améliorer la productivité.

Ensuite, parce que contrairement à l’iPhone, l’iPad est généralement orienté en paysage. Une étude récente réalisée par Onswipe, révèle que 59,8% des utilisateurs possesseurs d’iPad préfèrent l’utiliser en mode paysage contre 41,2% qui préfèrent le mode portrait.  orientation-ipad-portrait-paysage.png

Et enfin parce que l’application doit inspirer confiance et convertir les utilisateurs. De même que pour les adaptations Android/iOS, une application bien adaptée véhicule une meilleure image et donc une plus grande confiance. 

Combien coûte une déclinaison iPad ?

L’équipe qui réalisera l’adaptation doit tenir compte des spécificités de votre projet et de votre budget. L’objectif n’est pas de réaliser une déclinaison ergonomique à tout prix si une déclinaison légère suffit. Elle est d’ailleurs recommandée en premier lieu. Certaines applications aux workflows simples et aux contenus structurés pourront très bien fonctionner avec une déclinaison légère.

Chez Wopata, il faudra ajouter 15 à 30% sur le prix de votre application pour une déclinaison légère. L‘interface est étirée, les polices et le contenu sont adaptés et certains éléments sont repositionnés.

Pour une déclinaison ergonomique, il faudra plutôt ajouter entre 50 à 75% à votre budget. Cette option nécessite un re-développement de l’ensemble des écrans car l’ergonomie est entièrement repensée et n’a plus du tout la même cinématique que l’application iPhone.

L’avis de Maxime et David, développeurs iOS chez Wopata

 » La logique métier d’une application iPhone (ses règles de gestion, ses algoritmes, le traitement de ses données) est réutilisable sur iPad. Ce qui nécessite une adaptation, c’est l’interface utilisateur. 80% du travail de développement consiste donc à adapter les composants des écrans. Pour obtenir un résultat satisfaisant et raisonnable en terme de coût, on utilise généralement les 3 types de déclinaison selon l’importance et la complexité du contenu de chaque écran. On portera une attention particulière à la déclinaison des écrans principaux tels que l’écran de home ou ceux présents sur la tab bar iOS, alors que les écrans secondaires (Gestion du compte, FAQ, Conditions générales) ne nécessiteront pas ou peu de déclinaison.  » nous précise Maxime.

 » Lors d’une déclinaison d’application sur iPad, la durée de développement dépend également de l’adaptation de son workflow. Il faut penser à ajouter les analytics qui seront spécifiques sur iPad, dans les cas où l’interface n’est pas la même que sur iPhone. Une importante phase de tests est également nécessaire pour contrôler l’intégration de chaque écran, notamment en vérifiant qu’il n’y ait pas d’effets de bord. «  ajoute David.

 

Sources :