Image by A. M. Stanford
- Adding our projects to class site!
- Working with data
- CatCal demo
- Final projects (update)
- Guest Workshop: Lesley Kadish
- Assignments for next class
First let's open the terminal go to our class site project and open it:
cd ~/Code/
cd class-site-git
open .Next, let's create a new folder called "timepiece".
Now open up your "timepiece" project and copy all of the files within it. Paste them into the new "timepiece" folder.
Now, back in the terminal, check the git status:
git statusYou should see that the "timepiece" folder was added. Commit the changes by doing the following:
Add the new folder:
git add timepieceCommit the changes:
git commit -m "Added timepiece project"Now, finally, let's push to the server!
git push origin masterThere may be a slight delay, but you should be able to see your project in your class site, under "/timepiece/". You can repeat this process in the future to make changes to your timepiece project.
Arrays are lists of variables. Think of it like a shelf that holds jars in a line, which you can fill with whatever you like. Each jar gets a number, starting at "0".
Here's how we declare an empty array:
// this creates an empty array
// (a shelf with no jars yet)
var array = []
// this creates an array with 4 elements
// (4 jars each containing a number)
var numbers = [9, 3, 75, 0];You can access elements in an array using an array index, which is a number corresponding to a particular slot in the array. Again, the first array index is 0 ... you will undoubtedly forget this and have it cause an error at some point!
var numbers = [9, 3, 75, 0];
// get the first array element
var first = numbers[0];
console.log(first);
// -> will output "9"Every array has a length, which you can get using .length. Keep in mind that because the array indices start at 0, the length of the array will be 1 greater than the last index.
var length = numbers.length;
console.log(length);
// -> will output "4".
// ERROR!!!
// the last index is always length-1
// (this is stepping right off our shelf of jars!)
var last = numbers[length];Often when we use arrays we want to iterate throught them. Here's an example that will take an array of phrases and output each one to the console.
// an array of strings
var tomSwifties = [
'"I am no good at playing darts," Tom said aimlessly.',
'"I am a softball pitcher," Tom said underhandedly.',
'"Mush!" said Tom huskily.'
];
// use a for loop to count through all the indices
for (var i = 0; i < tomSwifties.length; i++) {
console.log(tomSwifties[i]);
}
If an array is a jar, then an object is like a carefully organized cabinet. Each compartment in the cabinet has a label, called a key and the contents of the compartment are called the value. The different compartments of your object are called properties.
Just like arrays, anything goes as far as what you put in your cabinet. It can be a number, a string, an array of numbers, another object, an array of objects, etc.
Here's how you declare an object:
// this creates an empty object
// (like a cabinet with no compartments yet)
var obj = {};
// this creates an object with the properties `color` and `whiskers` already set
// (a cabinet with two compartments)
var cat = {
color: "calico",
lives: 9
};Now we can access these properties using two methods: dot notation (using a .) or array notation (using brackets [].
var cat = {
color: "calico",
lives: 9
};
// dot notation is more common
var livesLeft = cat.lives;
console.log(livesLeft);
// -> will output "9"
// array notation allows us to use a variable
// to access the property
var key = "color"
// this is the same as `cat.color` or `cat["color"]`
var catColor = cat[key];
console.log(catColor);
// -> will output "calico"One place where are cabinet metaphor breaks down: you can always add as many properties to your object as you want. Here's some examples of adding and modifying properties:
var cat = {
color: "calico",
lives: 9
};
// add a property `curious`
cat.curious = true;
console.log(cat.curious);
// -> will output "true"
// uhoh, our cat got into trouble
cat.lives = cat.lives - 1;
console.log(cat.lives);
// -> will output "8"
// and again... here using the `--` shorthand to decrement
cat.lives--;
console.log(cat.lives);
// -> will output "7"Objects are extremely useful for storing data in a meaningful way within your program. In fact, much of the data used on the web is now stored and transmitted using JavaScript Object Notation (JSON) which is a way of storing data as JavaScript objects.
Let's see an example of using data an arrays...
This one is pretty wide open. You should already three concepts for what you'd like to do.
- Continue your "Timepiece" project, adding additional complexity and depth
- Start a new project
- Similar to "Timepiece" project
- We will have 3 check-ins: concept, prototype, completion.
- Must include sound or a data source of some kind.
- Site: http://parsons-cc.github.io/music-video-seu-mane-luiz/
- Code: https://github.com/parsons-cc/music-video-seu-mane-luiz
- Music videos
- Sound as user interface
- How can sound better communicate your idea?
- Data visualization
- Storytelling
- Maps, charts and diagrams
- Interactivity
Lesley Kadish: Sensory Data
Bodies are complex; we learn on levels that are kinesthetic, multi-sensory, and not always processed in the language part of the brain. But museums and computer interfaces tend to privilege the visual, the intellectual, the textual, the object. Workshop participants will consider ways to design interfaces that engage all types of knowing, and stimulate bodies beyond the visual/tactile domains. We will conduct three exercises to gather sensorial data, and discuss how these data can be synthesized, remixed, and if possible, digitized.
Lesley Kadish is a new media curator who developed creative Geographic Information Systems for 15 years before moving to the Smithsonian's Accessibility Program. She currently leads sensory workshops to help museums gently unsettle their dominant curatorial paradigms.