Getting Started with TUIO and Flash
Posted: 13 March 2008 11:49 AM   [ Ignore ]
Administrator
Avatar
RankRankRankRank
Total Posts:  448
Joined  2006-11-09

Introduction:


I wanted to make a really easy to follow tutorial on how to get started using the TUIO Simulator with a Flash Client (EXE or SWF).
To get started read the following instructions, If you don’t know what TUIO is… I would recommend starting with the “What is TUIO?” section.

Requirements:


Flash Player 9+ (Download)
Java Runtime 6+ (Download)

Instructions:


1) Download the attached file and extract to your desktop.
2) Open Flosc.jar (then click start)
3) Open Simulator.jar
4) Open Test.exe
5) Go back to Simulator.jar and draw within the circle, you will see your actions replicated into Test.exe
5a) Use SHIFT+Click for multi-touch events. (see Simulator Help for more info)

Explanation:




Step by Step:


1) The TUIO (OSC) data is SENT from the Simulator OR Touchlib’s “osc.exe”.

2) The FLOSC gateway CONVERTS the OSC (UDP) data into XML (TCP)

3) The Flash client uses an XMLSocket to RECEIVE and parse the XML data then renders the cursors within your application.

Notes:

  • Host: localhost ---- Ports: 3000/3333
  • Remember TUIO and OSC are referring to the SAME data.
  • The reason we need Step 2 is because Flash CANNOT read UDP data, thus we convert it to TCP
  • The Direct Binary method is not covered in this tutorial. But you can read more about it here:
    Binary Socket Connection in Flash.


What is TUIO?


TUIO (Table-Top User Interfaces Objects) is a simple yet versatile protocol designed specifically to meet the requirements of table-top tangible user interfaces. Inspired by the idea of interconnecting various existing interactive surface interfaces such as the reacTable or AudioTouch. The TUIO protocol has been implemented using OpenSound Control and is therefore usable on any platform supporting this protocol.

Simply put: TUIO is just a standardized way of formatting OSC data.

TUIO Documentation (pdf)

Message Syntax:


Since TUIO is implemented using OSC it follows its general syntax:

/tuio/[profileName] set sessionID [parameterList] 
/tuio/[profileName] alive [list of active sessionIDs] 
/tuio/[profileName] fseq int32


Parameters:


The parameters defined in this section reflect the object properties we considered important for an interactive surface interface. A session ID number is assigned to each object. This is necessary to uniquely identify untagged objects across successive frames, and in the case where multiple objects tagged with the same classID are simultaneously present on the surface.

Some of these parameters (id, position and angle) are retrieved directly by the sensor. Others (speed, acceleration) are derived from these primary parameters using timing information. Computing these parameters on the low level side of an tangible user interface system allows a more efficient computation, since the necessary timing information does not need to be transferred to clients.

The parameters allowed in a set message:

s        sessionIDtemporary ob ject IDint32 
i        classID
fiducial ID numberint32 
x
yz        positionfloat32range 0...1 
a
bc        anglefloat32range 0..2PI 
X
,Z        movement vector (motion speed &ampdirection), float32 
A
BC        rotation vector (rotation speed &ampdirection), float32 
m        motion acceleration
float32 
r        rotation acceleration
float32 
P        free parameter
type defined by OSC packet header


Profiles:


We define a set of profiles, which apply to most table-style tangible user interfaces.This allows the tracking of ob jects and cursors on two dimensional surfaces and in special cases also in the 3D space above the table surface. If one of these predefined profiles does not meet a system’s requirements we also allow so-called raw profiles that send the raw sensor data, as well as free form profiles, which allow a user defined set of parameters to be transmitted.

2D Interactive Surface:

/tuio/2Dobj set s i x y a X Y A m r 
/tuio/2Dcur set s x y m r

3D Interactive Surfaces:

/tuio/3Dobj set s i x y z a X Y Z A m r 
/tuio/3Dcur set s x y z m r

Custom Profile:

/tuio/_[formatString] 
/tuio/_ixyP set s i x y 0.57


Related Articles

Image Attachments
TUIO_Diagram.jpg
File Attachments
SimulatorExample.zip  (File Size: 1963KB - Downloads: 885)
TUIO_Documentation.pdf  (File Size: 100KB - Downloads: 455)
 Signature 

~

Profile
 
 
Posted: 13 March 2008 04:11 PM   [ Ignore ]   [ # 1 ]
Jr. Member
RankRank
Total Posts:  40
Joined  2007-08-31

great! smile

Profile
 
 
Posted: 14 March 2008 03:37 AM   [ Ignore ]   [ # 2 ]
Elite
Avatar
RankRankRankRank
Total Posts:  120
Joined  2008-01-28

THNX !!

 Signature 

..’m not the best..but ‘m not like the rest....

Profile
 
 
Posted: 17 March 2008 06:46 AM   [ Ignore ]   [ # 3 ]
Sr. Member
RankRankRank
Total Posts:  69
Joined  2008-03-11

Thankswink

 Signature 

~ myHead.addEventListener(Event.ENTER_FRAME, functionProperly); ~

Profile
 
 
Posted: 27 March 2008 07:09 PM   [ Ignore ]   [ # 4 ]
Elite
Avatar
RankRankRankRank
Total Posts:  283
Joined  2008-01-04

Nice and simple c.moore! Well done!

 Signature 

ORION Multi-Touch Display (blog)
My YouTube

Profile
 
 
Posted: 01 April 2008 09:07 AM   [ Ignore ]   [ # 5 ]
Jr. Member
RankRank
Total Posts:  32
Joined  2008-03-23

nice work, maybe my pc is a bit slow, I experienced som legs, anyway, it shows me a lot about TUIO and Flash intercommunication

Profile
 
 
Posted: 01 April 2008 02:54 PM   [ Ignore ]   [ # 6 ]
Sr. Member
RankRankRank
Total Posts:  71
Joined  2008-02-16

Wow very solid tutorial! Very much appreciated. Thank you.

 Signature 

Visit http://www.crystalminds.net/

Profile
 
 
Posted: 25 April 2008 05:41 AM   [ Ignore ]   [ # 7 ]
New Member
Rank
Total Posts:  7
Joined  2008-03-20

Oh It’s great example.

Profile
 
 
Posted: 02 June 2008 02:29 PM   [ Ignore ]   [ # 8 ]
Sr. Member
Avatar
RankRankRank
Total Posts:  87
Joined  2008-01-16

Elegant, yet simple and easy to follow. Nice work. smile

 Signature 

EasterIsland, LLC.
My Signature Quote

Profile