Mise en page du blog

iPhone X : Comment s’assurer que votre application y sera adaptée ?

Yumea • oct. 20, 2017

L’iPhone X propose l’écran Super Retina de 5,8 pouces qui permet une immersion plus complète encore. La limite entre appareil et écran s’effacent un peu plus pour une expérience utilisateur toujours plus immersive. Mais cela suppose quelques vérifications, et peut-être des changements, à effectuer pour vous assurer que votre application sera compatible avec ce nouvel appareil. Voici donc quelques points à vérifier pour faire de l’iPhone X un avantage et non un frein à votre application !

Testez votre application sur Simulator

Téléchargez la dernière version de Xcode 9 et testez votre application sur Simulator. Repérez et réparez les problèmes d’interface utilisateur de votre application avant de la tester sur un appareil pour vous assurer qu’elle rendra bien sur iPhone X.Activez la résolution native en plein écran. Votre application fonctionnera en plein écran sur l’iPhone X si le SDK de votre projet est défini sur iOS 11 et si vous disposez d’une image de lancement Launch Storyboard ou iPhone X.Vérifiez chaque élément de votre application. Assurez-vous que votre interface utilisateur s’affiche correctement, qu’aucun élément n’est mal positionné (décalage, chevauchement, etc.), mal découpé, ou à la mauvaise échelle. Si vous rencontrez un problème, repositionnez correctement chaque élément en respectant les zones de sécurité de l’interface utilisateur.

Comment respecter les zones de sécurité de l’iPhone X ?

La mise en page de votre application doit remplir l’écran Super Retina de 5,8 pouces et chaque élément doit apparaître correctement et être cliquable facilement. Utilisez ces zones de sécurité de l’Iphone X pour vous assurer que votre application fonctionnera correctement dans ses nouvelles dimensions.

Les applications avec une mise en page personnalité peuvent facilement s’adapter à l’iPhone X, elles aussi. En particulier si votre application utilise la mise en page automatique et respecte les consignes suivantes.

La barre d’état

Ajoutez un espace aux bonnes dimensions sous la barre d’état, selon la zone de sécurité. Évitez de supposer une valeur pour la hauteur de la barre d’état, au risque de masquer ou de mal positionner le contenu en-dessous.

Les coins d’affichage arrondis et le capteur

Gardez le contenu et les commandes loin des coins et du boîtier du capteur pour remplir la totalité de l’écran sans couper la partie supérieure de votre application ou la faire apparaître derrière la barre d’état.

L’indicateur de page d’accueil

Avec l’iPhone X, plus de bouton de retour à l’accueil ; il suffira de glisser sur le bas de l’écran tactile. Assurez-vous donc que votre application n’interfère pas avec cet indicateur de retour à l’accueil et que vos éléments n’apparaissent pas sous l’indicateur. Ainsi, votre contenu et vos commandes resteront lisibles, claires et compatibles en permanence.

 

Screen Edge Gestures, ou Mouvements sur les bords d’écran

L’affichage sur l’iPhone X permet, par un simple mouvement sur les bords de l’écran, d’aller sur l’accueil, dans le centre de notifications, le centre de contrôle ou encore le sélecteur d’applications. Évitez d’interférer avec ces gestes. Déplacez les commandes de votre application dans la zone de sécurité et ajustez votre interface utilisateur.

Si c’est vraiment essentiel, vous pouvez envisager l’utilisation de la protection des contours. Cela consiste à permettre le contrôle de l’application avec un premier balayage, un premier geste, et à utiliser les commandes de l’appareil dans un second mouvement, un second glissement.

Une application responsive qui s’adapte à toutes les orientations et formats

Le format et la hauteur de l’écran de l’iPhone X diffèrent des autres appareils iPhones. En mode portrait, la largeur de l’écran de l’iPhone X correspond à celle des écrans de 4,7 pouces des modèles précédents, mais la hauteur est plus grande de 145 point par rapport à un écran 4,7 pouces.

Le nouveau format

De nombreuses applications placent le contenu en fonction d’une largeur, d’une hauteur ou d’un ratio particulier. Assurez-vous que votre application soit adapté et votre contenu correctement positionné.

Le mode paysage

Bien que le mode portait puisse révéler quelques problèmes, la majorité des changements à faire se trouveront probablement dans le mode paysage. Assurez-vous de tester toute votre interface utilisateur avec l’appareil en rotation, autant sur la gauche que sur la droite.

Les dimensions des vidéos

Une vidéo sur l’iPhone X devrait remplir l’écran entier. Toutefois, si cela entraîne un recadrage en haut ou en bas, ou un recadrage trop important sur les côtés, la vidéo devra être mise à la bonne échelle pour s’adapter à l’écran. AVPlayerViewController gère cet aspect automatiquement, mais certains lecteurs vidéo personnalisés basés sur AVPlayerLayer doivent sélectionner le paramètre approprié et permettre aux utilisateurs de basculer entre les modes d’affichages selon leurs préférences.

Nous espérons que cette liste vous permettra de bien vous préparer à l’arrivée de l’iPhone X sur le marché ou à résoudre au plus vite les possibles erreurs de compatibilité recensés ci-dessus.
Pour toute question, ou pour assurer les vérifications et améliorations de votre  application mobile  en vue de l’arrivée de l’iPhone X, demandez http5000. L’agence de communication digitale lyonnaise fera en sorte de donner à votre application l’aspect qu’elle mérite sur l’iPhone X !

CECI PEUT VOUS INTÉRESSER

17 avr., 2024
Les engagements pour l’écologie font partie des green flags que vous pouvez brandir à vos prospects pour les convaincre d’opter pour vos produits et services. Que ce soit pour réduire vos factures énergétiques ou bien pour avoir une image de marque extrêmement positive, le choix de solutions plus écologiques a de fortes chances de donner un impact positif à votre stratégie marketing. Découvrez-en plus grâce à notre article.
par Alexandra Dumas 18 oct., 2023
Vous êtes une entreprise en quête de succès sur le web ? Pour marquer votre présence en ligne, il est essentiel de confier votre image de marque à une agence de communication compétente. Chez Yumea, nous sommes spécialisés dans trois domaines clés : la création de site internet, la création de logo et le community management sur Instagram. Dans cet article, nous allons explorer ces services essentiels et comment ils peuvent propulser votre entreprise vers de nouveaux sommets en ligne.
par Alexandra Dumas 04 sept., 2023
🍁 L'été touche à sa fin, les feuilles commencent à tomber, et la rentrée est à nos portes. C'est le moment idéal pour revoir votre stratégie de communication digitale ! Chez Yumea, votre agence de communication lyonnaise de confiance, nous sommes là pour vous guider dans cette transition en douceur vers une communication plus efficace et impactante. 🌟
Plus de posts
Share by: