Concevoir pour Apple Watch directives de conception

Apple Watch propose un nouveau support pour communiquer avec les utilisateurs. Utiliser une application sur un appareil portable diffère considérablement de son utilisation sur votre smartphone. Pour guider les créateurs d’applications dans la construction d’une bonne application Apple Watch, Apple a publié des directives de conception destinées à les aider à concevoir une bonne application. Dans cet article, nous examinons ces directives.

Philosophie de conception

Pour concevoir de bonnes applications pour l'Apple Watch, il est important de comprendre la philosophie de conception que Apple avait à l'esprit lors de la conception de l'Apple Watch. Apple recommande de garder à l'esprit les bases suivantes.

Les interactions légères et personnelles sont le fondement de la conception d'Apple pour l'Apple Watch.

Poids léger

En raison de la taille réduite de l'écran et de la puissance de fonctionnement, l'Apple Watch devrait être principalement utilisée comme périphérique permettant la prise en charge d'interactions rapides..

Personnel

Un appareil n'a jamais été aussi proche de nous. Apple insiste sur la prudence et le respect de la connexion lorsque vous concevez une application Apple Watch.

Les interactions

Un utilisateur peut utiliser des gestes pour naviguer dans une application de quatre manières différentes:

  • Un tap déclenche un événement basé sur l'action.
  • Les balayages verticaux font défiler l'écran actuel (un utilisateur peut également utiliser la couronne numérique pour faire défiler).
  • Les balayages horizontaux affichent la page précédente ou suivante dans une interface basée sur une page..
  • Les glissières du bord gauche retournent à l'écran parent dans une interface hiérarchique.

Force Touch

Lorsqu'un utilisateur applique une pression sur l'écran Apple Watch, il détecte la force et affiche une incrustation de menu pour l'écran actuel. Par exemple, dans l'application d'alarme, Force Touch est utilisé pour ajouter une nouvelle alarme..

Retour haptique

Un moyen unique de donner une réaction à un utilisateur pour Apple Watch est de fournir une réaction haptique. Il existe différents types d'haptiques, chacun transmettant une signification spécifique telle que succès, échec ou clic..

Composants d'application

Apple propose une gamme d'options pour interagir avec une application, notamment des notifications, des regards et des complications..

Les notifications

Gauche: regard court. À droite: regard long.

Il y a une distinction entre un regard court et un regard long. Lorsqu'un utilisateur reçoit une notification et qu'il lève le poignet, il voit d'abord un bref aperçu. Un bref aperçu consiste en un titre, le nom de l'application et son icône..

Un long regard apparaît lorsqu'un utilisateur continue à consulter la notification au lieu de baisser le poignet. après voir le regard court. La zone de contenu pour une longue recherche est dynamique, mais la structure globale de la notification ne l’est pas. Vous pouvez ajouter des boutons à une longue recherche afin de rendre une notification exploitable..

Des regards

Un coup d’œil est un écran unique auquel l’utilisateur peut accéder sans avoir à ouvrir une application. Cela se fait en balayant l'écran d'accueil. Toutes les applications n'ont pas besoin d'un coup d'œil, elles constituent un seul écran informatif. Un utilisateur choisit les regards qu'il souhaite ajouter à son Apple Watch. En général, il y a quelques règles à garder à l'esprit lors de la conception d'un coup d'œil.

  • Un coup d'œil doit être rapide et facile à lire.
  • Un coup d'œil doit être pertinent sur le plan contextuel et non pas simplement un lanceur d'applications. Pour une application stock, vous devez afficher les prix du marché les plus récents, par exemple.
  • Contenu du regard aligné à gauche. Ceci est une norme pour tous les regards et maintient la hiérarchie visuelle cohérente.

Complications

Exemples de complications. De gauche à droite: Grand plat, Image en anneau et Image d'empilage.

Une complication ajoute des informations spécifiques à l'application sur le cadran de surveillance d'un utilisateur. Les cadrans de montre sont personnalisables et la manière dont les complications sont affichées sur un cadran de montre est diversifiée. Par exemple, vous avez des complications modulaires grandes et petites ainsi que des modèles circulaires parmi plus de. Les complications sont dessinées à l'aide de modèles, ce qui signifie que la personnalisation en termes de conception est limitée..

Pour en savoir plus sur les familles de complications et les modèles, consultez les directives d'interface utilisateur. Les complications sont facultatives.

Architecture de l'information

En général, il existe deux types de modèles de navigation pour répondre à vos besoins:

  • navigation par page
  • navigation hiérarchique

Navigation par page

Une navigation par page convient mieux à une collection plate d’informations. L'application se compose d'un certain nombre de pages simples. Un utilisateur peut glisser horizontalement entre les pages (et verticalement pour afficher plus de contenu sur une seule page). Il est conseillé de limiter le nombre de pages afin de maintenir la navigation fluide pour les utilisateurs..

