Partager via


Kit de conception Surface Duo (dans Figma)

Kit de conception Surface Duo

Le Kit de conception Surface Duo est une ressource de la communauté Figma qui aide les concepteurs d’applications et les développeurs à créer des expériences utilisateur double écran. Les composants de ce kit sont les blocs de construction de ce qui fait que Surface Duo ressemble à des produits Microsoft sur Android.

  • Cadre d’appareil : contours de l’appareil de couleur Glacier et Obsidian pour présenter des captures d’écran.
  • Zones sécurisées : les zones de sécurité empêchent le contenu de sous-accéder à l’en-tête, à la barre de navigation, aux onglets et à la charnière de l’application.
  • Interactions avec le stylet : comment concevoir des interactions pour l’entrée de stylet.
  • Modèles et recommandations de conception : les modèles de conception du kit montrent les possibilités d’affichage double écran pour différents scénarios d’application et la façon dont tous les éléments sont réunis pour une expérience produit significative.
  • Recommandations relatives aux vidéos et aux médias : conseils pour inclure des vidéos et des images dans une expérience utilisateur pliable.
  • Postures : les appareils à double écran peuvent être fournis dans une gamme de variantes matérielles et de conception industrielle. Le Surface Duo récemment lancé, ainsi que d’autres appareils, sont destinés à définir la catégorie, mais d’autres appareils peuvent être proposés avec des écrans plus grands ou des charnières de conceptions différentes. À mesure que vous concevez vos applications, gardez à l’esprit que vous devez éviter les conceptions propres aux spécifications d’appareils spécifiques disponibles aujourd’hui.
  • Disposition, contrôles et plug-ins : avec un facteur de forme double écran à l’esprit, nous nous sommes assurés que vous pouvez concevoir comme vous le souhaitez à l’aide de contrôles et de dispositions familiers. Nous mettons également en évidence les détails que vous devez connaître lors de la conception d’applications double écran, telles que la charnière et inclure des dispositions pour la conception en déplacement.
  • Composants : chaque composant est conçu pour être aussi plat que possible afin qu’ils soient faciles à gérer et à utiliser. Certains composants ont des couches masquées que vous pouvez activer/désactiver pour ajouter des variantes sans les détacher.
  • Ensemble de composants : composants maîtres pour la navigation et d’autres éléments de conception sous forme d’ensembles groupés qui permettent de mieux organiser les variantes contenant différents modèles, modes, nombres d’écrans et orientations.

Procédure pas à pas figma