Professional Practices

Outcome:

Presentation PPT:

https://artslondon-my.sharepoint.com/:p:/g/personal/y_song0320201_arts_ac_uk/EX1soGFRzoRGsOx69HT7CZsBB1MuPhARJczXogwe2JQzuQ?e=7TAVYN

Making process record:

Initial idea

We were first inspired by an exhibition we saw in Beijing two years ago at 798, where we found the interactive projection very good and we were fascinated by it. Then, in this project, so at the beginning of the project, we decided to go for a way that was interactive because it had more freedom. At the same time we were attracted to the technique, so we wanted to learn how to create such effects and explore other possibilities for the medium than traditional animation.

in 798 museum Beijing

Our RESEARCH started with the technology because we didn’t know much about it, so we needed to know, well, what kind of software it is to produce these effects, how much time it takes and. What kind of inductors are needed, we found a lecture by a GMD teacher, and then what. She was a teacher who was responsible for projection mapping. And then she had a lot of experience. Then we learned that most of the software for this type of projection is said to be made with a touch designer.

https://lab.gmdlcc.com/lab/assemblage/  gmdlcc  

How we find sensor

Then at the first presentation, we had some group discussions and the teacher told me that I could go to the creative tech lab and ask if anyone had made the effect,

But the people at the tech lab didn’t know much about this specific technology. But they suggested that we could use lasers and then add a sensor to it, but I think that would be, well, a bit of a problem because when a person walks on the ground, they have to wear a laser pointer, otherwise it doesn’t interact with the ground.

Then we started to do some extensive searching, just under all the reviews of the ground-based interactive projections to find out if anyone knew where the technology actually came from. But most of the time, they only had the effects to show.
Then I pretended I was a student making a project on a shopping app and asked the merchant for advice
Finally, they said that it was radar-based. I then asked the radar vendor what kind of sensor I needed to make a 12 by 8-metre floor. They then told me the type of sensor and what it did.

Effects making

However, we didn’t know how long it would take to learn the software and it looked like it would be very difficult to learn. So, our initial plan was to create something that could interact with the ground. As long as it could interact, there wasn’t much of a concept.

Then I looked for a special tutorial on the internet to learn the effect. Depending on the type and stage of interaction. Sorting, then mixing the effects learned in the tutorials and trying out some new visual styles.

Customer, project research https://padlet.com/ysong03202011/nuits-de-bassins-gei1bp3euqcys08 

Technical tutorials https://padlet.com/ysong03202011/technology-tutorials-vz5q1w9pu7ya2kym  

Project examples https://padlet.com/ysong03202011/cases-jp2u5akvte9zrvi 

Comprehensive material https://padlet.com/ysong03202011/mood-board-general-t3oa9lkcspq3cfzw 

TDscreenrecord

Real-life test

Then I went through the tutorials and then I bought the radar for my first experiment. Well, our first experiment was in that animation classroom, M302. hmm, but it was particularly laggy because the computer was missing a charger, but by and large, the results were successful.

At first, we had a lot of technical problems, for example, the software did not support Mac, the radar was using a network interface but I did not have a converter. There was a problem with the IP configuration of the radar and there was no way to link the software to the address.

https://blog.csdn.net/qq_40946703/article/details/129805485

http://www.siminics.com/Surport/List 

http://www.sznplay.com sznplay

I search it on the internet to solve the problem, and for a computer, I use Yi’s windows Computer instead.

Real-life test2

Our second test was at the Yi house and now we fix the charger problem. Then again, we tried a lot of files and this time everything went quite well.

But we still needed to get it on the ground for the test. Then, then we looked for a venue at the school. We found four places, well, one was the little dark room in the school with the curtain, another one was a classroom in the middle of the school corridor for filming, and that had a pole on the ceiling so that we could hang the projector on it. The last venue was the creative tech lab, where they had something ready for us to test, but the downside of that place was that it was too small. Well, the last place we found was on the negative floor of the exhibition that connects the classrooms to the bridge at the entrance of the school.

We didn’t have access to the room where the film was shot because, the room where the film was shot, was always booked by someone else. Then the bridge in the middle of the first floor, for some reason there was something and it was prepared on the ground so we couldn’t use it. The first time we went to the small dark room, but because we were there too late. And what’s more, there was a light in that place that wouldn’t turn off all the time that couldn’t make the brightness of the projector change, so our second experiment failed.

We discussed that we could use our existing effects and footage to create a mock-up video to show the client what the project would look like if it was exhibited, then I built an installation in my toilet and shot some footage, my housemate found the installation when she went to the toilet, she thought it was interesting and took some photos.

one on toilet

Then what happens is that we YI cut a test video and then come and show our client roughly what they could see if they put this project on the projection festival. Next, we would go and some of the footage we were missing would be captured in one of the last videos

Then, we set up three different camera positions. The day before the PRESENTATION. The negative floor under the bridge was finally unused. Then, we shot a lot of video. In between some passers-by passed by and, well, then they tested the effect of the projection. It made for an interesting scene.

Research notes and links:

Projection mapping first reserch