Navigation hiérarchique

Une navigation hiérarchique fournit une hiérarchie. La conception la plus courante consiste à avoir une page de liste et une page de détail. Il est recommandé de n'avoir que deux ou trois niveaux de hiérarchie.

Alertes et fiches d'action

Un exemple de fiche d'action

Tout comme il existe des alertes et des feuilles d'action dans une application mobile typique, vous pouvez également utiliser ce type de navigation dans une application Apple Watch. Les instructions générales ici sont d’utiliser les alertes avec parcimonie, d’utiliser des messages succincts et d’offrir toujours la possibilité de rejeter une alerte..

Design d'interface

Afin de rendre les directives de conception de l'interface utilisateur plus faciles à digérer, j'ai résumé les règles les plus importantes ci-dessous..

  • Une Apple Watch est disponible en deux tailles, 38mm et 42mm. Le même contenu doit être affiché, quelle que soit sa taille, en utilisant le dimensionnement relatif.
  • En général, les éléments alignés à gauche. Le texte aligné à gauche est beaucoup plus facile à lire et les applications Apple Watch appliquent cette règle de manière cohérente.
  • Les applications ont toujours un fond noir pour créer l'illusion qu'il y a un écran sans bord.
Un rectangle arrondi est un motif de conception utilisé pour les boutons.
  • Évitez d'utiliser la couleur comme seul moyen de montrer l'interactivité. Le rectangle arrondi est un motif de conception cohérent pour les boutons..
  • Vous pouvez définir une couleur globale pour qu'elle agisse en tant que couleur principale de la marque. Assurez-vous que les couleurs que vous choisissez pour une application sont claires pour garantir la lisibilité et le contraste avec le fond noir..
  • N'incluez pas d'écran de lancement car il ralentit les vitesses d'interaction.
  • Apple Watch prend en charge les séquences d'images animées et les animations d'apparence, mais elles n'ajoutent généralement pas de valeur à votre application..

Typographie

Apple utilise SF Compact en tant que police système sur Apple Watch. Il existe deux variantes (la taille des points est basée sur des images de 144 pixels / pouce):

  • SF Compact Text pour les étiquettes dont le texte est de 19 pt ou moins
  • SF Affichage compact pour les étiquettes dont le texte est de 20 pt ou plus

Vous pouvez ajouter une typographie personnalisée, mais cela n'est pas recommandé.. Type dynamique est très utile sur Apple Watch, donc utiliser la police système est souvent la meilleure solution de design.

Apple fournit des styles de caractères intégrés standard, allant des titres aux notes de bas de page, pour réduire le besoin de typographie personnalisée..

Blocs de construction

Deux blocs de construction

Pour faciliter la création d'applications Apple Watch, Apple fournit un certain nombre d'éléments d'interface, que vous pouvez utiliser comme blocs de construction pour créer votre application. Vous trouverez ci-dessous une brève liste des différents outils que vous pouvez utiliser. Chaque élément d'interface a son propre ensemble de directives. Vous pouvez en apprendre plus sur ces directives dans la section ressources ci-dessous..

  • texte statique (étiquettes)
  • images
  • groupes (combine des images et des étiquettes, par exemple)
  • cueilleurs (manipulés avec la couronne numérique)
  • les tables
  • boutons
  • commutateurs
  • curseurs
  • Plans
  • films
  • étiquettes de date et de minuterie
  • des menus

Ressources

Apple fournit des ressources de conception que vous pouvez utiliser. Vous pouvez y accéder depuis le site Web Human Interface Guildeines d’Apple..

En outre, pour obtenir une indication des tailles de pixels exactes requises pour l'iconographie et les images à complications, Apple fournit une vue d'ensemble dans les consignes relatives à l'interface utilisateur..

Enfin, pour en savoir plus sur les instructions spécifiques aux différents éléments constitutifs de la création de votre application Apple Watch, vous pouvez en apprendre davantage dans la section Eléments d'interface des Directives de l'interface utilisateur d'Apple.

Conclusion

En vous conformant aux directives de conception d'Apple pour l'Apple Watch, vous vous assurez que votre application est compréhensible pour les utilisateurs d'Apple Watch. Simultanément, avec la typographie et les blocs de construction existants, il est possible de créer de superbes applications Apple Watch sans personnalisation..

Si vous souhaitez en savoir plus sur les consignes de conception, visitez le Manuel des interfaces utilisateur d'Apple pour Apple Watch. Si vous avez des questions, laissez-les dans les commentaires ci-dessous ou contactez-moi sur Twitter. Merci pour votre temps.