Publié le 30 juin 2020, modifié le 30 juin 2020.
Par Christophe Romei
App

WWDC20 : concevez des widgets visibles, pertinents et personnalisés sur iOS

Publié le 30 juin 2020, modifié le 30 juin 2020.
Par Christophe Romei

Les widgets élèvent les informations opportunes de votre application vers les emplacements principaux sur iPhone, iPad et Mac.

Il est difficile de comprendre comment une fonctionnalité comme celle-ci a mis autant de temps à arriver sur l’iPhone et iOS. Ce ne sont pas les mêmes widgets que ceux trouvés dans les versions antérieures d’iOS. Peut-être allez-vous découvrir la réponse dans l’écoute de ce podcast qui revient sur l’un des usages les plus emblématiques de votre smartphone, le Widget !

Nous avons plusieurs réponses à ce sujet, l’une d’elles c’est qu’Apple n’a pas voulu à l’époque suivre Android en 2008 lors du lancement du G1 avec les widgets ! En 2020, Apple souhaite faire évoluer l’écosystème des applications, avec les App Clips et le Widget, les tendances asiatiques ont été dans la réflexion du géant, probable ?! Le fait de développer sur du multi-plate-forme nécessite des outils comme la création des widgets. Le langage de programmation Swift a aussi bien évolué pour ce type d’action sur le smartphone, ce qui permet un développement rapide.

Toujours est-il que le Widget est l’une des annonces phares de la keynote pour iOS 14. Revenons sur certains points pour les développeurs et les marques qui vont se l’approprier. C’est donc une nouvelle expérience d’écran d’accueil sur iOS 14, beaucoup plus dynamique et personnalisée, avec un accent mis sur les widgets. Ceux-ci seront visibles et épinglés sur l’écran d’accueil de votre iPhone, iPad, et aussi sur macOS Big Sur. Les widgets sont multi-plates-formes pour que les développeurs puissent aussi facilement que possible appliquer leurs développements sur iOS, iPadOS et macOS. L’interface utilisateur des widgets dans WidgetKit est donc entièrement construite avec SwiftUI.

 

Un excellent widget est visible, pertinent et personnalisé.

1er point : Ils ne devraient pas y avoir besoin d’interagir avec ou de faire autre chose que de jeter un coup d’œil rapide pour tirer le meilleur parti de votre widget. Apple part du principe que vous n’avez pas besoin d’appuyer sur des boutons ou même de passer du temps à essayer de comprendre une interface utilisateur compliquée.

2ème point : Le contenu est au centre.

3ème point : C’est très important, les widgets ne sont pas des mini-applications. Considérez cela comme la projection de contenu de votre application sur l’écran d’accueil.

L’espace est limité sur les plates-formes mobiles, Apple souhaite vous assurer que le bon widget est disponible dès que vous en avez besoin. C’est là qu’intervient Smart Stacks qui sont une collection de widgets qui pivoteront automatiquement pour afficher le bon widget en haut. Ils utilisent l’intelligence sur l’appareil pour vous aider à montrer ce que vous souhaitez voir ! Les widgets peuvent être configurés de deux manières différentes : statiquement et dynamiquement en utilisant des intentions (qui est le même système qui alimente Siri et les raccourcis). Le fait qu’un widget soit statique ou dynamique n’influence pas réellement sa capacité à afficher des données dynamiques – mais détermine plutôt si l’utilisateur est capable de configurer le widget lui-même, ou si sa présentation doit être déterminée statiquement par notre implémentation.

Une API WidgetKit spécifique a été créée pour aider l’OS à déterminer quand votre widget sera le plus pertinent ou quand quelque chose d’autre pourrait l’être.

4ème point : Un excellent widget devrait vous permettre de le personnaliser.

Par exemple, il faut utiliser la métrique du pays dans lequel est développée votre apps : le Km ou le miles par exemple ! Vous pouvez l’avoir en trois tailles différentes : petite, moyenne ou grande. Apple recommande de prendre en charge autant de tailles que possible. WidgetKit fait que nous pouvons générer cette interface utilisateur de configuration entière à partir de votre intention de manière complètement automatique, sans travail supplémentaire de votre part.

“Glanceable experience”

Les personnes accèdent en moyenne à l’écran d’accueil plus de 90 fois par jour et n’y passe que quelques instants. Donc l’idée est surtout de ne pas avoir une multitude de widgets qui ne servent à rien ! Mais qu’il soit compréhensible en un coup d’œil, ou avec des regards occasionnels, et ne nécessitant par conséquent qu’une attention minimale, la “glanceable experience”.

Les équipes du géant se sont inspirées des complications sur watchOS pour construire les widgets. Cela signifie que les extensions WidgetKit sont des extensions d’arrière-plan qui renvoient une série de hiérarchies de vues dans une timeline. Puis ils sont envoyés à l’écran d’accueil qui les présentera au bon moment en fonction de la chronologie.

Voici une règle d’or : les gens regarderont un écran de bureau pendant trois minutes. Ils passeront 30 secondes sur leur smartphone. Mais ils ne passeront que trois secondes avec une application sur une montre. Trois secondes pour communiquer des informations vitales, fournir un service ou aider quelqu’un à agir.

Ci-dessous, construire un widget bancaire nécessitera de regarder l’usage de votre cible client, n’oubliez pas qu’il est destiné à vous faire gagner du temps et à prolonger l’expérience de l’application.

Il y a trois types d’expériences d’interface utilisateur auxquelles vous devez penser :

  • C’est un espace réservé dans l’UI,
  • Le fait qu’il est instantané,
  • Qu’il agit dans la timeline du temps.

La timeline est une combinaison de vues et de dates renvoyées, qui vous permettent de dire à quelle heure une vue particulière doit être affichée. Mais rappelez-vous que les widgets ne visent pas à créer une expérience de “course en direct” sur l’écran d’accueil. Il serait dommageable d’y mettre des résultats sportifs toutes les minutes !

L’une des fonctionnalités les plus intéressantes des widgets n’est pas seulement d’avoir un widget mais plusieurs. L’OS peut alors tourner intelligemment vers le widget le plus pertinent et votre application et votre widget peuvent aider à alimenter cette intelligence.

Lire aussi