Aim: What computer terms have we learned in Computer Art?

Do Now: What are some of the concepts we learned last semester. Put a link or an example on this site below:

 

 

Made with Padlet

 

 

Aim: How can we make our designs interactive using conditional statements? (Learning ConditionalsConditional Examples)

 

Create a flowchart using this link (flowchart guide) make a flowchart based on the x and y position of your mouse.

 

 

Activity

  • You can change the color, size or position of a shape. See this example.
  • You can adapt a previous sketch and add interactivity to it.

 

 I. Variable video

II. Do the following if exercises

 

Look at site on conditionals

Join my class link

 

 IV. Take Test

 

 

 

Aim: How to create a music presentation using Garageband

For this exercise you will create two soundtracks one will be a composition composed solely by you and the other will be a remix.


Once you have the soundtracks you will choose one and you will use the track in a music animation.
 
1. Song must have a beginning middle and end
2. Organize by separating or grouping loops
3. Song should have the structure of peaks and valleys that gradually build
4. Start should be simple, or soft
5. Have one consistent rhythm or beat throughout
6. Song should have an element of unpredictability to it

Using Garageband

 You can look at the following link

  1. Think about what what kind of song you want to write (e.g. jazzy, rock) and what instruments would be suitable to achieve this.
     
  2. Decide if you want to use GarageBand's own included library of loops, your own voice/instruments, or the keyboard, or maybe a combination of these.
  3. Using Keyboard/Recorder: Click the plus symbol in the lower left hand corner of the screen. This will create a new track (you can also do this by clicking 'Track', then 'New Track'). If you want to use either the built in keyboard or your own MIDI keyboard, select "Software Instrument". If you want to record yourself, using perhaps your voice, click "Real Instrument". The round red button is the record button. Use this.
  4. Decide if you want to use loops, your own voice/instruments, or the keyboard, or maybe a combination of these.
  5. The round red button is the record button. Use this to record the keyboard or voice/instruments.
  6. Using Loops: Loops are the easiest way to create a professional-sounding song without much work. Drag a loop onto the main part to create a new track. You can then add more loops of the same instrument to this track. To make a new track, repeat. 1 track = 1 instrument.
  7. Add loops of the same key and similar rhythms for a better sound.
  8. Go to Share > Export to export the file as an m4a. Then you can add the file to iTunes. Find how to use this in the external link.

 

To speed up a song

 

  1. Drag in the song from iTunes, or record yourself.
  2. Select the song and press Control-Option-G and deselect the song.
  3. The song now turns purple, and you can open up the track editor and check the check box that says Follow Tempo & Pitch.

In Garageband share your song by selecting Export to Disk. Turn into a mp3 file. Upload the song to Padlet. Write your name, the name of the song and what is the genre of the song.

 

 

Tuesday March 25th 2019

Take Practice Exam

 

Thursday March 28th 2019

Take Practice Exam

 

Friday March 29th 2019

Take Midterm

 

Monday April 1, 2019

Aim: How do we manipulate different types of media in p.5?

In this unit students learn about working with media and asynchronicity. The preload function is used to load image, font and sound files before sketches are run, and callback functions are introduced. In the final project students combine images, fonts and sound to create their own random meme generator.

Do Now: What is your favorite meme?

Activity: Come up with an idea for three different memes komar?

Lesson

Copy code and find a picture

 

var tree;

 

function preload() {
tree = loadImage("birch.png")
}

 

function setup() {
createCanvas(400, 400);
colorMode(HSB)
//I turned the loop off so it would load faster
noLoop()
}

 

function draw() {
background(220);

 

for(x=0; 300 > x; x+=50){
tint(180,70,60)
image(tree,x,0,150,200);
}

 

for(x=0; 300 > x; x+=50){
tint(70,50,60)
image(tree,x,100,150,200);
}

 

for(x=0; 300 > x; x+=50){
tint(20,20,80)
image(tree,x,200,150,200);
     }

}

Click example 

Use unique font that goes with your image's style 

 

Project Remix click Mini-Project: Kinetic Type

Sounds

Project Remix

 

Aim: How can I utilize the preload function and load images into my program?

Do Now: Discuss how the following code works: More about font

 

Loadimage function, Digital Collage, Poem,

 

 

Aim: How can I utilize the preload sounds into my program?

Do Now: Look at code on this link 

 Lesson Link

Activity: Here is a copy of template of a sound code 

if statements and sounds

Stop and play code

Choose snippets of the code above into your code

 

Aim: Making a game

Games

 

Aim: How do we create an interactive story line?

Do Now: Brainstorm your idea for your story or game due May 14th.

Activity: Due May 24th create one of the following:

               1. A game with five levels

                2. A story featuring Marvel verses DC comics

                3. Your favorite childhood cartoon or Anime

 

Steps

1. In Google Images get your backgrounds, characters and objects for all five scenes.

The background images does need to have transparencies, it can be a .jpg or png.

The characters or objects have to have transparent backgrounds which means they are either .gifs or png files.

2. You have create five scenes in p5. You can copy your Storyteller Challenge code from KhanAcademy and paste it into p5. 

3. Story has to make logical sense. Main character who wants something in the beginning, has a problem achieving there goal and at the  end the may or may not get what they want.

4. Animation, interactivity, transformations

 

Script for P.5 final project

Simpler code

 

 

 

May 29th 20019

Please take this Review for the test

Review for final

 

Post final Projects

 

June 13th 

Take the Final

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

_______________________________________________________________________________

 

