Structure de l'application Jutro

Cette page fournit une vue d'ensemble des éléments constitutifs de l'interface utilisateur d'une application.

Pour voir à quoi ressemble une application Jutro lorsqu'elle est entièrement assemblée, consultez la galerie Jutro.

Application Web

Les applications Web font référence aux applications créées sur la plate-forme Guidewire Cloud Platform à l'aide de Jutro Design System et sont alignées sur la structure d'application recommandée par Guidewire. Les applications Web peuvent être conçues/exécutées en tant qu'applications autonomes ou intégrées en tant que modules micro front-end dans d'autres applications. Toutes les applications peuvent être construites à l'aide de métadonnées et/ou de JSX.

La structure d'une application se compose des éléments suivants :

1. Plans
2. Modèles
3. Composants

Plans et mises en page

Les plans fournissent la structure globale de votre application et peuvent être définis globalement ou page par page. Lorsque vous sélectionnez un plan, vous pouvez également modifier la mise en page.

Les plans se composent des éléments suivants :

1. Un en-tête et un pied de page
2. Un panneau de navigation
3. Une zone de contenu

Modèles

Les modèles sont des modèles d'interface utilisateur reproductibles, constitués de composants Jutro, qui sont fréquemment utilisés dans le secteur de l'assurance IARD.

Les modèles peuvent être génériques, comme un écran de mise à jour de compte client, ou être liés à une ligne métier ou à une tâche spécifique à effectuer, comme l'ajout d'un véhicule ou le paiement. Vous pouvez trouver des exemples de modèles Jutro ici.

Attributs des modèles :

• Réactif, mais avec des valeurs min/max spécifiques
• Pas de mise en page de plan
• Métadonnées du composant
• Aucun système de grille, la valeur par défaut est flexible
• Peut être étendu

Composants

Les composants sont les éléments de construction de base de Jutro Design System. Chaque composant est conçu et implémenté pour répondre à un besoin spécifique en matière d'interaction ou d'interface utilisateur. Vous pouvez assembler des composants tels que des blocs Lego pour créer des modèles et des expériences utilisateur intuitives.

Les attributs du composant sont les suivants :

• Réactif, mais avec des valeurs min/max spécifiques
• Peut être construit avec JSX
• Peut avoir des propriétés prédéfinies

Les boutons, les notifications et les champs de saisie de texte sont tous des exemples de composants.

Vous rencontrerez également des composants plus grands qui combinent plusieurs éléments d'interface. L'en-tête global, par exemple, comprend des composants individuels tels que l'avatar, les notifications et la recherche.