Modes de variable dans les prototypes

Avant de commencer

Qui peut utiliser cette fonctionnalité ?

Vous pouvez utiliser des variables dans les prototypes avec tous les forfaits. Le nombre de modes de variables disponible par collection dépend de votre forfait.

Toute personne disposant de l'accès peut éditer pour un fichier peut créer des prototypes.

Toute personne disposant de l'accès peut voir ou peut voir les prototypes uniquement pour un fichier peut consulter des prototypes.

Chaque variable de votre collection peut avoir plusieurs modes. Vous pouvez sélectionner et utiliser les valeurs de modes spécifiques dans vos actions et expressions de prototypage.

Les modes de variable peuvent être utilisés de plusieurs façons pour améliorer votre expérience de prototypage :

• Définir les valeurs de mode en fonction du contexte : Utilisez plusieurs valeurs de mode de la même variable dans votre conception et modifiez leurs valeurs indépendamment dans la même interaction
• Utiliser les valeurs des modes dans les expressions : Utilisez les valeurs des définitions de mode spécifiques pour construire des interactions et effectuer des calculs

Définition des valeurs du mode en fonction du contexte

Lorsqu'une variable possède plusieurs définitions de mode, utilisez l'action Set variable et le contexte mode pour modifier la valeur d'une définition de mode spécifique.

Cela peut s'avérer utile lorsque vous ne modifiez qu'une seule définition de mode d'une variable. Lors de l'affichage ou de l'utilisation de plusieurs modes d'une même variable dans un design, réglez leurs valeurs indépendamment les unes des autres.

Par exemple, regardez le design ci-dessous :

Chaque produit dispose d'un compteur permettant d'ajuster le nombre d'articles ajoutés au panier.

Si une variable numérique à mode unique est utilisée pour représenter le nombre d'articles, une variable et une interaction uniques sont nécessaires pour chaque liste de produits.

Au lieu de cela, vous pouvez utiliser une variable numérique à deux modes, un pour chaque produit unique.

L'utilisation de plusieurs modes permet de mettre à jour séparément le décompte de chaque élément.

1. Définissez le mode sur les calques ou objects parents.
1. Sélectionnez le calque, le groupe ou l'objet qui contient la variable appliquée. (Par exemple, sélectionnez le cadre qui contient l'image du produit et les informations relatives au melon).
2. Dans la section Layer de la barre latérale droite, cliquez sur Change variable mode.
3. Survolez une collection de variables et choisissez un mode. (Sélectionnez le mode « melon »).
4. Répétez l'opération pour tous les autres objets ou calques qui ne s'appliquent qu'à un mode spécifique. (Appliquez le mode « shiitakes » au cadre qui contient l'image du produit et les informations relatives aux champignons shiitake)
2. Modifiez la valeur de la variable appliquée à l'aide de l'action de prototype Set variable. (Par exemple, créez une interaction Set variable sur l'icône + pour chaque compteur de produits. Définissez la variable itemCount sur itemCount + 1.)

Toute variable contenue dans un calque dont le mode est défini ne mettra à jour que la valeur de cette définition de mode spécifique.

Utilisation des valeurs de mode dans les expressions

Sélection des définitions de mode dans les actions de prototypage

Pour sélectionner des modes de variables spécifiques dans les prototypes :

1. Créez ou cliquez sur une connexion prototype existante pour ouvrir la fenêtre modale Interaction Details.
2. Cliquez sur un nom de variable que vous avez utilisé dans l'interaction.
3. Dans le menu déroulant Modes, sélectionnez un mode spécifique de cette variable.

Une fois que vous avez sélectionné un mode, la variable est représentée à la fois par le nom de la variable et le nom du mode :

variableName:modeName

Génération d'expressions avec des valeurs de mode

Utilisez des expressions avec des modes variables pour calculer les valeurs d'une seule variable.

Cela peut s'avérer utile lors de l'écriture d'expressions utilisant plusieurs définitions de mode pour une même variable.

Prenons par exemple le même modèle que ci-dessus. Cette fois, des champs permettent de calculer le sous-total de chaque produit et un total général permet de calculer le prix total de l'ensemble de la commande.

Examinons maintenant la collection de variables :

Lorsque vous utilisez des expressions, il arrive que vous ayez besoin de valeurs distinctes pour chaque mode de variable. Par exemple, pour calculer l'itemSubtotal de chaque type de produit, utilisez une expression qui multiplie l'itemPrice par son itemCount.

Dans d'autres cas, vous aurez besoin d'une seule valeur de variable pour représenter le total des différents modes. Par exemple, pour calculer le total de la commande, créez une nouvelle collection de variables pour la variable cartTotal avec un seul mode.