General reference – Style reference – same workreference

Some questions: will we have exact dimensions and location of the show?

Past example

10 Global Art and Light Festivals to Inspire Your Projection Mapping Events
https://www.aristaproav.com/article_d.php?lang=en&tb=5&id=744
Mariana Leal (alumna)
https://lealanimation.myportfolio.com/work
https://alizesotelo.com/about
https://avimationyear1.myblog.arts.ac.uk/?p=452&page=4 blog (Avi)

https://lab.gmdlcc.com/lab/assemblage/ gmdlcc

Customer, project research https://padlet.com/ysong03202011/nuits-de-bassins-gei1bp3euqcys08
Technical tutorials https: //padlet.com/ysong03202011/technology-tutorials-vz5q1w9pu7ya2kym
Project examples https://padlet.com/ysong03202011/cases-jp2u5akvte9zrvi
Comprehensive material https://padlet.com/ysong03202011/mood-board-general-t3oa9lkcspq3cfzw

https://www.bilibili.com/video/BV1CJ411J7qw/?spm_id_from=333.337.search-card.all.click&vd_source=5e539b7c36972ecc006c823df5466d66 The light of designers, with code to create – a comprehensive introduction to Processing, probably the best Processing Chinese tutorial
https://lab.gmdlcc.com/lab/time-space-place/ Space + Place
https://pan.baidu.com/s/1bZfOpX7vZg4d1lq0qhCTEQ?pwd=pag3
Extraction code: pag3
TD Watercolor mouse interaction tutorial video
https://www.bilibili.com/video/BV1ag411s7fT/?spm_id_from=333.337.search-card.all.click&vd_source=5e539b7c36972ecc006c823df5466d66
LIDAR interactive projection principle
https://www.slamtec.com/cn/News/Detail/580
Processing connected to LiDAR to achieve interactive brick wall
https://www.bilibili.com/video/BV1ov4y1N71K/?spm_id_from=333.788&vd_source=5e539b7c36972ecc006c823df5466d66
LIDAR multi-touch program interactive projection game ground wall table interactive engine large screen interaction
https://mycreativetype.com
https://pointerpointer.com/
https://artslondon.padlet.org/jsargent0420221/james-sargent-online-studio-74j56il6t2ep85o0
https://www.youtube.com/watch?v=mTH7ZB4x47Q
https://www.youtube.com/watch?v=JONepJ0_wnI Keeping in Touch 02 – Particle Attractors & Kinect
https://www.youtube.com/watch?v=K_jXDAlENOk TouchDesigner Hokuyo UST-10LX[HokuyoChop]測域センサ 北陽センサ使い方
https://www.youtube.com/watch?v=dYyzK7_rLJg touchdesigner tutorial – Particle tracking the mouse
https://www.youtube.com/watch?v=GDZoOnzLYGo Interactive Particles – TouchDesigner + Kinect Tutorial 1
https://www.youtube.com/watch?v=pwwuZj8KK6M iPhone Sensors & Depth Camera in TouchDesigner Tutorial – Part 1!
https://derivative.ca/UserGuide/Tutorials TUTORIALS
https://www.youtube.com/watch?v=CFXDacq4j1c LidarTracker Tutorial 04 – Send TUIO and UDP
https://www.youtube.com/watch?v=tLbg22f6g_c How to Quickly Calibrate Sensor Data in TouchDesigner (Tutorial)
https://www.bilibili.com/video/BV1PP4y1m74L/?spm_id_from=333.337.search-card.all.click Music Wall Creation Ideas
https://www.youtube.com/watch?v=FwPp-pxfUYw Endless tunnel and Use of Replicator
https://www.youtube.com/watch?v=JSp9AQ_wBZw Reaction Diffusion and Paramterization :: Touchdesigner Live Stream

Thu 16 Feb
Our proposal.
Sy: Make several different compositional textures to form a series of solutions
The proposal and the rendering are a bit more complex

