In this workshop we’ll use the following Phidget devices in 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
We’ll use a VINT Hub Phidget HUB0002_0 to connect these phidgets one by one to the Kinetic Designer.
For every phidget we use, we’ll declare a specific device in the Devices panel.
To properly configure the phidget, we need to specify the Serial number of the Hub Phidget in use as well as the Port number the phidget is connected on.
Throughout this workshop we’ll cover a basic example of interaction with the phidget and some media.
It will not be specified but we recommend you create a separate timeline for each example and try experimenting further than the proposed example.
Dial
In the Devices panel create a Dial device.
Set the appropriate Serial number and Port in the Editor panel.
Drag & drop the device into a graph and create the Values node.
This node will output the value of the dial encoder that increments/decrements according to the direction in which the knob is turned.
In the timeline, add a Solid media with a size of 200×600 and position it in the center of your workspace.
Drag & drop the layer’s Rotation into the graph to have it as a node.
Connect the Value output from the Dial node to the Value input of the Rotation node.
Observe the result in the Preview panel.
Thumbstick
In the Devices panel create a Thumbstick device.
Set the appropriate Serial number and Port in the Editor panel.
Notice the values for X, Y and pressed properties when the thumbstick is actioned.
Drag & drop the device into a graph and create the Value node.
This node will output the X and Y coordinates sent by the thumbstick in the form of a Vector 2D
Add a From Vector 2D node to unpack the X and Y values.
In the timeline, add a Solid media with a size of 200×200 and position it in the center of your workspace.
Drag & drop the layer’s position into the graph to have it as a node.
Connect the X and Y values from the Form Vector 2D node to two Calibration 1D nodes.
Configure the Calibration 1D nodes as such:
| Component | In A | In B | Out A | Out B |
|---|---|---|---|---|
| X | -1 | 1 | 100 | 1820 |
| Y | -1 | 1 | 100 | 980 |
On each Calibration 1D node, click the Evaluate button to compute the coefficient and the offset.
Connect the Float outputs of these calibration 1D nodes to their corresponding inputs on the Position node of the media.
Observe the result in the Preview panel.
Touch Keypad
In the Devices panel create a Touch keypad device.
Set the appropriate Serial number and Port in the Editor panel.
Notice the state of the touch buttons when they are triggered.
Drag & drop the device into a graph twice to create the nodes Key 0 to 3 and Key 4 to 6.
When the keys are touched by the user, the corresponding boolean output passes from false to true.
We’ll use these booleans to modify the opacity of layers in our timeline.
In the Media List panel create a Solid media with a size of 274×1080 and drag & drop it 7 times in your timeline.
Set the positions to the following:
| Solid | X position |
|---|---|
| 1 | 1 |
| 2 | 275 |
| 3 | 549 |
| 4 | 823 |
| 5 | 1097 |
| 6 | 1371 |
| 7 | 1645 |
You can modify the colors of each layer to make them different from each other if you want to.
Drag & drop each layer’s opacity property into the graph.
Connect each key to an Operation node to multiply it by 100 and then to an Easing node before connecting it to the opacity property of each layer.
In the Easing node, set the duration and easing type of your liking. This will help give a nice fade in/out effect when the user interacts with the node.
Observe the result in the Preview panel.
Light
In the Devices panel add a Light sensor device.
Set the appropriate Serial number and Port in the Editor panel.
Drag & drop the device into a graph and create the Lux node.
This node will output the value of Lux read by the light sensor according to the amount of light received.
In the Media List panel create a Pattern media.
Drag & drop the pattern in your timeline, and drag & drop the layer’s Opacity into the graph to have it as a node.
Connect the Lux output to a Value display. Shine a bright light, like the flash of your phone into the light sensor and read the value’s output. (e.g. approximately 1500)
Connect the Lux output to a Calibration 1D node.
Set the In A to 0 and the In B to the value above (e.g. 1500). Set the Out A to 0 and Out B to 100 and click the Evaluate button.
Connect the output of the Calibration 1D node to the Opacity node.
Observe the result in the Preview panel.
Distance
In the Devices panel add a Distance Sensor (0-200mm) device.
Set the appropriate Serial number and Port in the Editor panel.
Drag & drop the device into a graph and create the Distance node.
This node will output the value of distance read by the sensor according to the distance of the detected object in front of it.
Drag & drop the Pattern media in your timeline and drag & drop it’s Scale into the graph to have it as a node.
Set the layer’s anchor point to Middle Center and position it in the middle of your workspace.
Connect the Value output of the Distance node to a Calibration 1D node.
Set the In A to 200 and the In B to 15. Set the Out A to 0 and the Out B to 1 and click the Evaluate button.
Connect the output of the Calibration 1D node to the Scale node.
Observe the result in the Preview panel.
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.