Dans ce workshop, nous utiliserons les Phidgets suivants dans Kinetic Designer :
- Dial Phidget HIN1101_0
- Thumbstick Phidget HIN1100_0
- Touch Keypad Phidget HIN1000_0
- Light Phidget LUX1000_0
- Distance Phidget DST1000_0
- RFID Read-Write 1024_0
Nous utiliserons un VINT Hub Phidget HUB0002_0 pour connecter ces phidgets un par un au Kinetic Designer.
Pour chaque phidget utilisé, nous déclarerons un device spécifique dans le panel Devices.
Pour configurer correctement le phidget, nous devons spécifier le numéro de série du Hub Phidget utilisé ainsi que le numéro de port sur lequel le phidget est connecté.
Tout au long de ce workshop, nous couvrirons un exemple basique d’interaction avec le phidget et certains médias.
Il ne sera pas spécifié mais nous vous recommandons de créer une timeline séparée pour chaque exemple et d’essayer d’expérimenter autour de l’exemple proposé.
Dial
Dans le panel Devices, créer un device Dial.
Régler le numéro de série et le port dans le panel Editor.
Glisser-déposer le device dans un Graph et créer le node Values.
Ce node sortira en output la valeur du dial encoder qui s’incrémente/décrémente en fonction de la direction dans laquelle le bouton est tourné.
Dans la timeline, ajouter un Solid media avec une taille de 200×600 et le positionner au centre de votre espace de travail.
Glisser- déposer la Rotation de la layer dans le graph pour l’avoir en tant que node.
Connecter la sortie Value du node Dial à l’entrée Value du node Rotation.
Observez le résultat dans le panel Preview.
Thumbstick
Dans le panel Devices, créer un device Thumbstick.
Régler le numéro de série et le port dans le panel Editor.
Remarquez les valeurs pour les propriétés X, Y et lorsque le bouton poussoir est actionné.
Glisser-déposer le device dans un graph et créer le node Value.
Ce node sortira en output les coordonnées X et Y envoyées par le thumbstick sous la forme d’un Vecteur 2D.
Ajouter un node From Vector 2D pour extraire les valeurs X et Y.
Dans la timeline, ajouter un Solid media avec une taille de 200×200 et le positionner au centre de votre espace de travail.
Glisser-déposer la position de la layer dans le graph pour l’avoir en tant que node.
Connecter les valeurs X et Y du node Form Vector 2D à deux nodes Calibration 1D.
Configurer les nodes Calibration 1D comme suit :
| Component | In A | In B | Out A | Out B |
|---|---|---|---|---|
| X | -1 | 1 | 100 | 1820 |
| Y | -1 | 1 | 100 | 980 |
Sur chaque node Calibration 1D, cliquer sur le bouton Evaluate pour calculer le coefficient et le offset.
Connecter les sorties Float de ces nodes Calibration 1D à leurs inputs correspondants sur le node Position du media.
Observez le résultat dans le panel Preview.
Touch Keypad
Dans le panel Devices, créer un device Touch keypad.
Régler le numéro de série et le port dans le panel Editor.
Remarquez l’état des boutons tactiles lorsqu’ils sont actionnés.
Glisser-déposer le device dans un graph deux fois pour créer les nodes Key 0 to 3 et Key 4 to 6.
Lorsque les touches sont actionnées par l’utilisateur, la sortie boolean correspondante passe de false à true.
Nous utiliserons ces booleans pour modifier l’opacité des calques dans notre timeline.
Dans le panel Media List, créer un Solid media avec une taille de 274×1080 et le glisser-déposer 7 fois dans la timeline.
Définir les positions comme suit :
| Solid | X position |
|---|---|
| 1 | 1 |
| 2 | 275 |
| 3 | 549 |
| 4 | 823 |
| 5 | 1097 |
| 6 | 1371 |
| 7 | 1645 |
Vous pouvez modifier les couleurs de chaque layer pour les rendre différentes les unes des autres si vous le souhaitez.
Glisser-déposer la propriété opacity de chaque layer dans le Graph.
Connecter chaque touche à un node Operation pour la multiplier par 100 puis à un node Easing avant de la connecter à la propriété opacity de chaque layer.
Dans le node Easing, régler la durée et le type d’accélération à votre convenance. Cela permettra d’obtenir un bel effet de fondu enchaîné lorsque l’utilisateur interagira avec le node.
Observer le résultat dans le panel Preview.
Light
Dans le panel Devices, ajouter un device Light sensor.
Régler le numéro de série et le port dans le panel Editor.
Glisser-déposer le device dans un graph et créer le node Lux.
Ce node affichera la valeur de Lux relevée par le capteur en fonction de la quantité de lumière reçue.
Dans le panel Media List, créer un media Pattern.
Glisser-déposer le pattern dans votre timeline, et glisser-déposer la propriété Opacity de la layer dans le graph pour en faire un node.
Connecter la sortie Lux à un node Value. Diriger une lumière vive, comme le flash de votre téléphone, dans le capteur de lumière et noter la valeur de sortie. (par exemple, environ 1500)
Connecter la sortie Lux à un node Calibration 1D.
Régler In A sur 0 et In B sur la valeur ci-dessus (par exemple 1500). Régler Out A sur 0 et Out B sur 100 et cliquer sur le bouton Evaluate.
Connecter la sortie du node Calibration 1D au node Opacity.
Observer le résultat dans le panel Preview.
Distance
Dans le panel Devices, ajouter un device Distance Sensor (0-200mm).
Régler le numéro de série et le port dans le panel Editor.
Glisser-déposer le device dans un Graph et créer le node Distance.
Ce node affichera la valeur de la distance relevée par le capteur en fonction de la distance de l’objet détecté devant lui.
Glisser-déposer le media Pattern dans votre timeline et glisser-déposer sa propriété Scale dans le Graph pour en faire un node.
Régler le anchor point de la layer sur Middle Center et la positionner au milieu de votre espace de travail.
Connecter la sortie Value du node Distance à un node Calibration 1D.
Régler le In A à 200 et le In B à 15. Régler le Out A à 0 et le Out B à 1 et cliquer sur le bouton Evaluate.
Connecter la sortie du node Calibration 1D au node Scale.
Observer le résultat dans le panneau Preview.
RFID
In the Devices panel add a RFID device.
Set the appropriate Serial number in the Editor panel.
Note, contrarily to the previous widgets, this one is directly plugged into the Kinetic Designer and not via a Hub.
The serial number to input is the one on the RFID Phidget.
Drag & drop the device into a graph and create the Tag detected node.
This node will output the tag read on a RFID Tag when detected. It will also output a Trigger Event when it reads a tag.
In the Tasks panel, create an empty Task.
Drag & drop the task into the graph and connect the Trigger output of the RFID node to the Trigger input of the Task node.
Place the RFID tag on the reader and observe the task being triggered.
You can connect a Value node to the Tag output of the RFID node to read the value held by the tag as well.
Refer to the Phidget’s documentation for more information on using RFID.
Need more help with this?
Don’t hesitate to contact us here.