What we need to know.
The size of the interactions we use in the animation and the venue, and whether our interactions can have sound (for example, many of the references Sy posted are good because those people have a whole room to create the atmosphere, and we probably don’t have that kind of equipment)
Interaction principle of the essence of logic is a bit like the projector + sensor, projector = monitor, mouse = human feet, so it seems processing production of interactive brushes linked to a similar projection can complete the basic interaction floor (1. study the school whether there is a similar device 2. ask Taobao store owners can achieve + how much 3. directly take the online or sy code hands-on

Touchdesigner notes

Component Texture Operators Channel Operators Surface Operators Materials Data Operators
2D 3D
Shuffle
(2)

  • Convert data da to chop
    1.(only want the first column)(0.0) of the data 2. shuffle to change the arrangement 3. change the name 4. output

(3)

  • Info chop(only have judgment when touch point is greater than 1)
    (4)
  • Synthesize a base Stack the data of base together (didn’t understand)
    (5)
  • Sop– geometry Convert data to image
  • orthographic parallel light
  • give only geometry– instance
  • 16:9: put essentially compress the output data of the y-axis
    (6)
  • bug-couldn’t find xy, constant chop
  • Set it to a place outside of rendering (when there is no data) Sometimes the original solution is implemented
    3dpart
    instance makes geometry
    Sop–chop (coordinate conversion to 9 data)
    Grid-null—–sop-null—-circle–geometry instance(circle data for image axis data for reference use two composite one)-rander
    Press the blue button to show something

render pick dat(can convert instance geometry model)

  • Math change mapping range – convert to DAT (choptodat), create uv (need to give the data name), and then put the name and data together
  • Rpd – to know what instance was captured (fetch instance id) link randerpass top(?)
  • Select select the one put into render inside the data needed – select – select line – select the first line
    instance interaction
    lag

liquefy style

  • up and down v left and right u, map image pixels to uv
  • Glsl – change the color & parameters
  • display add noise harmonic(absTime.seconds) to generate dynamic
  • feedbacktop
  • feedbacktop
    diffusionreaction
  • (Draw a circle) circle-fit-null-blur-blur -somp-substract
  • (Feedback why is there at the generation point)
  • Make the generated lines slim and shiny-edege+level
  • coloring lookup+ramp
    particle
    Steps:Make gravitational field – Make small geometry – Extract velocity data – Determine
  • Grid-sort(random)-particle(four ports are source, collision, gravitational field, surface adsorption)
  • Insert point to remove the normal information for the particle to cling to
  • Add gravitational force (forec-radioforce) (axial force to make particles come out votexforce-rotate)
  • Make geometry: use tube and transform, then render the three pieces (how is geo connected???)
  • Geo instance (synthesis part) instanceing pull in just done particle information (synthesis can get a particle map, the camera tighten up a bit)
  • convert to chop (sop to) need velocity information (custom–v(0) v(1) v(2)) https://docs.derivative.ca/Attribute
  • Then select select the data inside v[0-2], math to expand the range (what does math do?)
  • Geoinstance integration of the role of 1. the production of the particle field of translation (?) and the geometry of the production of the merge, and then also need the rotation speed of the particle field (using the chop extraction)
  • add a judgment, so that the dependent part is zero, the farther you fly, the greater – need zinfo (and then chopselect-math) (but why is the farthest particle 0.3??) 0 (disappear) – 1 (appear)
  • use info to read information corresponding to the pixel, top to chop-get rgb conversion
  • a question: how does chop achieve the decision (seems to be math???)
  • filter interaction: op(‘grid1’).par.sizex/2*-1 extract the size of the object parameters to half of the minus (the left half of the x-axis parameters)
  • processing of data: x corresponds to chart x data, y corresponds to chart y data (math + expression) then choptosop (existing point coordinates)
  • Copy logic: radar coordinates + ball (copy)
  • bug: no interaction when an additional point – math determination (do not know what active do, as if to determine whether something is active) 0,1-0,0.17

  • PARTICLEGPU
    turbulence period
    TLSL
    Gals-math-null and then change the perspective
    noise change value(?) right-click displaypixelvaule to find the rgb value (to make the contrast stronger, then change the offset by four one??) -exponent
    (black is -1 white is 1) then math mapping -1-1 0,1(?) presumably to bring the range of the two math consistent?
    (to add math because the original value of noise is not 01) to have 01 parameters of the mapping and uv multiplication 0 is not displayed, 1 is the original uv color

Need something: change the particlegpu into a radar interaction component

constant is what does it do? (retain the name when the data is zero) () remember to change the mode to sum, otherwise there will be two data
slope: something that increases proportionally to speed (not quite sure what it does)
expression (role or judgment) because the calculation of the rate will appear when a large value, so you have to write the conditions to remove it
me.inputVal*10 *-1 if -5<= me.inputVal <= 5 else 0
In the middle is the condition The first is the operation to be performed if the condition is met, and the second is if it is not in the interval (else)
-1 root direction related (?) rename their names
What does math do?
These are related to the direction of gravity (did not understand the three parameters) (?)
-10 if me.inputVal ! =0 else 0 (if there is displacement, apply force (why only use the y-axis?)) anon
What is this merge of variables and quantification() with two merge
five variables and four constants – nine channels (the rest with constant ?????? why)


  1. z-coordinate
  2. radius
  3. type(?)
    4.z
    
    slope per sample in slope

Pixel style
Render three-piece set-sphere-wireframe-noise-geocomp(?)
Render-rgbkey (these two add an over??) Then copy a small pattern to do inside, the middle in attributecreate, both options are turned on (do not know what to do)
Feedback the specific understanding and use? (over gave feedback)

mousefeedback
Box-trans-mat(mat operator
) metallic finally why even geo? then rendering three pieces plus environment (environmentmap-noise)
Rgbkey color change adjust the camera view variation will let it run away-lookat null
sop-grid(instancing?)
camera applypretransform(???)
constant(?) Name xy and size, then connect them to the previous sop to associate them.
Then extract xy and size and divide them separately, and give this data to size
which is essentially size/number
Then what you have to do is put the top-chop and replace the y data

encountered a bug rat

Translated with www.DeepL.com/Translator (free version)