• Custom Controls Demo •

In class we will walk through a demo of how to code media player controls from scratch, including a playlist feature. The demo site can be found here: [http://class-is-on.com/assets/demo-files/custom-media-demo_12.09.21] and the files to work from are linked below. Following the tutorial we will meet in small groups to share progress and feedback on the final project.

• FILES:
  [custom-media-demo_12.09.21.zip]
• ASSIGNMENT: Finish the Media Player project and upload it to your finalized website for this class. Make sure all your projects from the semester are hosted on your Home Page and made available to view live on GitHub Pages. Our last day of class and final review is next Thursday December 16.

No class.

• Media Player Introductions •

In class we will share ideas for the final project and go over any questions.

• LINKS:
  [Minority Report UI Design]
  [Winamp Skins Museum]
• ASSIGNMENT: Prepare a working draft of your Media Player project for mid-way presentations in class December 2.
  
  Keep in mind that all projects from this course including the final should be presented and linked on your homepage website from the first assignment. Please prepare and finalize your live site by December 16.

• Clock Review and Final Assignment •

Class begins with presentations of the finalized Clock projects. After critique, we will screen Douglas Adams' short film, [Hyperland (1990)] and go over the details of the next and final project.

• FILES:
  [CD-Studio-JavaScript-assignment-4.pdf]
• ASSIGNMENT: Conceptualize your Media Player topic and collect at least 10 playlist items and files by November 18.

• Clock Continued •

No class.

• ASSIGNMENT: Finalize your clock and make sure to incorporate the if... else statement. Consider the overall presentation of your page and prepare for in class review, November 11.

• Clock Workshop •

Class time will be used for sharing and workshopping ideas for the clock project. Be prepared to make progress in class and advise others.

• ASSIGNMENT: Use the week to begin coding and design refinement. Have a working version of the clock ready to demonstrate in our next class, November 4.

• Conditional Paths, Passing Parameters, Working With The Date Object •

After presenting the final Printer project websites to the class, we will begin the next unit and assignment. We will go over how to work with the JavaScript Date() object as it relates to our next assignment, the Clock.

• ASSIGNMENT: Conceptualize your clock and plan a sketched model. Due October 28.
• FILES:
  [CD-Studio-JavaScript-week-8.pdf]
  [CD-Studio-JavaScript-assignment-4.pdf]
  
• LINKS:
  [Karel Martens: Clocks]
  [Karel Martens O-R-G screensaver]
  [A Million Times 288 'Ten' White Wall Clock Wall Sculpture by Humans Since 1982]
  [ChronoArt (Barry Gamble) Designs and Sells the Latest in Digital Art Clock Designs]
  [Aurora Clock by Kirsch-Hamilton + Gamble (2019 Version)]
  [Laura Brown on left.gallery]

• Generative Workshop •

In class we will focus on code and troubleshoot bugs in small groups. Your Printer project should be in progress with the site architecture in place.

• ASSIGNMENT: Finalize your page. Keep an eye out for unexpected outcomes generated by your script and see if there are any additional functionalities you would like to incorporate based on these discoveries. The Printer project is due October 21.

• Generative by Design •

We will spend the first part of class taking in historical references and artists's works which relate to the printer project. Below is a list of the video screening playlist:

1. [Vera Molnar computer art]
2. [Véra Molnar - Écrans]
3. [John Whitney - Experiments in motion graphics 1968]
4. [John Conway Talks About the Game of Life Part 1]
5. [Larry Cuba - Calculated Movements (complete film)]
6. [VERA MOLNAR /// "LR WAYS" /// 1991]

The rest of class will be for workshopping sketches from the week in small groups. This time can also be used to ideate on programming strategies for the execution of your generative work.

• ASSIGNMENT: Work on getting your sketched model to print in the browser. Focus on the code first and then styling. Have a working draft ready for our next class on October 14.
• LINKS:
  [Computer Sculpture, Article by Robert Mallary in ArtForum, May 1969 - Pulsa]
  [Waldemar Cordeiro: Computer Art Pioneer]
  [compArt database Digital Art (daDA)]

• Loops & Iteration •

The Magic 8-Ball project is due. Class will start with project presentations for review. Afterwards we will go over the concept of loops in programming and JavaScript and how it relates to our next assignment.

• ASSIGNMENT: Consider what you would like to generate for the Printer project and make some sketches outside of the browser. Try first creating by hand what you would like the computer to do. Bring your ideas and visuals to class October 7.
• FILES:
  [CD-Studio-JavaScript-week-5.pdf]
  [CD-Studio-JavaScript-assignment-3.pdf]
  
• LINKS:
  [1D Cellular Automata and the Edge Of Chaos]
  [Generative Artistry Tutorials]
  [JavaScript Timing Events]
  [How to print an ascii square spiral to the console?]

• Variables, Arrays, and Built-in Functions •

Class will begin with a screening of [Muriel Cooper | David Reinfurt | Talks at Google]. Afterwards we will break into small groups and share progress on the Magic 8-Ball projects, as well as troubleshoot bugs together.

• ASSIGNMENT: Finalize the design and code of your 8-Ball website. Incorporate your JavaScript complication (at least one or more) if you have not already done so. Please upload the completed project to your homepage by September 30.
• VIEWING: [Variables vs. Arrays vs. Objects: an explanation with food]

• Introduction to Programming •

To learn JavaScript is to learn the basics of all Object-Oriented Programming. This week we will go over the foundational architecture of JavaScript beginning with variable and method objects. We will also discuss techniques for developing your own approach to coding and problem solving.

Our next project will be to create a website based on the behavior of a Magic 8-Ball toy. Your final website should be a unique interpretation of the 8-Ball's question answering function.

• ASSIGNMENT: Sketch the design of your website and convert it to HTML and CSS. Link the provided code in a separate scripts file and connect the variable selectors to your own HTML elements. Have your phrases loading randomly by September 23.
• FILES:
  [CD-Studio-JavaScript-week-3.pdf]
  [CD-Studio-JavaScript-assignment-2.pdf]
  [CD-Studio-JavaScript_Magic-8-Ball-Demo.zip]

• HTML/CSS Refresher Part 2 •

Convert your design into an HTML and CSS web page. Be mindful of how the content adapts to a very narrow or very wide browser window. Follow the guide set forth by your sketch from last week, but don't be afraid to make changes once you see how the design feels in the browser.

Start to establish an organized folder structure for this class. For example:

We will host all our work for the semester using GitHub Pages. The instructions for creating a live website using your GitHub account can be found here: [https://pages.github.com]. Please familiarize yourself with the process of setting up a repository with your username.github.io to publish a new site.

• ASSIGNMENT: Finish your homepage and publish the site on GitHub Pages by September 16. Email me your link so I can add you to the class website.
• READING: [Eloquent JavaScript: Introduction] by Marijn Haverbeke

• HTML/CSS Refresher Part 1 •

JavaScript is one of the three core technologies of the World Wide Web. We use HTML to specify the content of web pages, CSS to specify the presentation of web pages, and JavaScript to specify the behavior of web pages. Before learning JavaScript, it is important to have a strong understanding of the building blocks of the web. To begin, we will practice our HTML and CSS skills by creating a homepage to catalog the rest of the projects for this course.

Sketch your website outside of the browser using the tools you feel most comfortable with (for example: InDesign, Illustrator, Photoshop, Figma, Sketch, or even pencil and paper). Consider the design of your page, how would you like to represent yourself graphically? You may use any combination of text, colors, and images. The only requirement is to include a container which will eventually link to each of your individual projects. Fully realize as much of your homepage as possible without coding yet.

• ASSIGNMENT: Email me your Sketch by September 9.
• REQUIRED VIEWING: [Why Is CSS So Weird?] by Miriam Suzanne
• READING: [Old CSS, new CSS] by Eevee
• INSTALL: [VSCode], [GitHub Desktop]

Please register an account on [GitHub] if you don’t have one already.