Fall 2018 Computer Art

 

Make sure everyone logs into www.nylearns.org/kmason

Aim: How do we use coordinates to manipulate objects on our screen?

Do Now:Watch video

Activity: Slides Complete worksheet by doing a code along

             Log into Wescheme at home

 

 Vocabulary

  • apply: use a given function on some inputs

  • arguments: the inputs to a function; expressions for arguments follow the name of a function

  • circle of evaluation: a diagram of the structure of an expression (arithmetic or code)

  • definitions area: the text box in the Editor, where definitions for values and functions are written

  • editor: software in which you can write and evaluate code

  • error message: information from the computer about errors in code

  • evaluate: perform the computation in an expression, producing an answer

  • evaluates to: the result of computing an expression

  • expression: a computation written in the rules of some language (such as arithmetic, code, or a Circle of Evaluation)

  • function: a mathematical object that consumes inputs and produces an output

  • interactions area: the text box in the Editor, where we enter expressions to evaluate

  • legal expression: code that follows the Code Rules for a language

  • mathematical expression: a computation in arithmetic

  • programming language: a set of rules for writing code that a computer can evaluate

  • value: a specific piece of data, like 5 or "hello"

Aim: How can knowing Contracts, Strings and Images help us understand programming?

Slides

Do Now: Log into www.Wescheme.org 

complete this exercise digital worksheet site insert this code VY4PWP

Activity 1: Use this access code DF3BJ-X76F8 to create an account in www.schoology.com

Download the Workbook on your computer

Exercise 

 

Click on link to take test Quiz Code for Ms. Mason's Class DNP78B

 

Take Test

 

Activity 2

 

1.Write the functions in the Contract handout

 

ellipse:  Number Number String String -> Image

 

triangle: Number String String        -> Image

 

circle:   Number String String        -> Image

 

star: Number String String -> Image

 

rectangle: Number Number String String -> Image

 

triangle : Number String String -> Image

 

square : Number String String -> Image

 

+: Number Number -> Number

 

Can you write the Contract for *, -, / and sqrt?

 

(bitmap/url "http://bootstrapworld.org/images/icon.gif")

 

flip-horizontal : Image -> Image

 

 

 

 

 

Part 2: Game Set-Up - Write a paragraph describing a theme for a game you would like to create then ->

Search for:

 

(Image Files must PNG or Gif) (Must contain Transparent Background)

 

use the target code (bitmap/url "http://bootstrapworld.org/images/icon.gif")

 

-       Background Image

 

-       Character

 

-       Enemy

 

-       Projectile

Save it in a target code

 

Lesson 

Aim: How to Create art using Racket Code?

Do Now: What does Abstract Art look like?

               Abstract Art

 

Activity:

Final Project: Type code to make an abstract artwork. Pick an abstract art piece as a background and add 15 shapes in addition to the shapes below.

 Computer Art Whitney Musuem

My Art 

 

Once finished share your link in Wescheme. Upload your final project to Schoology.

Create an account in Careerzone. Answer questions in My Portfolio

 

November 8 2018

I. Part of the class will finish the assignment below:

Use the Class code jtqnuq. Click link to complete assignment



III. Do extra credit assignments

 

November 9th 2018

Take this test

 

 

2nd Semester 

Activity 1 

 Aim: How can using the Design Recipe help us code?

 Do Now: Upload the following to Schoology:

Your Rocket-Height Code

Using the Racket code from your game make an object move

 

Creating art

 

How to code movement on a screen using transformation of the x and y coordinates?

Vocabulary - Transformation, coordinate plane, vertical translation, horizontal translation, troubleshooting, error analysis, input, output, given, constant, scale, window dimension, vertical stretch/compression, dilation, average rate of change, slope

Interpreting parts of word problems:

Takes in: what is the input, domain or the variable

Produces/returns: the output or the range

That is: What the function does, whats the function doing and/or what is the givens or constants

Write a function: Name the function

Do Now: To have student manipulate objects along a x - y plane and describe the transformation  link

 

Place a (T) for Target on (100, 100) on the screen. Mark and move the (T) 500 pixels to the right and mark and move 200 to the left.

 

Place a (D) for Danger on (200, 300) on the screen. Mark and move the (D) 200 pixels to the left and mark and move 100 to the right.

 

Place a (P) for Projectile on (300, 200) on the screen. Mark and move the (P) 200 pixels up and mark and move 100 down.

 

Activity:

Complete the Design Recipe for moving the objects along the x-y coordinate plane.

Finish Target-Leap, Update-Danger and Update-Target design recipe hand outs

Make game changes to Game Template

 

Aim: How can functions compare coordinates?

 

Do Now: Look at peanut butter and jelly flowchart pbj part 1.pdf

Activity:

1. Write booleans in contract

2. Do comparisons on grid along the x coordinates

3. Complete Unit 6 package

 

 

How can we break down a robot into basic shapes in p5.js?

 

II. Make a p5.js account Go to this site to learn Processing site

 Video tutorial: 1.2 Basics of Drawing

Making shapes 

Activity: Read this for directions robot.docx

Slides

 

Aim: How to use variables to make our coding easier?

Activity: Upload your Edit version to the Variable on Schoology.

Next assignment you will alter the code and fill the canvas with a pattern

Change the color and size of the shape

 

Aim: How to use variables to make animated shapes?

Do Now: What does it mean to animate shapes?

Activity: 

Discuss Animating shapes

shapes

 

 

 

 

 

 

Loops

 

 

 

 

 

 
.
.