{"id":664,"date":"2017-09-27T15:05:33","date_gmt":"2017-09-27T15:05:33","guid":{"rendered":"http:\/\/cmuems.com\/2017\/60210b\/?page_id=664"},"modified":"2025-03-24T12:57:00","modified_gmt":"2025-03-24T12:57:00","slug":"assignment-order-vs-disorder-noise-function","status":"publish","type":"page","link":"https:\/\/mycours.es\/digitalmedia\/assignment-order-vs-disorder-noise-function\/","title":{"rendered":"Assignment: Order vs. Disorder"},"content":{"rendered":"

Assignment<\/strong>
\nMake a composition with controlled randomness which depicts \u201corder\u201d when the mouse cursor is on the left side of the canvas, and “disorder” when it is on the right side. The degree of order\/disorder should vary gradually with the position of the mouse.
\nOptional: The transition fades a sound loop in synesthetic relationship with the visuals.<\/p>\n

\n

Requirements<\/strong><\/h2>\n

-No size requirement
\n-Use for loops
\n–Try to use maximum 3 colors<\/span>
\n-Check the examples below for reference but don\u2019t make a variation of it. The grade will be mostly based on the originality of your sketch.
\n-You can try to use noise and oscillations<\/a> instead of random.
\n-You can use rotational symmetry<\/a> instead of a grid<\/p>\n

Deliverable<\/strong><\/h2>\n

Post it on the openprocessing classroom with a proper title and a thumbnail image.<\/p>\n

Part 2 in class
\n<\/strong>Try to recreate your sketch or respond to the assignment prompt with the help of ChatGPT or copilot. Let’s have a discussion later.<\/p>\n

Grading criteria<\/strong><\/h2>\n

It runs without errors
\nIt is not a variation of the basic example
\nYou used something that was not explained in class, did some research.
\nYou understand what’s going on, you can explain the code (and you will be asked to during critique).
\nIt has an intentional aesthetic: color, movement, and composition are deliberate and work together
\nThe sound is a seamless loop and it works with the visuals<\/p>\n

Resources<\/strong><\/h2>\n

\"\"<\/a><\/p>\n

Tutorial here<\/a><\/p>\n

Template<\/a>: you can fork this sketch<\/p>\n<\/div>\n

Creating seamless loops<\/h2>\n

You can start searching for sounds on freesound <\/a>\u00a0(free but mandatory account)<\/p>\n

Download and edit it in Audition if you want.<\/p>\n

Load it on this web application<\/a>
\nSelect the area you want to loop on the top
\nExtend the crossfade by dragging the CF handle in the middle row
\nAdjust the bottom row if you hear “pops”
\nDownload the file
\nRename it to something simple like disorder.wav<\/p>\n

Upload the sound file on openprocessing:
\ncode settings on the right > files > upload<\/p>\n

Change loadSound(‘filename.mp3’); using your file name. You may want to rename your file to something simple before you upload it.<\/p>\n

Using sound on openprocessing<\/h2>\n

If you want to make a sound-enabled sketch instead of forking the example above you have to:<\/p>\n

Include the p5.sound add on by opening the menu on the right and activating the switch:<\/p>\n

\"\"<\/p>\n

All the sound functions are in this section of the manual p5.sound<\/a><\/p>\n

Student Samples<\/h2>\n

https:\/\/openprocessing.org\/sketch\/1852386<\/a><\/p>\n

https:\/\/openprocessing.org\/sketch\/1858449<\/a><\/p>\n

https:\/\/openprocessing.org\/sketch\/1852529<\/a><\/p>\n

https:\/\/openprocessing.org\/sketch\/1865433<\/a><\/p>\n

https:\/\/www.openprocessing.org\/sketch\/596896<\/a><\/p>\n

https:\/\/www.openprocessing.org\/sketch\/454187<\/a><\/p>\n

https:\/\/openprocessing.org\/sketch\/1744048<\/a><\/p>\n

https:\/\/openprocessing.org\/sketch\/1744047<\/a><\/p>\n

https:\/\/www.openprocessing.org\/sketch\/454184<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"

Assignment Make a composition with controlled randomness which depicts \u201corder\u201d when the mouse cursor is on the left side of the canvas, and “disorder” when it is on the right side. The degree of order\/disorder should vary gradually with the position of the mouse. Optional: The transition fades a sound loop in synesthetic relationship with … Continue reading “Assignment: Order vs. Disorder”<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":11,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-664","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/mycours.es\/digitalmedia\/wp-json\/wp\/v2\/pages\/664","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mycours.es\/digitalmedia\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/mycours.es\/digitalmedia\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/mycours.es\/digitalmedia\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mycours.es\/digitalmedia\/wp-json\/wp\/v2\/comments?post=664"}],"version-history":[{"count":38,"href":"https:\/\/mycours.es\/digitalmedia\/wp-json\/wp\/v2\/pages\/664\/revisions"}],"predecessor-version":[{"id":4067,"href":"https:\/\/mycours.es\/digitalmedia\/wp-json\/wp\/v2\/pages\/664\/revisions\/4067"}],"wp:attachment":[{"href":"https:\/\/mycours.es\/digitalmedia\/wp-json\/wp\/v2\/media?parent=664"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}