├── .gitignore ├── IMA.md ├── ITP.md ├── LICENSE ├── README.md ├── module00-intro └── README.md ├── module01-vectors └── README.md ├── module02-forces └── README.md ├── module03-osc └── README.md ├── module04-systems └── README.md ├── module05-agents └── README.md ├── module06-softbody └── README.md ├── module07-fractals-ca └── README.md ├── module08-ga ├── README.md └── ga_design.md ├── module09-neuro └── README.md ├── noc-examples.md └── projects ├── README.md ├── final └── README.md └── simulation └── README.md /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store -------------------------------------------------------------------------------- /IMA.md: -------------------------------------------------------------------------------- 1 | # Evaluation for IMA (Undergrad) 2 | 3 | Grades for the course will follow the standard A through F letter grading system and will be determined by the following breakdown: 4 | 5 | - 25% Participation 6 | - 50% Assignments 7 | - 25% Final project 8 | 9 | At most two (2) unexcused absences will be tolerated without effect to your grade. Any more than two (2) unexcused absences will result a lowering of your final grade by one whole grade for each unexcused absence. For example, three (3) unexcused absences will result in your highest possible grade being a B instead of an A. Four (4) unexcused absences will result in your highest possible grade being a C and so on. Six (6) unexcused absences would result in an automatic F for the course. Two (2) late arrivals will count for one (1) absence. 10 | 11 | ## Assignment Grading 12 | 13 | There will be regular assignments that are relevant the class material. These assignments must be documented (written description, photos, screenshots, screen recording, code, and video all qualify based on the assignment) on a web platform of your choice. You are required to link to your assignment from the course repo (you may choose to use a privately shared google doc or password protected website if you prefer.) The due dates are specified on the assignment page. 14 | 15 | It is expected that you will spend 4 to 6 hours a week on the class outside of class itself. This will include reviewing material, reading, watching video, completing assignments and so on. Please budget your time accordingly. 16 | 17 | Each assignment will be marked as complete (full credit), partially complete (half credit), or incomplete (no credit). To be complete an assignment should meet the criteria specified in the syllabus including documentation. If significant portions are not attempted or the assignment is turned in late (up to 1 week) then it may be marked partially complete. If it is more than a week late, not turned in, or an attempt isn’t made to meet the criteria specified it will be marked incomplete. 18 | 19 | Assignment documentation is expected to be 200 to 500 words in length unless otherwise specified. 20 | 21 | ## Evaluation Rubric 22 | 23 | ### Point Scale 24 | 25 | | Value | Description | 26 | | ----- | ------------------------------------------------------------------------------------------------------------ | 27 | | **0** | **Missing**: Student did not submit assignment. | 28 | | **1** | **Incomplete**: The assignment is handed in late, undocumented, or otherwise not following the instructions. | 29 | | **2** | **Complete**: The assignment is complete and follows the criteria outlined below. | 30 | | **3** | **Outstanding**: The assignment has a highly creative concept and above and beyond documentation. | 31 | 32 | ### Criteria (aka “how to get a 3”) 33 | 34 | #### Project Documentation 35 | 36 | - Is the **full story of the project** described including ideas, triumphs and failures? (It’s ok if the project doesn’t work or if you struggled, just tell the story!) 37 | - Are **sources of inspiration and code examples** cited? 38 | - Are **classmates and others who helped** you referenced? 39 | - Is there **comprehensive visual documentation** (not just of the final result, but of the steps along the way)? 40 | - Does it include **thoughts on next steps**? 41 | 42 | #### Code 43 | 44 | - Does the code demonstrate an **understanding of the course material**? 45 | - **Are code sources credited** clearly in the comments? 46 | - **Did the student go beyond the examples provided** by incorporating their own ideas or additional programming concepts not covered in class? 47 | - Is it **legible or human readable**? Are things named appropriately? 48 | - Is it **commented**? If the student were to look at the code in a month, would they be able to know what they did and why? 49 | - Does the code leverage any **patterns** or **approaches** that are noteworthy? 50 | 51 | #### Reading Responses 52 | 53 | - Are **new questions** asked? 54 | - Is there a **point of view** / argument made? 55 | - Are **additional sources and references** mentioned? 56 | - Is the post funny, novel, or otherwise unique? 57 | 58 | ### Sources 59 | 60 | - [Creative Computing Fall 2019](https://itp.nyu.edu/classes/cc-f19/syllabus/) 61 | - [Frontend 3 CMD Amsterdam 2017](https://github.com/cmda-tt/course-17-18/tree/master/assessment-1#rubric) 62 | - [Code! Rubric](https://docs.google.com/document/d/1PmXrTvav546T8WWhthTTpR2ZL1YcNoZcth1VvHGYRiA/edit?usp=sharing) 63 | -------------------------------------------------------------------------------- /ITP.md: -------------------------------------------------------------------------------- 1 | # Evaluation for ITP (Grad) 2 | 3 | - Please read [ITP's policy on pass/fail](https://itp.nyu.edu/help/pass-fail/) 4 | - You are required to submit all weekly assignments and a final project. 5 | - Grading (pass/fail) will be based on a combination of factors: 6 | - Participation (25%) 7 | - Assignments (50%) 8 | - Final Project (25%) 9 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2020 The Nature of Code 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # The Nature of Code, Spring 2023 2 | 3 | Can we capture the unpredictable evolutionary and emergent properties of nature in software? Can understanding the mathematical principles behind our physical world help us to create digital worlds? This course focuses on the programming strategies and techniques behind computer simulations of natural systems. Topics explored range from mathematics and physics to simulations of complex systems. Subjects covered include motion, forces, trigonometry, fractals, cellular automata, genetic algorithms, and neural networks. Examples are demonstrated in JavaScript using the p5.js library. This course requires Introduction to Computational Media or equivalent (one semester of programming experience.) 4 | 5 | ## Code of Conduct 6 | 7 | This course follows the [ITP/IMA Code of Conduct](https://itpnyu.github.io/ITP-IMA-Code-of-Conduct/). 8 | 9 | ## Land Acknowledgement 10 | 11 | This classroom, New York University and Brooklyn, NY is situated on the continuously inhabited land of the Lenni Lenape people. I am making a donation to the [American Indian Community House](https://aich.org/) for the use of this space. 12 | 13 | ## Office Hours and Help 14 | 15 | For information on office hours and additional help, please see e-mail from the instructor. 16 | 17 | ## Schedule 18 | 19 | ### 1: Jan 25/26 - [Introduction](module00-intro) 20 | 21 | ### 2: Feb 01/02 - [Vectors](module01-vectors) 22 | 23 | ### 3: Feb 08/09 - [Forces](module02-forces) 24 | 25 | ### 4: Feb 15/16 - [Oscillating Motion](module03-osc) 26 | 27 | ### 5: Feb 22/23 - [Particle Systems](module04-systems) 28 | 29 | ### 6: Mar 01/02 - [Autonomous Agents](module05-agents) 30 | 31 | ### 7: Mar 08/09 - [Simulation Project](projects/simulation) 32 | 33 | ### SPRING BREAK 34 | 35 | ### 8: Mar 22/23 - [Soft Body Physics](module06-softbody) 36 | 37 | ### 9: Mar 29/30 - [Fractals and Cellular Automata](module07-fractals-ca) 38 | 39 | ### 10: Apr 05/06 - [Genetic Algorithms](module08-ga) 40 | 41 | ### 11: Apr 12/13 - [Neural Evolution](module09-neuro) and [Final Project Proposals](projects/final) 42 | 43 | ### 12: Apr 19/20 - **no regular class meeting** 44 | * see email updates for make-up sessions / individual meetings about [Final Project](projects/final) 45 | 46 | ### 13: Apr 26/27 - [Final Project Workshop](projects/final) 47 | 48 | ### 14: May 03/04 - [Final Project Presentations](projects/final) 49 | 50 | ## Evaluation 51 | 52 | - IMA: [IMA Grading Policies](IMA.md) 53 | - ITP: [ITP Grading Policies](ITP.md) 54 | 55 | ## Statement of Academic Integrity 56 | 57 | Plagiarism is presenting someone else’s work as though it were your own. More specifically, plagiarism is to present as your own: A sequence of words quoted without quotation marks from another writer or a paraphrased passage from another writer’s work or facts, ideas or images composed by someone else. 58 | Statement of Principle 59 | 60 | The core of the educational experience at the Tisch School of the Arts is the creation of original academic and artistic work by students for the critical review of faculty members. It is therefore of the utmost importance that students at all times provide their instructors with an accurate sense of their current abilities and knowledge in order to receive appropriate constructive criticism and advice. Any attempt to evade that essential, transparent transaction between instructor and student through plagiarism or cheating is educationally self-defeating and a grave violation of Tisch School of the Arts community standards. For all the details on plagiarism, please refer to page 10 of the Tisch School of the Arts, Policies and Procedures Handbook, which can be found online at: http://students.tisch.nyu.edu/page/home.html 61 | 62 | ## Use of Free and Open Source Code from Examples 63 | 64 | The following is adapted by permission [from Golan Levin’s Interactivity and Computation Course (Fall 2018)](http://cmuems.com/2018/60212f/syllabus/academic-integrity/) at Carnegie Mellon University. 65 | 66 | You must cite the source of any code you use. Please note the following expectations and guidelines: 67 | 68 | **Check the License.** When using others' code, pay attention to the license under which it has been released, and be certain to fulfill the terms and requirements of those licenses. Descriptions of common licenses, and their requirements, can be found at choosealicense.com. Some licenses may require permission. If you are confused or aren’t sure how to credit code, ask one of the course instructors and make your best good faith effort. Not properly citing code sources is grounds for a 0 on an assignment. 69 | 70 | **Use Libraries.** The use of general, repurposable libraries is strongly encouraged. The people who developed and contributed these components to the community worked hard, often for no pay; acknowledge them by citing their name and linking to their repository. 71 | 72 | **Be Careful.** It sometimes happens that an artist places the entire source code for their sketch or artwork online, as a resource from which others can learn. Assignments given in new-media arts courses are often similar; you may also discover the work of a student in some other class or school, who has posted code for a project which responds to a similar assignment. You should probably avoid this code. At the very least, you should be careful about approaching such code for possible re-use. If it is necessary to do so, it is best to extract components that solve a specific technical problem, rather than those parts which operate to create a poetic experience. Your challenge, if and/or when you work with others' code, is to make it your own. It should be clear that downloading an artwork from someone's GitHub and simply changing the colors would be disgracefully lazy. And doing so without proper citation would be outright plagiarism. 73 | 74 | ## Statement on Accessibility 75 | 76 | Please feel free to make suggestions to your instructor about ways in which this class could become more accessible to you. Academic accommodations are available for students with documented disabilities. Please contact the Moses Center for Students with Disabilities at 212 998-4980 for further information. 77 | Statement on Counseling and Wellness 78 | 79 | Your health and safety are a priority at NYU. If you experience any health or mental health issues during this course, we encourage you to utilize the support services of the 24/7 NYU Wellness Exchange 212-443-9999. Also, all students who may require an academic accommodation due to a qualified disability, physical or mental, please register with the Moses Center 212-998-4980. Please let your instructor know if you need help connecting to these resources. 80 | 81 | ## Statement on Title IX 82 | 83 | Tisch School of the Arts to dedicated to providing its students with a learning environment that is rigorous, respectful, supportive and nurturing so that they can engage in the free exchange of ideas and commit themselves fully to the study of their discipline. To that end Tisch is committed to enforcing University policies prohibiting all forms of sexual misconduct as well as discrimination on the basis of sex and gender. Detailed information regarding these policies and the resources that are available to students through the Title IX office can be found by using the following link: [Title IX at NYU](https://www.nyu.edu/about/policies-guidelines-compliance/equal-opportunity/title9.html). 84 | -------------------------------------------------------------------------------- /module00-intro/README.md: -------------------------------------------------------------------------------- 1 | # Introduction 2 | 3 | Welcome to the class! This first module is about getting acclimated to the class. What coding language / environment would you like to use? Suggested is p5.js but you are welcome to create your assignments with any language or framework you like. 4 | 5 | - [Introduction Slides](https://docs.google.com/presentation/d/1cQW-pC2c9kEFse-_g5KHol3DPVtHnHrlMuWKtwunjx4/edit?usp=sharing) 6 | 7 | ## Emoji Key 8 | 9 | The following emoji key will hopefully help you navigate the material for each module. 10 | 11 | - 🚂 Video tutorial from Coding Train 12 | - 🎥 Other video tutorial 13 | - 📕 Reading 14 | - 💻 Code examples 15 | - 🎨 Creative project references 16 | 17 | ## Core Material 18 | 19 | For each module, I will provide written and video tutorials on the topics. You can review whichever format suits you best. If the amount feels overwhelming, please reach out and we can help you narrow things down, and select a subset of the material to focus an exercise around. 20 | 21 | ### Text 22 | 23 | - 📕 [Nature of Code 2nd Edition Introduction](https://nature-of-code-2nd-edition.netlify.app/introduction/) 24 | 25 | ### Videos 26 | 27 | - 🚂 [Introduction to Perlin Noise](https://youtu.be/Qf4dIN99e2w) - 11 min 28 | - 🚂 [Perlin noise() vs. random()](https://youtu.be/YcdldZ1E9gU) - 10 min 29 | - 🚂 [Graphing 1D noise](https://youtu.be/y7sgcFhk6ZM) - 13 min 30 | - 🚂 [2D Random Walk](https://thecodingtrain.com/challenges/52-random-walker) - 15 min 31 | 32 | ### Reference Research and Artistic Work: 33 | 34 | - [Pulse Room](https://www.lozano-hemmer.com/pulse_room.php) by Rafael Lozano-Hemmer 35 | - [The Book of Shaders on Noise](https://thebookofshaders.com/11/) by Patricio Gonzalez Vivo & Jen Lowe 36 | - [Quantum Cloud Sculpture](https://en.wikipedia.org/wiki/Quantum_Cloud) 37 | 38 | ## p5.js Review 39 | 40 | If you feel you need a p5.js refresher, specifically around Object Oriented Programming in JavaScript (classes and objects), here are links to the ICM videos: 41 | 42 | - [Full p5.js track](https://thecodingtrain.com/tracks/code-programming-with-p5-js/) 43 | - [Starting with OOP in JavaScript](https://thecodingtrain.com/tracks/code-programming-with-p5-js/code/6-objects/2-classes) 44 | 45 | ## Supplemental Material 46 | 47 | For each module, I will provide a list of additional video tutorials and readings that you may draw on for further exploration. It's unlikely you would be able to consume everything in one week and if you are looking for guidance about what might fit with your learning style the most, please reach out. 48 | 49 | ### More about noise 50 | 51 | - 📕 [Perlin Noise with p5.js](http://genekogan.com/code/p5js-perlin-noise/) by Gene Kogan 52 | - 🚂 [2D Perlin Noise](https://youtu.be/ikwNrFvnL3g?list=PLRqwX-V7Uu6ZV4yEcW3uDwOgGXKUUsPOM) - 11 min 53 | - 🚂 [noiseDetail()](https://youtu.be/D1BBj2VaBl4?list=PLRqwX-V7Uu6ZV4yEcW3uDwOgGXKUUsPOM) - 4 min 54 | - 🚂 [Open Simplex Noise](https://youtu.be/Lv9gyZZJPE0?list=PLRqwX-V7Uu6ZV4yEcW3uDwOgGXKUUsPOM) 55 | 56 | ### More about Random Walks 57 | 58 | - 🚂 [Diffusion-Limited Aggregation](https://thecodingtrain.com/challenges/34-diffusion-limited-aggregation) - 47 min 59 | - 🚂 [Random Walker with Vectors and Lévy Flight](https://thecodingtrain.com/challenges/53-random-walker-with-vectors-and-levy-flight) - 16 min (Note: vectors will be explored in detail next week!) 60 | - 🚂 [Self Avoiding Walk](https://thecodingtrain.com/challenges/162-self-avoiding-walk) 61 | 62 | ### Code Examples 63 | 64 | - 💻 [Nature of Code Introduction Example Collection](https://editor.p5js.org/natureofcode/collections/q6TdDnTAp) 65 | - 💻 [Additional Perlin Noise Example Collection](https://editor.p5js.org/codingtrain/collections/qTyT_RX11) 66 | - 💻 [Basic Random Walk](https://editor.p5js.org/codingtrain/sketches/N-qqe1ExZ) 67 | - 💻 [Diffusion Limited Aggregation](https://editor.p5js.org/codingtrain/sketches/XpS9wGkbB) 68 | - 💻 [Random Walk Lévy Flight](https://editor.p5js.org/codingtrain/sketches/L24X90MBH) 69 | 70 | ## Assignment 71 | 72 | Using the random walker as a model, develop a sketch that experiments with motion. Here are some ideas but you should feel free to develop your own. 73 | 74 | - Use a random walker to "paint" colors. 75 | - Try a walk in 3D, see [Quantum Cloud](http://en.wikipedia.org/wiki/Quantum_Cloud) for an example. 76 | - Create a random walker with dynamic probabilities. For example, can you give it a 50% chance of moving in the direction of the mouse? 77 | - Use the random walker as a template to simulate some real-world "natural" motion. Can you develop a set of rules for simulating that behavior? Ideas: nervous fly, hopping bunny, slithering snake, etc. Consider the challenge of using minimal visual design, i.e. black and white primitive shapes. Can you give your "being" a personality? Can it express emotions -- happiness, sadness, fear? 78 | 79 | Another way of thinking about the assignment is to apply the rules of motion to another medium of expression: sound, color, number, scale... 80 | 81 | - Walk through RGB or HSB space (as opposed to XYZ) 82 | - Walk through Pan, Amplitude, Pitch (as opposed to XYZ) 83 | - Plot an "orchestra" of instruments on an XY plane and move a melody through it like. 84 | - Create a constantly morphing creature shape using `createShape()` and `vertex()`. Play with how you change the number of vertices, anchor points. 85 | 86 | ### Instructions 87 | 88 | - Document your work on the web with a short blog post. Here are some guiding questions if you are not sure what to write about: 89 | - What did you originally intend to create? 90 | - Narrate the process of creating your sketch. 91 | - What resources and examples did you draw on to create your sketch? What was most helpful / least helpful from this week’s materials. 92 | - What problems/discoveries did you encounter along the way? 93 | - Submit a link to your blog post to the [course wiki](https://github.com/nature-of-code/noc-syllabus-S23/wiki). 94 | -------------------------------------------------------------------------------- /module01-vectors/README.md: -------------------------------------------------------------------------------- 1 | # Vectors 2 | 3 | This module, we are really digging into the foundational material for the class. Almost every example all semester long will make use of vectors! This is a chance to learn about what vectors are, how they work in p5.js, and practice coding with them. 4 | 5 | ## Core Material 6 | 7 | For each module, I will provide written and video tutorials on the topics. You can review whichever format suits you best. If the amount feels overwhelming, please reach out and we can help you narrow things down, and select a subset of the material to focus an exercise around. It's a lot! 8 | 9 | - 📗 [Nature of Code p5.js edition draft Chapter 1: Vectors](https://nature-of-code-2nd-edition.netlify.app/vectors/) 10 | - 🚂 [What is a Vector?](https://thecodingtrain.com/tracks/the-nature-of-code-2/noc/1-vectors/1-what-is-a-vector) - 15 min 11 | - 🚂 [Vector Math](https://thecodingtrain.com/tracks/the-nature-of-code-2/noc/1-vectors/2-vector-math) - 12 min 12 | - 🚂 [Random Vectors](https://thecodingtrain.com/tracks/the-nature-of-code-2/noc/1-vectors/3-random-vectors) - 9 min 13 | - 🚂 [Static Functions](https://thecodingtrain.com/tracks/the-nature-of-code-2/noc/1-vectors/4-static-functions) - 9 min 14 | - 🚂 [Unit Vector](https://thecodingtrain.com/tracks/the-nature-of-code-2/noc/1-vectors/5-unit-vector) - 14 min 15 | - 🚂 [Acceleration](https://thecodingtrain.com/tracks/the-nature-of-code-2/noc/1-vectors/6-acceleration-vector) - 11 min 16 | 17 | ### Reference Research and Artistic Work: 18 | 19 | - [Espen Kluge, Alternatives](https://www.espen.xyz/alternatives-100-generative-portraits) 20 | 21 | ## Supplemental Material 22 | 23 | For each module, I will provide a list of additional video tutorials and readings that you may draw on for further exploration. It's unlikely you would be able to consume everything in one week and if you are looking for guidance about what might fit with your interests and learning style the most, please reach out. 24 | 25 | Following are videos on a variety of topics with code examples making use of vectors. 26 | 27 | - 🚂 [Drawing Object Trails](https://youtu.be/vqE8DMfOajk)—this example uses an array of vectors to store the history of an object. (19 min) 28 | - 🚂 [Horizontal Directional Drilling](https://thecodingtrain.com/challenges/172-directional-boring)—an example of a simulation of a drill that makes use of vectors to store position and direction. 29 | - 🚂 [Snake Game](https://thecodingtrain.com/challenges/115-snake-game-redux)—a basic "snake" game using vectors for the snake body and food position. 30 | - 🚂 [Ray Casting](https://thecodingtrain.com/challenges/145-ray-casting-2d)—basic ray casting engine that uses vectors for the "rays". 31 | 32 | ### Code Examples 33 | 34 | - 💻 [Nature of Code Chapter 1 Book Example Collection](https://editor.p5js.org/natureofcode/collections/MlQmiDlzCY) 35 | - 💻 [Nature of Code Chapter 1 Video Example Collection](https://editor.p5js.org/codingtrain/collections/-nLVvrmY7) 36 | - 💻 [Drawing Object Trails](https://editor.p5js.org/codingtrain/sketches/9DnjxCNB-) 37 | 38 | ## Assignment 39 | 40 | Try using vectors! Here are some suggestions: 41 | 42 | - Find any sketch you previously created in p5.js with separate `x`,`y` variables for elements on the sketch. Can you rewrite the sketch with `createVector()` for each of these pairs? For example, rework your sketch from week 1 and use vectors! Try incorporating the concept of _acceleration_. Can you create a methodology for calculating a dynamic acceleration, one that changes over time based on any number of factors? What is a random "acceleration" walk? 43 | - Zannah Marsh, illustrator for the Nature of Code book, created [a guide to creature design with code](https://docs.google.com/document/d/1klciKQwtuM6iqBghASlCCEQDh4-cN1qJSSul30vflZs/edit). Consider creating your own creature design in p5.js and incorporating it into the `Walker` or `Mover` class from any of the examples. 44 | 45 | ### Instructions 46 | 47 | - Document your work on the web with a short blog post. Here are some guiding questions if you are not sure what to write about: 48 | - What did you originally intend to create? 49 | - Narrate the process of creating your sketch. 50 | - What resources and examples did you draw on to create your sketch? What was most helpful / least helpful from this week’s materials. 51 | - What problems/discoveries did you encounter along the way? 52 | - Submit a link to your blog post to the course wiki. 53 | 54 | ## Emoji Key 55 | 56 | The following emoji key will hopefully help you navigate the material for each module. 57 | 58 | - 🚂 Video tutorial from Coding Train 59 | - 🎥 Other video tutorial 60 | - 📗 Nature of Code book 61 | - 📕 Other reading 62 | - 💻 Code examples 63 | - 🎨 Creative project references 64 | -------------------------------------------------------------------------------- /module02-forces/README.md: -------------------------------------------------------------------------------- 1 | # Forces 2 | 3 | ## Core Material 4 | 5 | For each module, I will provide written and video tutorials on the topics. You can review whichever format suits you best. If the amount feels overwhelming, please reach out and we can help you narrow things down, and select a subset of the material to focus an exercise around. It's a lot! 6 | 7 | - 📗 [Chapter 2](https://nature-of-code-2nd-edition.netlify.app/force/) 8 | - 🚂 [2.1 Simulating Forces: Gravity and Wind](https://youtu.be/Uibl0UE4VH8?list=PLRqwX-V7Uu6ZV4yEcW3uDwOgGXKUUsPOM) - 24 min 9 | - 🚂 [2.2 Mass and Acceleration](https://youtu.be/L7CECWLdTmo?list=PLRqwX-V7Uu6ZV4yEcW3uDwOgGXKUUsPOM) - 12 min 10 | - 🚂 [2.3 Friction Force](https://youtu.be/WBdhAuWS6X8?list=PLRqwX-V7Uu6ZV4yEcW3uDwOgGXKUUsPOM) - 14 min 11 | - 🚂 [2.4 Drag Force](https://youtu.be/DxFDgOYEoy8?list=PLRqwX-V7Uu6ZV4yEcW3uDwOgGXKUUsPOM) - 11 min 12 | - 🚂 [2.5 Gravitational Attraction](https://youtu.be/EpgB3cNhKPM?list=PLRqwX-V7Uu6ZV4yEcW3uDwOgGXKUUsPOM) - 16 min 13 | - 🚂 [2.6 Mutual Attraction](https://youtu.be/GjbKsOkN1Oc?list=PLRqwX-V7Uu6ZV4yEcW3uDwOgGXKUUsPOM) - 22 min 14 | 15 | ### Reference Research and Artistic Work: 16 | 17 | - [Mud Tub](http://tomgerhardt.com/mudtub/) by Tom Gerhardt 18 | - [Crawling Through New York City, performance by Pope.L](https://www.newyorker.com/culture/culture-desk/crawling-through-new-york-city-with-the-artist-pope-l) 19 | 20 | ## Supplemental Material 21 | 22 | For each module, I will provide a list of additional video tutorials and readings that you may draw on for further exploration. It's unlikely you would be able to consume everything in one week and if you are looking for guidance about what might fit with your interests and learning style the most, please reach out. 23 | 24 | - 🚂 [Attraction and Repulsion: Challenge 56](https://thecodingtrain.com/challenges/56-attraction-and-repulsion-forces) 25 | - 📕 [The Physics Classroom: Newton's Laws](https://www.physicsclassroom.com/Physics-Tutorial/Newton-s-Laws) 26 | 27 | ### Code Examples 28 | 29 | - 💻 [Nature of Code Chapter 1 Book Example Collection](https://editor.p5js.org/natureofcode/collections/peF4UyTtK) 30 | - 💻 [Nature of Code Chapter 2 Video Example Collection](https://editor.p5js.org/codingtrain/collections/ERtrjMQWe) 31 | - 💻 [Attraction and Repulsion](https://editor.p5js.org/codingtrain/sketches/6WL2O4vq0) 32 | 33 | ## Assignment 34 | 35 | Develop a sketch with motion driven by forces (vectors). Here are some ideas: 36 | 37 | - Using forces, simulate a helium-filled balloon floating upward (and bouncing off the top of a window). Can you add a wind force which changes over time, perhaps according to Perlin noise? 38 | - Create an example where instead of objects bouncing off the edge of the wall, an invisible force pushes back on the objects to keep them in the window. Can you weight the force according to how far the object is from an edge, i.e. the closer it is, the stronger the force? 39 | - Create pockets of air resistance / friction in a p5 sketch. Try using circles instead of rectangles, i.e. pockets of mud (or ice). What if you vary the strength (drag / friction coefficient) of each circle? What if you make some of them the opposite of drag—i.e., when you enter a given pocket you actually speed up instead of slow down? 40 | - Research a force not covered in class and implement it as a vector. 41 | - Use the concept of forces to visualize some input (Could be data, literal example would be use wind data and translate to a wind force in p5 (see: [The Wind Map](http://hint.fm/wind/)), but feel free to think more abstractly.) 42 | - Build a sketch that has both "Particles" and "Attractors". What if you make the Attractors invisible? Can you create a pattern / design from the trails of objects moving around attractors? This [p5.js coding challenge attraction video](https://thecodingtrain.com/CodingChallenges/056-attraction-repulsion.html) and corresponding [source code](https://editor.p5js.org/codingtrain/full/6WL2O4vq0) offers starting point. For inspiration, take a look at [Emily Webster's ‘The Abscissa Cycle’ from Nature of Code 2012](http://emilywebster.com/abscissa/) and [Laws of Attraction by Wipawe from Nature of Code 2016](https://wipaweeeeee.github.io/creativeCoding/lawsOfAttraction/index.html). 43 | 44 | ### Instructions 45 | 46 | - Document your work on the web with a short blog post. Here are some guiding questions if you are not sure what to write about: 47 | - What did you originally intend to create? 48 | - Narrate the process of creating your sketch. 49 | - What resources and examples did you draw on to create your sketch? What was most helpful / least helpful from this week’s materials. 50 | - What problems/discoveries did you encounter along the way? 51 | - Submit a link to your post to [the course wiki](https://github.com/nature-of-code/noc-syllabus-S23/wiki). 52 | 53 | ## Emoji Key 54 | 55 | The following emoji key will hopefully help you navigate the material for each module. 56 | 57 | - 🚂 Video tutorial from Coding Train 58 | - 🎥 Other video tutorial 59 | - 📗 Nature of Code book 60 | - 📕 Other reading 61 | - 💻 Code examples 62 | - 🎨 Creative project references 63 | -------------------------------------------------------------------------------- /module03-osc/README.md: -------------------------------------------------------------------------------- 1 | # Oscillating Motion 2 | 3 | ## Core Material 4 | 5 | For each module, I will provide written and video tutorials on the topics. You can review whichever format suits you best. If the amount feels overwhelming, please reach out and we can help you narrow things down, and select a subset of the material to focus an exercise around. It's a lot! 6 | 7 | - 📗 [Chapter 3: Oscillation](https://nature-of-code-2nd-edition.netlify.app/oscillation/) 8 | - 🚂 [3.1 Angles and Rotation](https://thecodingtrain.com/tracks/the-nature-of-code-2/noc/3-angles/1-angles-and-rotation) - 11 min 9 | - 🚂 [3.2 Angular Motion](https://thecodingtrain.com/tracks/the-nature-of-code-2/noc/3-angles/2-angular-motion) - 10 min 10 | - 🚂 [3.3 Angles and Vectors](https://thecodingtrain.com/tracks/the-nature-of-code-2/noc/3-angles/3-angles-and-vectors) - 10 min 11 | - 🚂 [3.4 Polar Coordinates](https://thecodingtrain.com/tracks/the-nature-of-code-2/noc/3-angles/4-polar-coordinates) - 16 min 12 | - 🚂 [3.5 Simple Harmonic Motion](https://thecodingtrain.com/tracks/the-nature-of-code-2/noc/3-angles/5-harmonic-motion) - 12 min 13 | - 🚂 [3.6 Graphing Sine Wave](https://thecodingtrain.com/tracks/the-nature-of-code-2/noc/3-angles/6-graphing-sine-wave) - 10 min 14 | - 🚂 [3.7 Additive Waves](https://thecodingtrain.com/tracks/the-nature-of-code-2/noc/3-angles/7-additive-waves) - 13 min 15 | 16 | ### Reference Research and Artistic Work: 17 | 18 | - [Memo Akten, Simple Harmonic Motion](http://www.memo.tv/portfolio/simple-harmonic-motion/) 19 | - [Mimi Yin and Guang Zhu, Beluga](https://vimeo.com/47124314) 20 | - [BAI/摆:An Oscillating Sound Installation](https://vimeo.com/296984735) 21 | 22 | ## Supplemental Material 23 | 24 | For each module, I will provide a list of additional video tutorials and readings that you may draw on for further exploration. It's unlikely you would be able to consume everything in one week and if you are looking for guidance about what might fit with your interests and learning style the most, please reach out. 25 | 26 | ### Pendulums and Springs 27 | 28 | - 🚂 [Pendulum Challenge](https://thecodingtrain.com/tracks/the-nature-of-code-2/159-simple-pendulum) - 22 min 29 | - 💻 [Simple Pendulum](https://editor.p5js.org/codingtrain/sketches/SN-39sHAC) 30 | - 💻 [Pendulum Class Example](https://editor.p5js.org/natureofcode/sketches/_YL1zZcRh) 31 | - 💻 [Array of Pendulums](https://editor.p5js.org/codingtrain/sketches/Bj82tUlIO) 32 | - 🚂 [Spring Forces Challenge](https://thecodingtrain.com/tracks/the-nature-of-code-2/160-spring-forces) - 32 min 33 | - 💻 [Simple Spring](https://editor.p5js.org/codingtrain/sketches/dcd6-2mWa) 34 | - 💻 [Spring with Vector](https://editor.p5js.org/codingtrain/sketches/_A2pm_SSg) 35 | - 💻 [Spring and Particle Class](https://editor.p5js.org/codingtrain/sketches/9BAoEn4Po) 36 | - 💻 [Soft String](https://editor.p5js.org/codingtrain/sketches/S5dY7qjxP) 37 | 38 | ### Polar Coordinates 39 | 40 | - 🚂 [Mathematical Rose Patterns](https://thecodingtrain.com/challenges/55-mathematical-rose-patterns) - 12 min 41 | - 🚂 [LissaJous Curve Table](https://thecodingtrain.com/challenges/116-lissajous-curve-table) - 27 min 42 | - 🚂 [Times Tables and the Cardioid](https://thecodingtrain.com/challenges/133-time-tables-cardioid-visualization) - 17 min 43 | 44 | ### Fourier Series and Transforms 45 | 46 | - 🎥 [But what is the Fourier series?](https://youtu.be/r6sGWTCMz2k) by 3Blue1Brown - 24 min 47 | - 🚂 [Fourier Series p5.js](https://thecodingtrain.com/challenges/125-fourier-series) - 28 min 48 | - 🚂 [Fourier Transform: Drawing with Epicycles](https://thecodingtrain.com/challenges/130-drawing-with-fourier-transform-and-epicycles) - 3 parts, 1 hour, 30 minutes 49 | - 🎥 [But what is the Fourier Transform? A visual introduction](https://youtu.be/spUNpyF58BY) by 3Blue1Brown - 20 min 50 | 51 | ### Code Example Collections 52 | 53 | - 💻 [Nature of Code Chapter 3 Book Example Collection](https://editor.p5js.org/natureofcode/collections/ndrwnaIvq) 54 | - 💻 [Nature of Code Chapter 3 Video Example Collection](https://editor.p5js.org/codingtrain/collections/bD7HTvWYL) 55 | - 💻 [Pendulum and Spring Collection](https://editor.p5js.org/codingtrain/collections/z5Z2btE3f) 56 | - 💻 [Polar Coordinate Collection](https://editor.p5js.org/codingtrain/collections/tkBBQAsUT) 57 | - 💻 [Fourier Series/Transform Collection](https://editor.p5js.org/codingtrain/collections/yCcUL8awW) 58 | 59 | ## Assignment 60 | 61 | The idea for this week is to use trigonometric functions and/or oscillating motion in a sketch. This is a very loose constraint and you should feel free to design your own exercise or pick from below. Don't hesitate to sketch your idea out on paper first and document in a blog post. 62 | 63 | ### Oscillation 64 | 65 | - Design a creature with oscillating parts (legs, wings, antennae, etc.) Consider tying the speed of oscillation to the speed of the creature's linear motion. Can you make it appear that the creature's internal mechanics (oscillation) drive its locomotion? Here is an extra [video about the oscillation exercise](https://youtu.be/0iKhdHlF6hs) and along with [the oscillation exercise code](https://editor.p5js.org/codingtrain/sketches/Qn8WVv6PN). 66 | 67 | ### Polar Coordinate Designs 68 | 69 | - You can use polar coordinates a variety of patterns derived from the points along the contours of a circle. Visualize your own pattern. Feel free to [start from any of these polar coordinate examples](https://editor.p5js.org/codingtrain/collections/tkBBQAsUT). 70 | - You might also google "parametric equations" to find one not in the examples above like this [heart curve](https://thecodingtrain.com/challenges/134-heart-curve). 71 | 72 | ### Angles and Forces 73 | 74 | - Create a simulation where objects are shot out of a cannon. Each object should experience a sudden force when shot (just once) as well as gravity (always present). Add rotation to the object to model its spin as its shot from the cannon. How realistic can you make it look? [example cannon solution](https://editor.p5js.org/natureofcode/sketches/39hocOYUa) 75 | - Create a simulation of a vehicle that you can drive around the screen using the arrow keys: left arrow accelerates the car to the left, right to the right. The car should point in the direction it is currently moving. You might also try to model the ship from the game asteroids! [Asteroids Solution](https://editor.p5js.org/natureofcode/sketches/7jQEBLJhX) 76 | 77 | ### Pendulums and Springs 78 | 79 | - Visualize an array of pendulums. For a start, here is [an example multi-pendulum visualization](https://editor.p5js.org/codingtrain/sketches/Bj82tUlIO) along with [live stream archive](https://youtu.be/dpqNqyQCcbY?t=1684). 80 | - You can also learn about the math behind a [double pendulum simulation](https://thecodingtrain.com/challenges/93-double-pendulum). 81 | - Create a system of [connected particles and springs](https://thecodingtrain.com/challenges/160-spring-forces). 82 | 83 | ### Oscillation in other mediums 84 | 85 | - Oscillating colors? sizes? number of elements on the screen? 86 | - Use oscillation to control the timing of events on the screen: sounds, the appearance and disappearance of elements. 87 | - Create polyrhythms with different oscillating patterns that come in and out of phase with each other. 88 | - Create oscillating pitch patterns in sound. 89 | - Oscillate playback position or speed of a video. 90 | 91 | ### Instructions 92 | 93 | - Document your work on the web with a short blog post. Here are some guiding questions if you are not sure what to write about: 94 | - What did you originally intend to create? 95 | - Narrate the process of creating your sketch. 96 | - What resources and examples did you draw on to create your sketch? What was most helpful / least helpful from this week’s materials. 97 | - What problems/discoveries did you encounter along the way? 98 | - Submit a link to your blog post to the course wiki. 99 | 100 | ## Emoji Key 101 | 102 | The following emoji key will hopefully help you navigate the material for each module. 103 | 104 | - 🚂 Video tutorial from Coding Train 105 | - 🎥 Other video tutorial 106 | - 📗 Nature of Code book 107 | - 📕 Other reading 108 | - 💻 Code examples 109 | - 🎨 Creative project references 110 | -------------------------------------------------------------------------------- /module04-systems/README.md: -------------------------------------------------------------------------------- 1 | # Particle Systems 2 | 3 | ## Core Material 4 | 5 | For each module, I will provide written and video tutorials on the topics. You can review whichever format suits you best. If the amount feels overwhelming, please reach out and we can help you narrow things down, and select a subset of the material to focus an exercise around. It's a lot! 6 | 7 | - 📗 [Chapter 4 Particle Systems](https://nature-of-code-2nd-edition.netlify.app/particles/) 8 | - 🚂 [Particle Class](https://thecodingtrain.com/tracks/the-nature-of-code-2/noc/4-particles/1-particle-system) - 10 min 9 | - 🚂 [Particle Emitter Class](https://thecodingtrain.com/tracks/the-nature-of-code-2/noc/4-particles/2-particle-emitters) - 8 min 10 | - 🚂 [Particle Class with Inheritance](https://thecodingtrain.com/tracks/the-nature-of-code-2/noc/4-particles/3-particle-inheritance) - 6 min 11 | - 🚂 [Particle Textures and Blending](https://thecodingtrain.com/tracks/the-nature-of-code-2/noc/4-particles/4-particle-textures) - 13 min 12 | 13 | ### Code Examples 14 | 15 | - 💻 [Example Code from video tutorials](https://editor.p5js.org/codingtrain/collections/OOySGOizs) 16 | - 💻 [Example Code from book chapter](https://editor.p5js.org/natureofcode/collections/iGxPOaMRyl) 17 | 18 | ### Reference Research and Artistic Work: 19 | 20 | - [Filippo Vanucci, Scrollables](https://vimeo.com/11482851) 21 | - [African Cosmos collection](https://africa.si.edu/exhibits/cosmos/universe.html) 22 | - [Particle Life](https://youtu.be/p4YirERTVF0) by Tom Mohr 23 | - [Particle Dreams](https://youtu.be/5QEp-oPaQto) by Karl Sims 24 | - Tron Legacy, [GMUNK](https://gmunk.com/TRON-Legacy), [JT Nimoy](https://jtnimoy.cc/item.php%3Fhandle=14881671-tron-legacy.html) 25 | 26 | ## Supplemental Material 27 | 28 | For each module, I will provide a list of additional video tutorials and readings that you may draw on for further exploration. It's unlikely you would be able to consume everything in one week and if you are looking for guidance about what might fit with your interests and learning style the most, please reach out. 29 | 30 | ### Particle Systems CG History 31 | 32 | - 📕 ["Particle animation and rendering using data parallel computation", Karl Sims](http://doi.acm.org/10.1145/97879.97923) (available via NYU network/proxy) 33 | - 📕 ["Particle Systems, a Technique for Modeling a Class of Fuzzy Objects", Reeves](http://doi.acm.org/10.1145/357318.357320) (available via NYU network/proxy) 34 | 35 | ### Arrays of Objects Review 36 | 37 | - 🚂 [Arrays of Objects](https://thecodingtrain.com/tracks/code-programming-with-p5-js/code/7-arrays/3-arrays-objects) 38 | - 🚂 [Removing Objects from Array](https://thecodingtrain.com/tracks/code-programming-with-p5-js/code/7-arrays/5-removing-elements) 39 | 40 | ### Inheritance and Polymorphism 41 | 42 | - 🚂 [Inheritance in JavaScript](https://thecodingtrain.com/tracks/topics-in-native-javascript/js/inheritance) 43 | - 🚂 [Polymorphism in JavaScript](https://thecodingtrain.com/tracks/topics-in-native-javascript/js/polymorphism) 44 | - 📕 [How my Dog learned Polymorphism](http://www.javaranch.com/campfire/StoryPoly.jsp) 45 | 46 | ### Higher-Order Array Functions 47 | 48 | - 🚂 [Higher-Order Array function videos](https://youtu.be/m9bRVQ_-DXY?list=PLRqwX-V7Uu6YgpA3Oht-7B4NBQwFVe3pr) 49 | - 🚂 [Particle System with higher-order functions](https://youtu.be/m9bRVQ_-DXY?list=PLRqwX-V7Uu6YgpA3Oht-7B4NBQwFVe3pr) 50 | - 📕 [Higher order function from Eloquent JavaScript](http://eloquentjavascript.net/05_higher_order.html) 51 | 52 | ## Assignment 53 | 54 | - [Simulation Project](https://github.com/nature-of-code/noc-syllabus-S23/tree/main/projects/simulation) - due March 8/9 55 | 56 | ## Emoji Key 57 | 58 | The following emoji key will hopefully help you navigate the material for each module. 59 | 60 | - 🚂 Video tutorial from Coding Train 61 | - 🎥 Other video tutorial 62 | - 📗 Nature of Code book 63 | - 📕 Other reading 64 | - 💻 Code examples 65 | - 🎨 Creative project references 66 | -------------------------------------------------------------------------------- /module05-agents/README.md: -------------------------------------------------------------------------------- 1 | # Autonomous Agents 2 | 3 | ## Core Material 4 | 5 | For each module, I will provide written and video tutorials on the topics. You can review whichever format suits you best. If the amount feels overwhelming, please reach out and we can help you narrow things down, and select a subset of the material to focus an exercise around. It's a lot! 6 | 7 | - 📗 [Chapter 5: Autonomous Agents](https://nature-of-code-2nd-edition.netlify.app/autonomous-agents/) 8 | 9 | ### Part 1: Individual Behaviors Basics 10 | 11 | - 🚂 [Introduction to Autonomous Agents](https://thecodingtrain.com/tracks/the-nature-of-code-2/noc/5-autonomous-agents/1-steering-agents) - 10 min 12 | - 🚂 [Steering Behaviors: Seeking a Target](https://thecodingtrain.com/tracks/the-nature-of-code-2/noc/5-autonomous-agents/2-seeking-a-target) - 13 min 13 | - 🚂 [Steering Behaviors: Pursue and Evade](https://thecodingtrain.com/tracks/the-nature-of-code-2/noc/5-autonomous-agents/3-pursue-and-evade) - 13 min 14 | - 🚂 [Steering Behaviors: Arrival](https://thecodingtrain.com/tracks/the-nature-of-code-2/noc/5-autonomous-agents/4-arrive-steering) - 9 min 15 | - 🚂 [Steering Behaviors: Wander](https://thecodingtrain.com/tracks/the-nature-of-code-2/noc/5-autonomous-agents/5-wander) - 13 min 16 | - 🚂 [Scalar Projection and the Vector Dot Product](https://thecodingtrain.com/tracks/the-nature-of-code-2/noc/5-autonomous-agents/6-scalar-projection) - 13 min 17 | - 🚂 [Path Following](https://thecodingtrain.com/tracks/the-nature-of-code-2/noc/5-autonomous-agents/7-path-following) - 15 min 18 | 19 | ### Part 2: Group and Combined Behaviors 20 | 21 | - 🚂 [Steering Behaviors Coding Challenge: p5.js](https://thecodingtrain.com/CodingChallenges/059-steering-text-paths.html) ~30min 22 | - 🚂 [Flocking Coding Challenge: p5.js](https://thecodingtrain.com/CodingChallenges/124-flocking-boids.html) ~40 min 23 | 24 | ### Code Examples 25 | 26 | - 💻 [Steering Code from video tutorials](https://editor.p5js.org/codingtrain/collections/S4nJEexPF) 27 | - 💻 [Steering Code from book chapter](https://editor.p5js.org/natureofcode/collections/6iND7LlFR) 28 | 29 | ### Reference Research and Artistic Work: 30 | 31 | - [Flow Fields](https://tylerxhobbs.com/essays/2020/flow-fields) by Tyler Hobbs 32 | - [Process Compendium](https://vimeo.com/22955812) by Casey Reas, [Processing Compendium Text](https://reas.com/compendium_text/) 33 | - [Living Wall](https://spacefiller.space/livingwall/) by SPACEFILLER 34 | - [Murmuration](https://roberthodgin.com/project/murmuration) by 35 | 36 | ## Supplemental Material 37 | 38 | For each module, I will provide a list of additional video tutorials and readings that you may draw on for further exploration. It's unlikely you would be able to consume everything in one week and if you are looking for guidance about what might fit with your interests and learning style the most, please reach out. 39 | 40 | ### Flow Field Following and Perlin Noise 41 | 42 | - 🚂 [Perlin Noise Flow Field Coding Challenge: p5.js](https://thecodingtrain.com/CodingChallenges/024-perlinnoiseflowfield.html) - ~ 30 min 43 | 44 | ### Steering References 45 | 46 | - 📕 [Excerpts from Vehicles: Experiments in Synthetic Psychology By Valentino Braitenberg](https://drive.google.com/file/d/1iztmHNX7kmc96tgV44eVJLHsJTTmm_Hd/view?usp=sharing) 47 | - 📕 [Craig Reynolds' Steering Behaviors for Autonomous Characters](http://www.red3d.com/cwr/steer/) 48 | - 🎥 [Reas Process Compendium](https://vimeo.com/22955812) 49 | - 🎥 [The Braitenberg Vehicles](https://youtu.be/A-fxij3zM7g) video by Brian Douglas 50 | 51 | ### Geometry References 52 | 53 | - 📕 [BetterExplained/ Dot Product + Finding The "Normal"](http://betterexplained.com/articles/vector-calculus-understanding-the-dot-product/) 54 | - 📕 [Finding the closest point on a curve.](http://www.mesacc.edu/~marfv02121/readings/nearest_point/index.html) 55 | 56 | ### QuadTree Optimization 57 | 58 | - 📕 [QuadTree Data Structure (Wikipedia)](https://en.wikipedia.org/wiki/Quadtree) 59 | - 💻 [QuadTree JS Library in Progress](https://github.com/CodingTrain/QuadTree) 60 | - 💻 [QuadTree p5 example](https://editor.p5js.org/natureofcode/sketches/Y8hseRvYe) 61 | - 🚂 [QuadTree Coding Challenge](https://thecodingtrain.com/challenges/98-quadtree) 62 | 63 | ## Emoji Key 64 | 65 | The following emoji key will hopefully help you navigate the material for each module. 66 | 67 | - 🚂 Video tutorial from Coding Train 68 | - 🎥 Other video tutorial 69 | - 📗 Nature of Code book 70 | - 📕 Other reading 71 | - 💻 Code examples 72 | - 🎨 Creative project references 73 | -------------------------------------------------------------------------------- /module06-softbody/README.md: -------------------------------------------------------------------------------- 1 | # Soft Body (and Rigid Body) Physics 2 | 3 | ## Core Material 4 | 5 | For each module, I will provide written and video tutorials on the topics. You can review whichever format suits you best. If the amount feels overwhelming, please reach out and we can help you narrow things down, and select a subset of the material to focus an exercise around. It's a lot! 6 | 7 | - 📗 [Chapter 6: Physics Libraries](https://nature-of-code-2nd-edition.netlify.app/physics-libraries/) 8 | - 📕 [Advanced Character Physics](http://www.cs.cmu.edu/afs/cs/academic/class/15462-s13/www/lec_slides/Jakobsen.pdf) 9 | 10 | ### Code Examples 11 | 12 | - 💻 [Chapter 6 Rigid Body with Matter.js Examples](https://editor.p5js.org/natureofcode/collections/IxCAhM060) 13 | - 💻 [Chapter 6 Soft Body with Toxiclibs.js](https://editor.p5js.org/natureofcode/collections/LZKswxYgH) 14 | 15 | ### Reference Research and Artistic Work: 16 | 17 | - [“Blah blah blobby”](https://vimeo.com/41057777) by Marcela Godoy, Eunyoung Kang 18 | - [mta.me](https://www.chenalexander.com/Mta-me0) by Alexander Chen 19 | - [Ricardo Sanchez Jellyfish](https://www.nardove.com/) 20 | - [Makign of Nokia Friends](https://www.youtube.com/watch?v=g20QOQP6kSU) 21 | 22 | ## Supplemental Reference Material 23 | 24 | ### Other Soft Body Projects 25 | 26 | - 🎥 [Physics of JellyCar](https://youtu.be/3OmkehAJoyo) 27 | - 🐦 [Solving a Maze](https://twitter.com/jagarikin/status/1563752962836807680) 28 | - 🐦 [Blob Collisions](https://twitter.com/JuhaniHalkomaki/status/1629184126837305347) 29 | - 🎨 [Big Screams](https://vimeo.com/8487873?embedded=true&source=vimeo_logo&owner=186879) 30 | - 🌳 [Skittish Tree](https://youtu.be/aF7sumcrNlo) 31 | 32 | ### Force-Directed Graphs 33 | 34 | - 📈 [D3 Force Directed Graph](https://observablehq.com/@d3/force-directed-graph) 35 | - 📖 [Visual Thesauras](https://www.visualthesaurus.com/) 36 | 37 | ### Matter.js 38 | 39 | - 🚂 [Matter.js video tutorials (JavaScript)](https://www.youtube.com/playlist?list=PLRqwX-V7Uu6bLh3T_4wtrmVHOrOEM1ig_) 40 | - 🚂 [Angry Birds with matter.js](https://thecodingtrain.com/challenges/138-angry-birds-with-matterjs) 41 | - 🚂 [Plinko with matter.js](https://thecodingtrain.com/challenges/62-plinko-with-matterjs) 42 | 43 | ### Toxiclibs.js 44 | 45 | - 💻 [ToxicLibs.js](http://haptic-data.com/toxiclibsjs/) 46 | - 📋 [ToxicLibs Java Reference](https://shiffman.github.io/toxiclibs-javadocs/) 47 | - 🎥 [The Making of Nokia Friends](https://vimeo.com/1472427) 48 | 49 | ## Assignment 50 | 51 | - Option 1: Create an interactive soft body character with the toxiclibs.js VerletPhysics2D library [using the example built in class as a model](https://editor.p5js.org/noc_spring23/sketches/6AsvNEUFj). Try expanding the design from a triangle to your own custom shape. What can you incorporate visually such as colors, textures, or other enhancements? 52 | - Option 2: Create a "force-directed graph" with the toxiclibs.js VerletPhysics2D library [using the example built in class as a model](https://editor.p5js.org/noc_spring23/sketches/6AsvNEUFj). What data do the particles (nodes) and springs (edges) represent? What can you incorporate visually such as colors, labels, or other enhancements? 53 | 54 | Document your work with a short post and submit link [on the course wiki](https://github.com/nature-of-code/noc-syllabus-S23/wiki). 55 | 56 | ## Emoji Key 57 | 58 | The following emoji key will hopefully help you navigate the material for each 59 | module. 60 | 61 | - 🚂 Video tutorial from Coding Train 62 | - 🎥 Other video tutorial 63 | - 📗 Nature of Code book 64 | - 📕 Other reading 65 | - 💻 Code examples 66 | - 🎨 Creative project references 67 | -------------------------------------------------------------------------------- /module07-fractals-ca/README.md: -------------------------------------------------------------------------------- 1 | # Fractals and Cellular Automata 2 | 3 | ## Core Material 4 | 5 | For each module, I will provide written and video tutorials on the topics. You can review whichever format suits you best. If the amount feels overwhelming, please reach out and we can help you narrow things down, and select a subset of the material to focus an exercise around. It's a lot! 6 | 7 | ### Cellular Automata 8 | 9 | - 📗 [Chapter 7](https://nature-of-code-2nd-edition.netlify.app/cellular-automata/) 10 | - 🚂 [Game of Life Coding Challenge](https://thecodingtrain.com/CodingChallenges/085-the-game-of-life.html) - 38 min 11 | 12 | ### Fractals 13 | 14 | - 📗 [Chapter 8 Fractals](https://nature-of-code-2nd-edition.netlify.app/fractals/) 15 | - 🚂 [Recursion Coding Challenge](https://thecodingtrain.com/CodingChallenges/077-recursion.html) - 12 min 16 | - 🚂 [Fractal Tree Coding Challenge](https://thecodingtrain.com/CodingChallenges/014-fractaltree.html) - 15 min 17 | - 🚂 [Fractal Tree with Objects](https://thecodingtrain.com/challenges/15-object-oriented-fractal-trees) - 22 min 18 | 19 | ### Code Examples 20 | 21 | - 💻 [Fractal and CA code examples from videos](https://editor.p5js.org/codingtrain/collections/fJ78Clagf) 22 | - 💻 [CA code examples from Chapter 7](https://editor.p5js.org/natureofcode/collections/vO150fv4lv) 23 | - 💻 [Fractal code Chapter 8](https://editor.p5js.org/natureofcode/collections/ujbdOAEy3) 24 | 25 | ### Reference Research and Artistic Work: 26 | 27 | - [MATHEMATICAL GAMES: The fantastic combinations of John Conway's new solitaire game "life"](http://ddi.cs.uni-potsdam.de/HyFISCH/Produzieren/lis_projekt/proj_gamelife/ConwayScientificAmerican.htm) by Martin Gardner, Scientific American 223 (October 1970) 28 | - [Parable of the Polygons](https://ncase.me/polygons/) by Nicky Case and Vi Hart 29 | - [The Game Of Life - Emergence In Generative Art](https://www.artnome.com/news/2020/7/12/the-game-of-life-emergence-in-generative-art) 30 | - [The Fractals at the Heart of African Designs](https://www.ted.com/talks/ron_eglash_the_fractals_at_the_heart_of_african_designs?language=en#t-4262) 31 | - [Fractals in Thai Cultural Designs](https://kvis.ac.th/userfiles/files/Fractals_full%20paper-corrected.pdf) 32 | - [“Fractal Expression” in Chinese Calligraphy ](https://arxiv.org/pdf/0810.1242.pdf) 33 | 34 | ## Supplemental Material 35 | 36 | For each module, I will provide a list of additional video tutorials and readings that you may draw on for further exploration. It's unlikely you would be able to consume everything in one week and if you are looking for guidance about what might fit with your interests and learning style the most, please reach out. 37 | 38 | - 🚂 [All Coding Train Fractal Videos](https://thecodingtrain.com/challenges/lang/all/topic/fractal)) 39 | - 📕 [The Algorithmic Beauty of Plants](http://algorithmicbotany.org/papers/#abop) 40 | 41 | ### Assignment 42 | 43 | For this week's exercise pick one of the above examples to serve as the foundation of your assignment. It can any of the fractal or CA examples, or a related aglorithm you find through your own research. Create your own version of the algorithm, and iterate variations on the idea by exploring custom visual design elements or rule adjustments. Below is a long list of ideas to explore for CA and Fractals. 44 | 45 | #### CA 46 | 47 | 1. Consider Non-rectangular Grids. There’s no particular reason why you should limit yourself to having your cells on a rectangular grid. What happens if you design a CA with another type of shape, e.g. triangle, hexagon, etc. 48 | 2. Probabilistic. The rules of a CA don’t necessarily have to define an exact outcome, for example with the Game of Life, what if a cell as an 80% chance of turning on based on its neighbors. 49 | 3. Continuous. For the examples this week the cell's state can only be a 1 or a 0. What if the cell’s state was a floating point number between 0 and 1? 50 | 4. Image Processing. Many image-processing algorithms operate on CA-like rules. Blurring an image is creating a new pixel out of the average of a neighborhood of pixels. Simulations of ink dispersing on paper or water rippling over an image can be achieved with CA rules. Try implementing a CA where a pixel is a cell and a color is its state. 51 | 5. Historical. What if a cell can track its history: how long it has been a 0 or 1. How might you visualize this. How could it adapt and change its rules over time by learning from its history? 52 | 6. Moving cells. In these basic examples, cells have a fixed position on a grid, but you could build a CA with cells that have no fixed position and instead move about the screen. What CA rules were applied to flocking boids?! 53 | 7. Nesting. Another feature of complex systems is that they can be nested. Our world tends to work this way: a city is a complex system of people, a person is a complex system of organs, an organ is a complex system of cells, and so on and so forth. 54 | 55 | #### Fractals 56 | 57 | 1. Stochastic: What if each step of fractal recursion involves some level of randomness. For example, what is each branch of a tree has a random number of sub-branches? What if the angles are random? 58 | 2. Oscillation / Noise: Can you apply oscillating motion or Perlin noise to the properties of a fractal. For example, can a Fractal tree "sway"? 59 | 3. What designs can you create by varying the visual quality of each subsequent generation of fractal recursion? For example with the `strokeWeight()` for each branch, a tree could have a thick root with subsequently thinner branches. 60 | 4. In what ways could the physics algorithms from modules 1-5 be applied to a fractal shape? 61 | 62 | ## Emoji Key 63 | 64 | The following emoji key will hopefully help you navigate the material for each module. 65 | 66 | - 🚂 Video tutorial from Coding Train 67 | - 🎥 Other video tutorial 68 | - 📗 Nature of Code book 69 | - 📕 Other reading 70 | - 💻 Code examples 71 | - 🎨 Creative project references 72 | -------------------------------------------------------------------------------- /module08-ga/README.md: -------------------------------------------------------------------------------- 1 | # Genetic Algorithms 2 | 3 | ## Core Material 4 | 5 | For each module, I will provide written and video tutorials on the topics. You can review whichever format suits you best. If the amount feels overwhelming, please reach out and we can help you narrow things down, and select a subset of the material to focus an exercise around. It's a lot! 6 | 7 | - 📗 [Nature of Code Chapter 9: Genetic Algorithms](https://nature-of-code-2nd-edition.netlify.app/genetic-algorithms/) (JS version of chapter in progress) 8 | - 📕 [Section 11.3 from Kate Compton’s Doctoral Thesis “Casual Creators”](http://www.galaxykate.com/pdfs/kcompton-dissertation-casualcreators.pdf) (p. 262 - 267) (2019) 9 | - 🎥 [Karl Sims Evolved Virtual Creatures](https://youtu.be/RZtZia4ZkX8) - 4 min 10 | - 🚂 9.1 [Introduction to Genetic Algorithms](https://youtu.be/9zfeTw-uFCw?list=PLRqwX-V7Uu6bJM3VgzjNV5YxVxUwzALHV) - 12 min 11 | - 🚂 9.2 [Genetic Algorithms How it Works](https://youtu.be/RxTfc4JLYKs?list=PLRqwX-V7Uu6bJM3VgzjNV5YxVxUwzALHV) - 23 min 12 | - 🚂 9.3 [Shakespeare Monkey GA](https://youtu.be/nrKjSeoc7fc?list=PLRqwX-V7Uu6bJM3VgzjNV5YxVxUwzALHV) - 8 min 13 | - 🚂 9.4 [Looking at the Code GA](https://youtu.be/-jv3CgDN9sc?list=PLRqwX-V7Uu6bJM3VgzjNV5YxVxUwzALHV) - 23 min 14 | - 🎥 [Simulation Natural Selection from Primer](https://www.youtube.com/watch?v=0ZGbIKd0XrM&feature=youtu.be) - 10 min 15 | 16 | ## Code Examples 17 | 18 | - 💻 [Genetic algorithm: Evolving Shakespeare](https://editor.p5js.org/natureofcode/sketches/ZwT5cPix2) 19 | - 💻 [Genetic algorithm: Evolving Shakespeare - Simplified](https://editor.p5js.org/natureofcode/sketches/q4F192JCV) 20 | - 💻 [Chapter 9 examples](https://editor.p5js.org/natureofcode/collections/Zx-KHJHdR) 21 | 22 | ### Reference Research and Artistic Work: 23 | 24 | - [Galápagos](https://www.karlsims.com/galapagos/) by Karl Sims 25 | - [Karl Sims Evolved Virtual Creatures](https://youtu.be/RZtZia4ZkX8) 26 | - [“Drawing Machine”](http://www.yeonheelee.com/week12-final-project/) by Yeonhee Lee 27 | - [The Problem with Evolutionary Art Is](http://philipgalanter.com/downloads/evostar2010%20-%20galanter%20-%20the%20problem%20with%20evo%20art.pdf) Galanter, Philip, 2010. 28 | 29 | ## Supplemental Material 30 | 31 | For each module, I will provide a list of additional video tutorials and readings that you may draw on for further exploration. It's unlikely you would be able to consume everything in one week and if you are looking for guidance about what might fit with your interests and learning style the most, please reach out. 32 | 33 | ### Additional Techniques 34 | 35 | - 🚂 9.5 [Genotype vs. Phenotype](https://youtu.be/_of6UVV4HGo?list=PLRqwX-V7Uu6bJM3VgzjNV5YxVxUwzALHV) - 14 min 36 | - 🚂 9.9 [Interactive Selection](https://youtu.be/Zy_obitkyOE?list=PLRqwX-V7Uu6bJM3VgzjNV5YxVxUwzALHV) - 8 min 37 | - 🚂 9.10 [Continuous Evolutionary System](https://youtu.be/Sx_l2GxBC5w?list=PLRqwX-V7Uu6bJM3VgzjNV5YxVxUwzALHV) - 8 min 38 | 39 | ### Project Demos 40 | 41 | - 🚂 [Smart Rockets Coding Challenge](https://thecodingtrain.com/challenges/29-smart-rockets-in-p5js) 42 | - 🚂 [Traveling Salesperson GA Coding Challenge](https://thecodingtrain.com/challenges/35-traveling-salesperson) 43 | - 🚂 [Evolutionary Steering Behaviors Coding Challenge](https://thecodingtrain.com/challenges/69-evolutionary-steering-behaviors) 44 | 45 | ### Genetic Algorithm Optimization 46 | 47 | - 🚂 9.6 [Improved Fitness](https://youtu.be/HzaLIO9dLbA?list=PLRqwX-V7Uu6bJM3VgzjNV5YxVxUwzALHV) - 5 min 48 | - 🚂 9.7 [Improved Pool Selection 1](https://youtu.be/816ayuhDo0E?list=PLRqwX-V7Uu6bJM3VgzjNV5YxVxUwzALHV) - 16 min 49 | - 🚂 9.8 [Improved Pool Selection 2](https://youtu.be/ETphJASzYes?list=PLRqwX-V7Uu6bJM3VgzjNV5YxVxUwzALHV) - 18 min 50 | 51 | ### Further Reading 52 | 53 | - 📕 [Galanter, Philip. "The Problem with Evolutionary Art Is…"](http://philipgalanter.com/downloads/evostar2010%20-%20galanter%20-%20the%20problem%20with%20evo%20art.pdf) Paper presented at EvoCOMNET’10: The 7th European Event on the Application of Nature-inspired Techniques for Telecommunication Networks and other Parallel and Distributed Systems, April 7-9, 2010. 54 | - 📕 [Sims, Karl. "Artificial Evolution for Computer Graphics."](http://www.karlsims.com/papers/siggraph91.html) Paper presented at SIGGRAPH '91: The 18th Annual Conference on Computer Graphics and Interactive Techniques, Las Vegas, NV, July 28-August 2, 1991. 55 | - 📕 [Sims, Karl. "Evolving Virtual Creatures."](http://www.karlsims.com/papers/siggraph94.pdf) Paper presented at SIGGRAPH '94: The 21st Annual Conference on Computer Graphics and Interactive Techniques, Orlando, FL, July 24-29, 1994. 56 | 57 | ## Assignment 58 | 59 | - Create a final project proposal. See [final project guidelines](https://github.com/nature-of-code/noc-syllabus-S23/blob/main/projects/final/README.md). Submit a link to your proposal [on the course wiki](https://github.com/nature-of-code/noc-syllabus-S23/wiki) and come prepared to share your idea for feedback in small groups next week. 60 | 61 | ## Emoji Key 62 | 63 | The following emoji key will hopefully help you navigate the material for each module. 64 | 65 | - 🚂 Video tutorial from Coding Train 66 | - 🎥 Other video tutorial 67 | - 📗 Nature of Code book 68 | - 📕 Other reading 69 | - 💻 Code examples 70 | - 🎨 Creative project references 71 | -------------------------------------------------------------------------------- /module08-ga/ga_design.md: -------------------------------------------------------------------------------- 1 | # Genetic Algorithm Design Exercise 2 | 3 | ## Scenario 4 | 5 | Describe the scenario. What is the population? What is the environment? What is the "problem" or question? What is evolving? What are the goals? 6 | 7 | ## Phenotype and Genotype 8 | 9 | What is the "thing" that is evolving? Describe it's phenotype (the "expression" of its virtual DNA) and describe how you encode its genotype (the data itself) into an array or some other data structure. 10 | 11 | ## Fitness Function 12 | 13 | What is the fitness function? How do you score each element of the population? 14 | 15 | ## Mutation and Crossover 16 | 17 | Are there any special considerations to mutation and crossover to consider or would the standard approaches work? 18 | -------------------------------------------------------------------------------- /module09-neuro/README.md: -------------------------------------------------------------------------------- 1 | # Genetic Algorithms 2 | 3 | ## Core Material 4 | 5 | For each module, I will provide written and video tutorials on the topics. You can review whichever format suits you best. If the amount feels overwhelming, please reach out and we can help you narrow things down, and select a subset of the material to focus an exercise around. It's a lot! 6 | 7 | - 📕 [A People’s Guide to AI](https://www.alliedmedia.org/files/peoples-guide-ai.pdf) by Mimi Onuoha and Mother Cyborg (chapters 4-5, p. 43-67) 8 | - 📗 [Nature of Code 10.1 - 10.4](https://natureofcode.com/book/chapter-10-neural-networks/) (skip 10.5 on, JS version of chapter not yet ready) 9 | - 🎥 [What is a Neural Network?](https://youtu.be/aircAruvnKk?list=PLZHQObOWTQDNU6R1_67000Dx_ZCJB-3pi) from 3Blue1Brown (19 minutes) 10 | - 🚂 [Train a Neural Network with ml5.js](https://thecodingtrain.com/learning/ml5/6.1-train-your-own.html) (35 minutes) 11 | 12 | ## Code Examples 13 | 14 | - 💻 [Nature of Code 10.1: Simple Perceptron](https://editor.p5js.org/natureofcode/sketches/HkJ0cRmux) 15 | - 💻 [Train Your Own Neural Network ml5.js](https://editor.p5js.org/codingtrain/sketches/zwGahux8a) 16 | - 💻 [Neuroevolution w/ ml5.js: Evolve Velocity](https://editor.p5js.org/natureofcode-archive/sketches/CF9M3atLy) 17 | - 💻 [Neuroevolution w/ ml5.js: Flappy Bird](https://editor.p5js.org/natureofcode-archive/sketches/gF3JHSwca) 18 | 19 | ### Reference Research and Artistic Work: 20 | 21 | - [Deborah Aschheim: Neural Architecture](https://lagunaartmuseum.org/exhibitions/deborah-aschheim-neural-architecture-a-smart-building-is-a-nervous-building/) 22 | - [Beauty and the Brain, A Neural Approach to Aesthetics](https://thewalters.org/exhibitions/beauty-and-the-brain-a-neural-approach-to-aesthetics/) 23 | 24 | ## Supplemental Material 25 | 26 | For each module, I will provide a list of additional video tutorials and readings that you may draw on for further exploration. It's unlikely you would be able to consume everything in one week and if you are looking for guidance about what might fit with your interests and learning style the most, please reach out. 27 | 28 | ### Further Reading on Data and Neural Networks 29 | 30 | - 📕 [Data and Society’s Algorithmic Accountability Primer](https://datasociety.net/wp-content/uploads/2018/04/Data_Society_Algorithmic_Accountability_Primer_FINAL-4.pdf) 31 | 32 | ### Neuro-Evolution Further Reading 33 | 34 | - 📕 [Evolution 101: Neuroevolution](https://www3.beacon-center.org/blog/2012/08/13/evolution-101-neuroevolution/) by Danielle Whittaker 35 | - 📕 [Evolving Novel Behaviors via Natural Selection](http://www.channon.net/alastair/geb/alife6/channon_ad_alife6.pdf) 36 | - 📕 [Evolving Neural Networks through Augmenting Topologies](http://nn.cs.utexas.edu/downloads/papers/stanley.ec02.pdf) 37 | 38 | ### Other NeuroEvolution examples 39 | 40 | - 💻 [Asteroids Learning](https://github.com/xviniette/AsteroidsLearning) by @xviniette 41 | - 💻 [steering agent with p5.js](https://github.com/lazoviccorp/aijs2/tree/gh-pages) by @lazoviccorp 42 | - 💻 [Snake NeuroEvolution](https://github.com/emgoz/Neural-network-snake) by @emgoz, 🎥 [Snake NeuroEvolution video](https://www.youtube.com/watch?v=BBLJFYr7zB8&t=0s) 43 | - 🎥 [NeuroEvolution playing Super Mario](https://www.youtube.com/watch?v=qv6UVOQ0F44) 44 | 45 | ### Reinforcement Learning / Q-Learning 46 | 47 | - 📕 [Simple Reinforcement Learning with Tensorflow Part 0: Q-Learning with Tables and Neural Networks](https://medium.com/emergent-future/simple-reinforcement-learning-with-tensorflow-part-0-q-learning-with-tables-and-neural-networks-d195264329d0) by Arthur Juliani 48 | - 📕 [Demystifying Deep Reinforcement Learning](https://www.nervanasys.com/demystifying-deep-reinforcement-learning/) by Tambet Matiisen 49 | - 📕 [Playing Atari with Deep Reinforcement Learning](https://arxiv.org/abs/1312.5602) (original DeepMind paper, 🎥 [Playing Atari Video](https://www.youtube.com/watch?v=V1eYniJ0Rnk)) 50 | 51 | ### Related Reinforcement Learning Tools 52 | 53 | - 🛠 [Unity ml-agents](https://github.com/Unity-Technologies/ml-agents) 54 | - 🛠 [OpenAI gym](https://gym.openai.com/) 55 | 56 | ## Emoji Key 57 | 58 | The following emoji key will hopefully help you navigate the material for each module. 59 | 60 | - 🚂 Video tutorial from Coding Train 61 | - 🎥 Other video tutorial 62 | - 📗 Nature of Code book 63 | - 📕 Other reading 64 | - 💻 Code examples 65 | - 🎨 Creative project references 66 | 67 | ### Examples from 2021 68 | 69 | - https://editor.p5js.org/natureofcode-archive/sketches/uMKZm0aEW 70 | - https://editor.p5js.org/natureofcode-archive/sketches/WswXPZdd4 71 | - https://editor.p5js.org/natureofcode-archive/sketches/Rjm816gLl 72 | - https://editor.p5js.org/natureofcode-archive/sketches/CF9M3atLy 73 | - https://editor.p5js.org/natureofcode-archive/sketches/gF3JHSwca 74 | -------------------------------------------------------------------------------- /noc-examples.md: -------------------------------------------------------------------------------- 1 | # Nature of Code book Examples 2 | 3 | ## Introduction 4 | * [I.1: Traditional random walk](https://editor.p5js.org/natureofcode/sketches/Syh78gFBz) 5 | * [I.2: Random number distribution](http://editor.p5js.org/natureofcode/sketches/BJHTAHUwe) 6 | * [I.3: Walker that tends to move to the right](http://editor.p5js.org/natureofcode/sketches/SkPQJIUwx) 7 | * [I.4: Gaussian distribution](http://editor.p5js.org/natureofcode/sketches/S120y8Uwx) 8 | * [I.5: Perlin noise walker](http://editor.p5js.org/natureofcode/sketches/SkuNg88Dx) 9 | 10 | ## Chapter 1: Vectors 11 | * [1.1: Bouncing ball with no vectors](http://editor.p5js.org/natureofcode/sketches/Sk4d-UUPx) 12 | * [1.2: Bouncing ball with vectors](http://editor.p5js.org/natureofcode/sketches/rkIaZUIvx) 13 | * [1.2: Bouncing ball with vectors and objects](http://editor.p5js.org/natureofcode/sketches/B1HXjDzdl) 14 | * [1.3: Vector subtraction](http://editor.p5js.org/natureofcode/sketches/H14-fI8Px) 15 | * [1.4: Multiplying a vector](http://editor.p5js.org/natureofcode/sketches/HkoNf8Uve) 16 | * [1.5: Vector magnitude](http://editor.p5js.org/natureofcode/sketches/SyeuMLLvg) 17 | * [1.6: Normalizing a vector](http://editor.p5js.org/natureofcode/sketches/SJ2hzULPg) 18 | * [1.7: Motion 101 (velocity)](http://editor.p5js.org/natureofcode/sketches/Bkg4XUIwe) 19 | * [1.8: Motion 101 (velocity and constant acceleration)](http://editor.p5js.org/natureofcode/sketches/Sy3k4ILDg) 20 | * [1.9: Motion 101 (velocity and random acceleration)](http://editor.p5js.org/natureofcode/sketches/ByT9EIUDl) 21 | * [1.10: Accelerating towards the mouse](http://editor.p5js.org/natureofcode/sketches/ryAIHLIPe) 22 | * [1.11: Array of movers accelerating towards the mouse](http://editor.p5js.org/natureofcode/sketches/Sy5lLI8ve) 23 | 24 | ## Chapter 2: Forces 25 | * [2.1: Forces](http://editor.p5js.org/natureofcode/sketches/B13QnJZul) 26 | * [2.2: Forces with mass](http://editor.p5js.org/natureofcode/sketches/SJC2hk-dl) 27 | * [2.3: Realistic Gravity with Mass](http://editor.p5js.org/natureofcode/sketches/HyQea1W_l) 28 | * [2.4: Including friction](http://editor.p5js.org/natureofcode/sketches/B1isyebug) 29 | * [2.5: Fluid Resistance](http://editor.p5js.org/natureofcode/sketches/H1DmxeW_g) 30 | * [2.6: Attraction](http://editor.p5js.org/natureofcode/sketches/HyWqel-de) 31 | * [2.7: Attraction with many Movers](http://editor.p5js.org/natureofcode/sketches/rJ9l-x-Ox) 32 | * [2.8: Mutual attraction](http://editor.p5js.org/natureofcode/sketches/SkYSWlb_x) 33 | 34 | ## Chapter 3: Oscillation 35 | * [3.1: Angular motion using rotate()](http://editor.p5js.org/natureofcode/sketches/SJSSzlWOg) 36 | * [3.2: Forces with (arbitrary) angular motion](http://editor.p5js.org/natureofcode/sketches/r1W0zgWOg) 37 | * [3.3: Pointing in the direction of motion](http://editor.p5js.org/natureofcode/sketches/BkfQ7g-_l) 38 | * [3.4: Polar to Cartesian](http://editor.p5js.org/natureofcode/sketches/S1UL7gZue) 39 | * [3.5: Simple Harmonic Motion](http://editor.p5js.org/natureofcode/sketches/BJTYQlWOe) 40 | * [3.6: Simple Harmonic Motion II](http://editor.p5js.org/natureofcode/sketches/rJShmeb_x) 41 | * [3.7: Oscillator objects](http://editor.p5js.org/natureofcode/sketches/rJkWNeWOx) 42 | * [3.8: Static wave drawn as a continuous line](http://editor.p5js.org/natureofcode/sketches/SJjQNeZOl) 43 | * [3.9: The Wave](http://editor.p5js.org/natureofcode/sketches/Byt94lW_x) 44 | * [3.10: Swinging pendulum](http://editor.p5js.org/natureofcode/sketches/SyXJrlZOl) 45 | * [3.10: Swinging pendulum simplified](http://editor.p5js.org/natureofcode/sketches/ByF7Hx-Ol) 46 | * [3.11: A Spring connection](http://editor.p5js.org/natureofcode/sketches/HkzFHeZdg) 47 | 48 | ## Chapter 4: Particle Systems 49 | * [4.1: A single particle](http://editor.p5js.org/natureofcode/sketches/B1GoIg-ug) 50 | * [4.2: Array of particles with for...of loop](http://editor.p5js.org/natureofcode/sketches/B1tgPxW_e) 51 | * [4.3: Single particle system](http://editor.p5js.org/natureofcode/sketches/B1YOPxbdl) 52 | * [4.4: System of systems](http://editor.p5js.org/natureofcode/sketches/BJYldlbOg) 53 | * [4.5: Particle system inheritance and polymorphism](http://editor.p5js.org/natureofcode/sketches/rkJJFxbOe) 54 | * [4.6: Particle system with forces](http://editor.p5js.org/natureofcode/sketches/rkrHFebul) 55 | * [4.7: Particle system with repeller](http://editor.p5js.org/natureofcode/sketches/rkVTFxZ_e) 56 | 57 | ## Chapter 5: Physics Libraries 58 | * [5.1: A comfortable and cozy Processing sketch that needs a little Box2D](http://editor.p5js.org/natureofcode/sketches/B1JeAxZug) 59 | * [5.1 Solved: A comfortable and cozy Processing sketch that needs a little Box2D](http://editor.p5js.org/natureofcode/sketches/HknP7oXul) 60 | * [5.2: Falling boxes hitting boundaries](http://editor.p5js.org/natureofcode/sketches/Hydt7j7Og) 61 | * [5.3: ChainShape with three hard-coded vertices](http://editor.p5js.org/natureofcode/sketches/HyzmEoXux) 62 | * [5.4: Polygon shapes](http://editor.p5js.org/natureofcode/sketches/S1HbHimug) 63 | * [5.5: Multiple shapes on one body](http://editor.p5js.org/natureofcode/sketches/HkTRFpMdz) 64 | * [5.6: DistanceJoint](http://editor.p5js.org/natureofcode/sketches/r1OJKj7Ox) 65 | * [5.7: Spinning Windmill](http://editor.p5js.org/natureofcode/sketches/rJk9tjQ_e) 66 | * [5.8: MouseJoint demonstration](http://editor.p5js.org/natureofcode/sketches/Bysr9jXOl) 67 | * [5.9: CollisionListening](http://editor.p5js.org/natureofcode/sketches/SyE0cs7dg) 68 | * [5.10: Simple Spring](http://editor.p5js.org/natureofcode/sketches/ryST6jXux) 69 | * [5.11: Soft swinging pendulum](http://editor.p5js.org/natureofcode/sketches/rJ6lo5h5e) 70 | * [5.12: Cluster](http://editor.p5js.org/natureofcode/sketches/BJodi935g) 71 | * [5.13: Attraction/Repulsion](http://editor.p5js.org/natureofcode/sketches/rk8Rs53qx) 72 | * [5.14: Blob](http://editor.p5js.org/natureofcode/sketches/B1Iy2929x) 73 | 74 | 75 | ## Chapter 6: Autonomous Agents 76 | * [6.1: Seeking a target](http://editor.p5js.org/natureofcode/sketches/r1imr2mdx) 77 | * [6.2: Arrive steering behavior](http://editor.p5js.org/natureofcode/sketches/S1jFHnQ_l) 78 | * [6.3: “Stay within walls” steering behavior](http://editor.p5js.org/natureofcode/sketches/ByOTB3Q_e) 79 | * [6.4: Flow field following](http://editor.p5js.org/natureofcode/sketches/HyDQIh7Ox) 80 | * [6.5: Simple path following](http://editor.p5js.org/natureofcode/sketches/HJ6uU2QOx) 81 | * [6.6: Path following](http://editor.p5js.org/natureofcode/sketches/Hk7CL3mOe) 82 | * [6.7: Group behavior: Separation](http://editor.p5js.org/natureofcode/sketches/Hk67wnQOg) 83 | * [6.8: Combining steering behaviors: Seek and separate](http://editor.p5js.org/natureofcode/sketches/Byr_DhXul) 84 | * [6.9: Flocking](http://editor.p5js.org/natureofcode/sketches/BJ12w2mOx) 85 | * [Exercise 6.13: Crowd Path Following](https://editor.p5js.org/natureofcode/sketches/2LcY8Hs-n) 86 | 87 | ## Chapter 7: Cellular Automata 88 | * [7.1: Wolfram elementary cellular automata](http://editor.p5js.org/natureofcode/sketches/B1D76hQug) 89 | * [7.2: Game of Life](http://editor.p5js.org/natureofcode/sketches/Hy8uT3Qux) 90 | * [7.3: Game of Life OOP](http://editor.p5js.org/natureofcode/sketches/SyO0p3mux) 91 | 92 | ## Chapter 8: Fractals 93 | * [8.1: Recursive Circles I](http://editor.p5js.org/natureofcode/sketches/SyjffpmOl) 94 | * [8.2: Recursion twice](http://editor.p5js.org/natureofcode/sketches/S1NQfaQOg) 95 | * [8.3: Recursion four times](http://editor.p5js.org/natureofcode/sketches/r1-HfaXux) 96 | * [8.4: Cantor set](http://editor.p5js.org/natureofcode/sketches/rkj_zTXde) 97 | * [8.5: Koch curve](http://editor.p5js.org/natureofcode/sketches/rJUB76mdl) 98 | * [8.5: Koch curve simple](http://editor.p5js.org/natureofcode/sketches/rJIRm6XOx) 99 | * [8.6/8.7: Recursive tree](http://editor.p5js.org/natureofcode/sketches/SJY746XOg) 100 | * [8.8: Stochastic tree](http://editor.p5js.org/natureofcode/sketches/H1QwVaX_x) 101 | * [8.9: Simple L-system sentence generation](http://editor.p5js.org/natureofcode/sketches/Hyx9Vam_l) 102 | * [8.10: LSystem](http://editor.p5js.org/natureofcode/sketches/By4ED6mOg) 103 | 104 | ## Chapter 9: The Evolution of Code 105 | * [9.1: Genetic algorithm: Evolving Shakespeare](http://editor.p5js.org/natureofcode/sketches/B1GHYpQul) 106 | * [9.1: Genetic algorithm: Evolving Shakespeare - Simplified](http://editor.p5js.org/natureofcode/sketches/Bk4wFpXul) 107 | * [9.2: Simple Smart Rockets](http://editor.p5js.org/natureofcode/sketches/S1PaKpQOe) 108 | * [9.3: Smart Rockets](http://editor.p5js.org/natureofcode/sketches/H1Z_9pX_x) 109 | * [9.4: Interactive selection](http://editor.p5js.org/natureofcode/sketches/SyCZs6m_e) 110 | * [9.5: Evolution ecosystem](http://editor.p5js.org/natureofcode/sketches/r1b2jaXOx) 111 | 112 | ## Chapter 10: Neural Networks 113 | * [10.1: The Perceptron](http://editor.p5js.org/natureofcode/sketches/HkJ0cRmux) 114 | -------------------------------------------------------------------------------- /projects/README.md: -------------------------------------------------------------------------------- 1 | # Projects 2 | 3 | In addition to weekly assignments, there are two projects to complete for the semester. 4 | 5 | 1. [Simulation Project](simulation) - a 2 week coding exercising synthesizing concepts from first half of semester and/or expanding on an earlier assignment. 6 | 2. [Final Project](final) - a 3 week creative project that builds off or is inspired by the concepts we've covered this semester. 7 | -------------------------------------------------------------------------------- /projects/final/README.md: -------------------------------------------------------------------------------- 1 | # Final Projects 2 | 3 | Your final project is an ~3 week assignment to be completed in three stages (proposal, prototype, and final). The project should be a creative project that builds off or is inspired by the concepts we've covered this semester. You should feel free to think non-traditionally, projects do not need to be screen-based and there is no requirement to use a particular aspect of JavaScript or programming. 4 | 5 | Final projects can be collaborations with anyone in any class. Final projects can be one part of a larger project integrated with a different class. 6 | 7 | Other notes: 8 | 9 | 1. Keeping things simple and small in scope is a plus. If your project idea is a big one, consider documenting the larger idea but implementing just a small piece of it. 10 | 2. Also think about making a final project for a small audience, even one single person like a family member or friend. . . or yourself. This can be a good way to focus your idea and design process. "Generalizing" the idea can come later (or maybe not at all.) 11 | 3. If you prefer to focus your time on a final project that is more research or project proposal oriented, this is perfectly acceptable! 12 | 13 | ## Final Project Proposal (Due April 12/13) 14 | 15 | Put together a final project proposal. It's up to you to best present your idea, but some things I would suggest are: 16 | 17 | - **Collect inspirations**: How did you become interested in this idea? quotes, photographs, products, projects, people, music, political events, social ills. 18 | - **Collect source material**: drawings, images, videos, sounds, text 19 | - **Collect code**: your own sketches and/or other people's sketches. 20 | - **Collect ideas for title** 21 | - **Collect ideas for 1-sentence description?** 22 | - **Context?** Who's it for? How will people experience it? Is it interactive? Is it practical? Is it for fun? Is it emotional? Is it to provoke something? 23 | - **Collect questions for your classmates.** 24 | - What are you unsure of? Conceptually and technically. 25 | 26 | Stay tuned for an update regarding format for proposal sharing and feedback. 27 | 28 | ### Guidelines for Proposal Feedback 29 | 30 | 1. Is the idea clear? Is there a clearly stated goal? What do you understand / not understand? 31 | 2. What about scope? Can it be done in such a short period of time under current circumstances? 32 | 3. Suggestions for relevant tutorials, reference projects, or other resources? 33 | 4. Are there ways this project can be user tested? What questions would you want to ask? 34 | 35 | ## Final Project Testing (April 26/27) 36 | 37 | The testing will follow a speed "round robin" format. The class will be divided into two groups and we'll do two rounds. For each round half the students will set up on a laptop in the class room and the other half will "view" or "interact with" or "listen to" your project for ~5-7 minutes. We'll rotate so that all "testers" will try each project and provide feedback. 38 | 39 | It's up to you to design your "testing". It can mean something different for different projects. For an interactive web page, it's pretty obvious what to do. For a physical installation or performance or twitter bot, this will be more difficult. The "rule" that we will try to adhere to is no explaining of the project until after the user has viewed/interacted. 40 | 41 | If you are not sure how to design your testing, e-mail me and we'll discuss. [Schedule and groups are on the course wiki](https://github.com/nature-of-code/noc-syllabus-S23/wiki). 42 | 43 | ## Final Project Documentation (Presentations May 3/4, documentation due May 12) 44 | 45 | To complete the course, please post your final project documentation to a web page (blog post is fine) and [submit on the course wiki](https://github.com/nature-of-code/noc-syllabus-S23/wiki). The deadline is May 12, please be in touch if you anticipate any issues meeting the deadline. 46 | 47 | It's up to you to figure out how to best document your project, here are some loose guidelines if you aren't sure what to include. 48 | 49 | - Title 50 | - Sketch link 51 | - One sentence description 52 | - Project summary (250-500 words) 53 | - Inspiration: How did you become interested in this idea? Quotes, photographs, products, projects, people, music, political events, social ills, etc. 54 | - Process: How did you make this? What did you struggle with? What were you able to implement easily and what was difficult? 55 | - Audience/Context: Who is this for? How will people experience it? Is it interactive? Is it practical? Is it for fun? Is it emotional? Is it to provoke something? 56 | - Code references: What examples, tutorials, references did you use to create the project? (You must cite the source of any code you use in code comments with the exception of examples specifically provided by The Nature of Code book.) 57 | - Next steps: If you had more time to work on this, what would you do next? 58 | -------------------------------------------------------------------------------- /projects/simulation/README.md: -------------------------------------------------------------------------------- 1 | ## Simulation Project 2 | 3 | Now is the time to take the concepts from the first 6 weeks and apply them to a project idea. This "mid-semester exercise" can be anything that builds off of or is inspired by the material from the motion and physics material. It does not need to be a "fully realized thing" -- it can be a visual experiment in progress or a piece of a larger project you are building for another context (thesis, another class, etc.). It can be continuation of one of your previous exercises that further develops the concepts there, perhaps inspired by some of the feedback you received or any lingering ideas that you want to explore. You should also feel free to think non-traditionally, i.e. your project need not be a Processing or p5.js sketch. 4 | 5 | Here are some ideas for projects / technical exercises if you are feeling stuck: 6 | 7 | - Extend one or more of the examples into 3D. 8 | - Design a single creature (that you imagine living in a larger eco-system). Consider the design of the creature's physical form and how that animates in addition to its movement throughout the canvas itself. 9 | - Investigate other interactions (beyond keyboard and mouse) and a physics environment (i.e. computer vision, machine learning, physical computing sensors, etc.) 10 | - Use physics simulation to fabricate something -- a print, a sculpture, etc. 11 | - Apply the concepts of motion to non-visual media, what does it mean for video playback or sound synthesis to respond to forces and emulate physical behaviors. 12 | 13 | Document your project in a blog post and come prepared to share your work for ~3-5 minutes. You are not required to have a slide deck, however, you might find slides useful to help you plan and structure your demo. Additional, document your work in a a blog post (or other web page). 14 | 15 | Consider including: 16 | 17 | * Title 18 | * Sketch link 19 | * One sentence description 20 | * Summary (250-500 words) 21 | * Inspiration: How did you become interested in this idea? Quotes, photographs, products, projects, people, music, political events, social ills, etc. 22 | * Process: How did you make this? What did you struggle with? What were you able to implement easily and what was difficult? 23 | * Code references: What examples, tutorials, references did you use to create the project? (You must cite the source of any code you use in code comments. Please note the following additional expectations and guidelines at the bottom of this page.) 24 | * Next steps: If you had more time to work on this, what would you do next? 25 | --------------------------------------------------------------------------------