TINK - sketching product experiences of connected objects
Tink is the result of my graduation project from the master in design for interaction at TUDelft. Tink is a web platform that connects products with one another via the Internet, it provides designers with a complete Internet of Things (IOT) development environment. Designers are provided with a rich stack of features to sketch, prototype and test IOT projects. Tink is a user-friendly, visual, collaborative, open-source tool for designers to build connected interactions among objects.
Tink is the result of my graduation project from the master in design for interaction at TUDelft.
Tink is a web platform that connects products with one another via the Internet, it provides designers with a complete Internet of Things (IOT) development environment.
Designers are provided with a rich stack of features to sketch, prototype and test IOT projects. Tink is a user-friendly, visual, collaborative, open-source tool for designers to build connected interactions among objects.
Create successful ePaper yourself
Turn your PDF publications into a flip-book with our unique Google optimized e-Paper software.
Building blocks<br />
Data To Track triggers Actions<br />
Building block library Code editor Deploy<br />
The behaviour <strong>of</strong> every entity is identified<br />
by tree different building blocks:<br />
The colour used in the design <strong>of</strong> the<br />
building blocks helps distinguish the type:<br />
blue for Data to Track, orange for Triggers<br />
and yellow for Actions.<br />
The shape <strong>of</strong> the right and left side <strong>of</strong><br />
the building block represent the kind <strong>of</strong><br />
messages that the building block uses as<br />
input/output.<br />
Nothing<br />
Boolean<br />
Int<br />
Floats<br />
Strings<br />
The messages that can be sent between the<br />
blocks have to be either boolean, string,<br />
int or floats.<br />
If the blocks uses messages, the value <strong>of</strong><br />
the message will be displayed inside the<br />
shape, attached either on the right or on<br />
the left <strong>of</strong> the building block.<br />
ciao<br />
Data To Track<br />
Integer trigger 110<br />
String action<br />
115.4<br />
String trigger<br />
Connections<br />
Float action<br />
Boolean trigger<br />
ciao<br />
115.4<br />
110<br />
Connections can be made by dragging the<br />
coloured outlet <strong>of</strong> a building block towards<br />
the coloured inlet <strong>of</strong> an other building<br />
blocks. The type <strong>of</strong> the outlet <strong>of</strong> the first<br />
has to match the inlet <strong>of</strong> the second.<br />
While the dragging is performed, a line<br />
will be pulled between the mouse and<br />
the starting building block. The shape <strong>of</strong><br />
the connectors helps visualizing where a<br />
certain message can be sent and therefore<br />
which building block can be <strong>connected</strong><br />
together.<br />
Entities are able to<br />
collect data. The data to<br />
track building block allow<br />
users to record events<br />
and data coming from<br />
the entities. The data<br />
recorded will be then<br />
visualized in the monitor<br />
view. According to the<br />
type <strong>of</strong> data recorded,<br />
this will have different<br />
visualization styles in the<br />
monitor view.<br />
According to the entity<br />
that is recording data,<br />
the data recorded might<br />
be related to either a<br />
physical data sensed by<br />
a <strong>connected</strong> object (e.g<br />
data sensed by a sensor<br />
embedded in a <strong>connected</strong><br />
object) or a digital event<br />
recorded by a virtual<br />
entity (e.g. how many<br />
like a picture got on<br />
Facebook, the average<br />
value <strong>of</strong> the sensor read<br />
among multiple entities<br />
etc.).<br />
Every entity can listen for<br />
events, and fire an action<br />
accordingly. Triggers<br />
are the blocks used to<br />
listen to events; Triggers<br />
are visible in the system<br />
diagram where they can<br />
be <strong>connected</strong> to Actions<br />
building blocks. either<br />
from the same or different<br />
entities.<br />
Triggers don’t accept any<br />
kind <strong>of</strong> input messages,<br />
but in order to be<br />
attached to an action<br />
they have at least to send<br />
out a boolean message.<br />
Every time a Data to Track<br />
building block is created<br />
a trigger related to that<br />
data is automatically<br />
generated. The user is<br />
allowed to use it, delete<br />
it or modify it.<br />
Again, according to the<br />
type <strong>of</strong> entity, triggers<br />
might be related to<br />
physical events or digital<br />
one according to the<br />
type <strong>of</strong> entity they are<br />
<strong>connected</strong> t0.<br />
When a trigger <strong>connected</strong><br />
to an action sends out<br />
a new value, the action<br />
<strong>connected</strong> to the trigger<br />
will be performed.<br />
Actions have to accepts<br />
(at least) a boolean<br />
message as input, and<br />
are able to send out<br />
messages as output.<br />
Again, according to the<br />
type <strong>of</strong> entity, triggers<br />
might be related to<br />
physical events or digital<br />
one.<br />
Add a new action to C<strong>of</strong>fe machine<br />
Initialize the global variable you will need here<br />
int relayPin = D6;<br />
Initialize the variable you will need here<br />
pinMode (relayPin , OUTPUT);<br />
Write the Check_C<strong>of</strong>fe_Made function<br />
String newAction ( float val){<br />
}<br />
Featured actions<br />
Boolean<br />
switch digital<br />
Action<br />
Pin<br />
Boolean<br />
Change neopixel<br />
Action<br />
color<br />
My actions<br />
ring bell<br />
Turn the table<br />
Or start from scratch<br />
new Action<br />
Boolean<br />
New Action<br />
Action<br />
String trigger<br />
A new building block can be added to the<br />
entity by clicking the appropriate plus<br />
button.<br />
Once the button is pressed a popup panel<br />
is shown in the foreground on top <strong>of</strong> the<br />
system diagram; The popup gives the<br />
user the possibility to choose between<br />
predefined building blocks or to create a<br />
new one from scratch.<br />
The user also has the possibility to save<br />
customized building blocks in a personal<br />
library in order to be able to reuse them in<br />
other future projects.<br />
Update LCD text<br />
LCD<br />
Search in the library<br />
Boolean Action<br />
turn servo motor<br />
Because the technological nature <strong>of</strong> the<br />
different entities is quite diverse different<br />
programming languages are going to be<br />
needed in order to define the behaviours <strong>of</strong><br />
the different entities.<br />
It was decided to focus just on <strong>connected</strong><br />
object entities for the scope <strong>of</strong> this project,<br />
some recommendation on how to configure<br />
the other entities will be provided in the<br />
recommendation section.<br />
The <strong>connected</strong> Object Building block<br />
is programmed using the Arduino<br />
programming language (C).<br />
The coding <strong>of</strong> the block presents a similar<br />
structure to the way Arduino code is<br />
structured, the editor presents in fact<br />
three distinctive areas to fill in with code<br />
as listed below:<br />
•Firstly the global variables that is needed<br />
in the rest <strong>of</strong> the snippet has to be defined.<br />
•Secondly the code that will have to go in<br />
the void setup() function <strong>of</strong> the Arduino<br />
code has to be defined.<br />
•The last area is where the behaviour <strong>of</strong> the<br />
building block is specified. The user has to<br />
fill in this block by writing a function. The<br />
skeleton <strong>of</strong> the function will be pre-filled<br />
by the system. The user will have to define<br />
what kind <strong>of</strong> message will the block sends<br />
out as output, and what kind <strong>of</strong> values the<br />
function requires as input.<br />
servo float newAction ( String val){<br />
String action<br />
115.4<br />
Once the code is created it needs to be<br />
uploaded to the boards. When the deploy<br />
button is pressed Arduino code will be<br />
generated and uploaded on to the specific<br />
board. If clones <strong>of</strong> that entity are present<br />
on the system diagram they will be updated<br />
as well.<br />
When the code <strong>of</strong> a building block gets<br />
modified the deploy button will be<br />
highlighted reminding the user that he<br />
needs to deploy the code to the hardware<br />
in order to be able to see the modification.<br />
The little downward pointing arrow can<br />
be used to access advanced features such<br />
as visualizing or downloading the code in<br />
order to modify it in a different IDE.