05 - Signal Flow - TouchDesigner Tutorial: Beginner Crash Course — Transcript

Full transcript

1. 0:01Now let's look at signal flow
2. 0:04So as we can see
3. 0:04even from this very very
4. 0:08you know introductory template that comes with TouchDesigner
5. 0:10there's already a bunch of operators
6. 0:12and there's already a bunch of wires that connect them together
7. 0:14And like we said
8. 0:16nodes or operators and their wirings are basically how you create advanced
9. 0:21and complicated functionality out of each one of these
10. 0:23little operators that does a very specific thing
11. 0:26So there's a few different things that we want to learn about
12. 0:29kinda signal flow and operator wiring
13. 0:32So the first is that all data travels from
14. 0:36left to right inside of our networks
15. 0:38So you know
16. 0:39if I kinda pan down here a little bit
17. 0:42I'll open the Op Create dialog
18. 0:44I'll create a movie file in operator
19. 0:48and you know
20. 0:49this is the leftmost part of my network
21. 0:51It it loads a
22. 0:52a picture of a little banana
23. 0:53which is kind of like a classic TouchDesigner little template movie
24. 0:58And then let's say I wanted to do something after it
25. 1:00uh what I would do is maybe
26. 1:02open the Op Create dialog again
27. 1:04make something like an edge top
28. 1:06which does some edge detection
29. 1:08And then if I wanted to connect these two together
30. 1:11what I would do is go to the output of the movie file in
31. 1:15and you can see as I hover over the output
32. 1:17it kinda becomes highlighted a little bit
33. 1:20And then there's two things that I can do
34. 1:21here to connect this to the edge operator
35. 1:24The first is I can simply click
36. 1:26hold down my mouse
37. 1:28drag it over to the input
38. 1:30and what you'll see is
39. 1:31as I get close to the input
40. 1:33it becomes kind of sticky
41. 1:34You know it it
42. 1:35it knows that I wanna probably connect these two things together
43. 1:37so even though I'm not exactly precise
44. 1:40once I'm within that range
45. 1:41you can see that it's trying to complete it
46. 1:43and all I have to do is let go of my left click
47. 1:46and then that banana is now feeding into that edge operator
48. 1:49which is doing a little bit of edge detection
49. 1:52So that's all that's all fine and great
50. 1:54So what if we wanted to disconnect this and
51. 1:56and maybe rewire it a different way
52. 1:58What we could do is hover our mouse over the wire
53. 2:01and you can see it becomes yellow when it's hovered
54. 2:05We can right click on it and hit disconnect
55. 2:11And then we can talk about the second
56. 2:12way that you can kinda connect operators
57. 2:14One of which I usually find a little bit easier is that
58. 2:17if you just click and release the mouse on the output
59. 2:22you essentially have the same functionality as before
60. 2:25except you don't have to hold the mouse down
61. 2:27You know in some cases
62. 2:28maybe you have to take the operator kind of a long distance
63. 2:32and clicking and dragging might be difficult
64. 2:33or maybe you're on a laptop
65. 2:35so actually physically kinda clicking holding
66. 2:37and dragging is a little bit difficult
67. 2:39So I usually prefer this method of
68. 2:42just you do a single click to grab the output wire
69. 2:45and then you go to where you wanna connect it
70. 2:47and then you click again
71. 2:49and you get that connection made
72. 2:51Now another way of disconnecting
73. 2:53which I find a little bit easier also than the kinda right click
74. 2:56and disconnect method
75. 2:57is that if you go to the input of an operator
76. 3:02and you hover over its input
77. 3:03we see it's highlighted here
78. 3:05we can click
79. 3:06drag our mouse away
80. 3:08and you can see it
81. 3:09it kinda almost looks like it wants to try
82. 3:11and find something to connect to
83. 3:12but if we click
84. 3:12and drag away and release over the blank area of the network
85. 3:16it'll disconnect whatever the last thing connected was
86. 3:20So these are a few interesting ways of
87. 3:22of connecting operators disconnecting operators
88. 3:25but as you can see
89. 3:25the really important thing we wanna think about with signal
90. 3:27flow is that everything flows from left to right
91. 3:30So as we're working on our applications
92. 3:31let's say we have um
93. 3:33this this image here of a banana going into an edge detection
94. 3:37then let's say we want to connect it to something like
95. 3:41uh HSV's adjusting
96. 3:44We connect those two things
97. 3:48and then let's say we go
98. 3:49and connect it to something like a analyze to
99. 3:53get some pixel value data out of it
100. 3:57You know we'll set this to maximum
101. 3:58You know whatever you wanna do
102. 4:00essentially it's always moving from left to right
103. 4:02Data's moving from left to right
104. 4:03It doesn't go back up the chain from right to left
105. 4:06It's always from left to right
106. 4:08Now one more thing that we wanna know about
107. 4:12signal flow is this idea of cooking
108. 4:16And we'll talk about this in more detail later
109. 4:18and especially in other uh
110. 4:19trainings that I have
111. 4:21such as the optimization one
112. 4:22This becomes really critical
113. 4:24but right now
114. 4:25we have this image and all these different operators
115. 4:28and you can see the
116. 4:30the wires themselves are just still
117. 4:34You know they're not animated or
118. 4:35or doing anything funny
119. 4:36They're just still
120. 4:37That's because nothing in any of this
121. 4:40kinda data that I'm sending through this
122. 4:42little chain of operators is changing
123. 4:45So this is in contrast to if I
124. 4:46if I zoom out a little bit
125. 4:47and come back up to the little default template here
126. 4:50You can see that there are other wires
127. 4:53which they have this kinda
128. 4:54almost little pattern animating through them of a little bit darker
129. 4:58and a little bit lighter
130. 4:59and that means that there's something dynamic happening
131. 5:02Some kind of data is changing
132. 5:04whether it's you know
133. 5:05you're playing a movie file and
134. 5:06and reading the next frame and displaying it
135. 5:09or in this case
136. 5:09there's some noise data that's being used to create this kinda live displacement effect
137. 5:15You can see that these kinda connections and wires are all animated
138. 5:20which means they're cooking
139. 5:21and a cook is basically every time that an operator has to update its input
140. 5:27or output and display that to
141. 5:29to the rest of the network
142. 5:31So what you can see here is that this movie file in
143. 5:34because it's just displaying an image of jelly beans
144. 5:37it never actually needs to update its data
145. 5:39so the wire coming out of it is static
146. 5:41It's not animated
147. 5:42Whereas you know
148. 5:43the wire coming out of this kinda animated little noise texture
149. 5:47that's all animated
150. 5:49The wire coming out of this displacement operator
151. 5:51it's animated
152. 5:52and so on and so forth
153. 5:54So it's important to
154. 5:55to just start to become aware of what kind of operators are cooking
155. 5:59which ones aren't
156. 6:00You know should those wires be animated
157. 6:02Are you expecting something dynamic to be happening or not
158. 6:05And then the key is that all data flows from left to right
159. 6:09So when you wanna start thinking about networks
160. 6:11you also wanna be thinking left to right
161. 6:13Don't don't do things like this crazy
162. 6:15thing that I've seen some people do
163. 6:17This is bad
164. 6:18Please please don't ever do that
165. 6:20The data doesn't flow top to bottom
166. 6:22You can even see it just makes the wires look crazy
167. 6:24Everything flows left to right
168. 6:26so you should structure your work
169. 6:27and also kinda your thought process from left to right