AWS annonce Cloudscape Design System, une solution open source pour la création d'applications Web intuitives,
la structure HTML interne de ses composants peut changer à tout moment

AWS a annoncé via une publication sur son site officiel la sortie de Cloudscape Design System, une solution open source pour la création d'applications Web intuitives. « Aujourd'hui, nous sommes ravis d'annoncer Cloudscape Design System, une solution open source permettant de créer des expériences utilisateur attrayantes et inclusives à grande échelle. »

Cloudscape se compose d'un ensemble complet de directives pour créer des applications Web, ainsi que des ressources de conception et des composants frontaux pour rationaliser la mise en œuvre. Elle a été construite pour et est utilisé par les produits et services AWS. Elle est publiée en open source afin que toute personne créant des produits sur le cloud puisse bénéficier du système de conception d’AWS.

Nom : AWSB.png
Affichages : 949
Taille : 155,0 Ko

« Nous l'avons créé en 2016 pour améliorer l'expérience utilisateur à travers les applications web AWS, et aussi pour aider les équipes à mettre en œuvre ces applications plus rapidement. Depuis lors, nous n'avons cessé de l'améliorer en nous appuyant sur les commentaires des clients et les recherches menées », déclare AWS.

Présentation de Cloudscape

Cloudscape est un système de conception open source pour créer des applications Web. Il a été construit pour et est utilisé par les produits et services d'Amazon Web Services (AWS). Nous l'avons créé en 2016 pour améliorer l'expérience utilisateur à travers les applications web appartenant aux services AWS, et aussi pour aider les équipes à mettre en œuvre ces applications plus rapidement. Depuis lors, nous avons continué à améliorer le système en fonction des commentaires des clients et des recherches. Apprenez-en davantage sur le système.

Chaque composant dispose d'un environnement de travail où les concepteurs et les développeurs peuvent voir comment le composant se comporte, ainsi que des exemples de code. Pour faire gagner du temps et épargner des efforts lors de la création, AWS propose des conseils détaillés sur les options d'accessibilité et les solutions de conception.

Lorsque vous créez des tests automatisés pour une application, vous interagissez avec les composants de Cloudscape. Par exemple, vous pouvez choisir un bouton Cloudscape et affirmer que l'application se met à jour pour refléter l'action que vous avez associée à ce bouton. La structure HTML interne des composants Cloudscape, y compris les noms des classes CSS, peut changer à tout moment.

C'est pourquoi AWS a créé des utilitaires de test pour chaque composant. Les utilitaires de test presentent des API stables afin que vous puissiez accéder aux parties pertinentes de ces composants sans vous soucier du bon sélecteur à utiliser. Les utilitaires de test de Cloudscape sont indépendants du cadre de travail et peuvent être utilisés avec n'importe quelle pile de test (de Jest et jsdom à WebdriverIO), ainsi qu'avec les éléments suivants :

  • Les tests unitaires, où vous avez généralement un accès direct au modèle d'objet de document (DOM) ;
  • Tests d'intégration, où il est typique de s'appuyer sur des sélecteurs de chaînes. Les utilitaires de test font partie du paquetage principal des composants.

Quelques composants de Cloudscape

Filtre de sélection

Un filtre de sélection permet aux utilisateurs de trouver des éléments spécifiques dans une collection de ressources en choisissant une ou deux propriétés.

Conteneur

Avec le conteneur, vous pouvez présenter un groupe d'éléments de contenu, en indiquant que les éléments sont liés. Par exemple, un tableau est un type de conteneur.

Section extensible

Avec la sélection extensible, les utilisateurs peuvent développer ou réduire une section. Il est recommendé d’utiliser des sections extensibles lorsque vous avez plusieurs sections sur une page et que vous souhaitez permettre aux utilisateurs de voir une ou plusieurs sections à la fois. Les sections extensibles sont réduites par défaut.

Hotspot

Dans les didacticiels pratiques, les hotspots sont des conteneurs invisibles qui marquent les endroits où les icônes des hotspots doivent être placées. Les icônes de points chauds sont rendues par le contexte d'annotation et sont utilisées pour ouvrir et fermer les popovers d'annotation.

Panneau divisé

Un panneau ajustable qui permet d'accéder à des informations ou des contrôles secondaires. Il s'agit du principal composant permettant de mettre en œuvre la vue fractionnée, un modèle permettant d'afficher une collection de ressources avec des détails contextuels sur les ressources.

Wizard

Un formulaire à plusieurs pages qui guide l'utilisateur à travers un flux complexe ou une série de tâches interdépendantes. Un Wizard se compose d'un volet de navigation, d'un en-tête, d'une zone de contenu principal et de boutons d'action.

Source : AWS

Et vous ?

Quel est votre avis sur le sujet ?

Seriez-vous prêt à utiliser la solution open source, Cloudscape Design System, d'AWS dans un projet ?

Quelle solution utilisez-vous en ce moment ? Est-ce satisfaisant ?

Quelle fonctionnalité attendez-vous sur une telle solution ?

Quelles sont selon vous les améliorations à apporter à Cloudscape Design System ?

Voir aussi :

Apex, le cloud de Dell, pourrait être 50 % moins cher qu'AWS d'Amazon, il offre de nombreuses options d'achat et une grande flexibilité

AWS Mainframe Modernization, le service de migration des charges de travail mainframe vers le cloud, est disponible, des analystes redoutent que la dette technique finisse par vous rattraper

AWS, la division cloud d'Amazon, pourrait à elle seule dépasser IBM en termes de revenus annuels, une fois qu'IBM se sera séparé de Kyndryl, sa branche d'infogérance

AWS lance un outil gratuit de suivi des émissions de carbone qui favorise le cloud AWS par rapport aux systèmes sur site, revendiquant une réduction de 88 % de l'empreinte carbone des entreprises