ARTS 102

Art 102: Digital Media Tool Box: Concepts and Techniques - Intro to Programming for Art Students (with focus on the Web and data)

Time: T/TR 10.00AM-11.50AM
Room: Old Gym E-Studio
Instructor: Lisa Jevbratt
Office hours: T/TR 11.50 AM to 12.50 PM
Prerequisites: Arts 22, HTML coding experience is required. No programming experience is required.

In this class you will learn basic programming skills applied to the specific context of the Internet and the Web. The skills you acquire can be applied to learning and using other computer languages for a multitude of other purposes.

We will be writing programs in the programming language Perl that access and combine data from the Web and present the information in new ways. The Web is full of constantly updating and fascinating information, there is data about weather, tsunamis, earthquakes, UFO sightings, whale tracking, gas prices, world population, stock market data, personal blogs, sports results and much more. You can also make projects that use text and images from sites such as Flickr and Twitter. By using HTML forms you can get information from the visitors to your Web site, and include it in your projects. The programs you make can be interactive web based projects, or they can produce images and text for printing or other use.

The class requires a focused and dedicated interest in the concepts and techniques dealt with. The class will be demanding and students have to work independently on solving programming problems and researching ideas.

The class is a beginning programming class, with no prior programming experience expected apart from what is covered in Art 22 and 7D. If you have more experience with programming there is still a lot to learn and explore.
Week 1

Thursday 9/22
Lecture: Class Introduction

Week 2

Tuesday 9/28
Due: Your class homepage
Lecture: UNIX; CSS; Perl: Print, Loops, Arrays, Random

Examples: Basic Perl

Thursday 9/30
Due: Exercise 1: Make a simple perl program that generates a webpage. Use the print command and the rand function. Link to the program from your homepage.
Lecture: UNIX; CSS; Perl: Print, Loops, Arrays, Random

Examples: Basic Perl

Week 3

Tuesday 10/5
Due: Perl Tutorial, Part 1. Be prepared to answer questions about the reading. And, if there is anything that you don't understand in the readings, be prepared to ask questions.

Thursday 10/7
Due: Project 1

Lecture: If statements, getting and parsing data from the web.

Examples: If Statements, Getting data from the web

Week 4

Tuesday 10/12
Due: Exercise 2: Find a webpage that change at least daily. Use 'get' to read the webpage. Then use an 'if statement' and '=~' to generate different content (text, images, colors, shapes, placements) depending on some content in the webpage your program reads. Link to the program from your homepage.
There might be some interesting sites here. But you can use any site that change daily, weather, news, sport sites, stocks...

In the tutorial there is a small section in part 3, 'Simple matching', that describes the =~ operator. Read it. The rest of section 3 will be covered later in the class so don't read it now unless you feel like you want to challange yourself.

Thursday 10/14
Due: Perl Tutorial, Part 2 up to, not including, the section 'Filehandles'. Be prepared to ask and answer questions about the reading.

Week 5

Tuesday 10/19
Due: Project 2
Lecture: HTML forms
Examples: really_simple_form.html

Thursday 10/21
Due: Exercise 3: A simple program that use user input (from an HTML form) to change something in an old program of yours.
If you are using a program that uses LWP::Simple, you have to change the line:
use LWP::Simple;
use LWP::Simple qw(!head);

Lecture: More on Forms + Writing/Reading Files

Examples: Form

Read/Write Files

Read/Write Files + Form

Some "simple" APIs ("Application Programming Interfaces")..more later in class

World Weather Online



Week 6

Tuesday 10/26
Due: 1. Midterm Project Idea(s)
2. Perl Tutorial, Part 2: The section 'Filehandles' and forward. If you feel overwhelmed don't read the 'Subs' section. Be prepared to answer questions about the reading. And, if there is anything that you don't understand in the readings, be prepared to ask questions.

Thursday 10/28
Due: 1. Reading Assignment
2. Written Midterm Project Proposal (see the midterm description for details)
Lab Be prepared to ask questions about technical aspects of your project.

Week 7

Tuesday 11/02
Due: Project Progress Report

Thursday 11/4
Due: Project Progress Report

Week 8

Tuesday 11/9
Due: Midterm Project
Lecture: API's and Graphics

Thursday 11/11
No Class (Veterans Day)

Week 9

Tuesday 11/16
Due: Find a website that combines information from two or more sites, or reuses/recontextualizes information from one ore more sites (a mashup) that you find interesting. Good places to look are: and

On your homepage, link to the site and write a one paragraph description of the 'mashup' including why you find it interesting.

Lecture: API's and Graphics
Examples: GD graphics library

Projects using GD by Lisa:
Infome Imager

APIs ("Application Programming Interfaces")


Several examples
see each program for documentation pages

We Feel Fine API from We Feel Fine

Flickr API for the Flickr photo sharing website


Thursday 11/18
Due: Final Project Ideas

Week 10

Tuesday 11/23
Due: Final Project Written Proposal/Description

Thursday 11/25
Thanksgiving No Class

Week 10

Tuesday 11/30
Due: Progress report

Thursday 12/2

Tech Help: Lisa's Perl Examples
Perl Documentation
Perl GD Library
CPAN modules

APIs: Fairly simple REST based APIs

Yahoo Web Search API
Yahoo Term Extraction API
Yahoo Traffic API
More Yahoo APIs
Gaze web service. Gives you data such as population density and long/lat of places.
Amnesty International's API provides censored web content from all over the world.
We Feel Fine API from We Feel Fine

More complex REST based APIs

Flickr API for the Flickr photo sharing website
Google Search API (a bit more complex to work with)
Google Translation API (a bit more complex to work with)
Technorati API for the Technorati blog search website
eBay APIs

Other API's

Facebook API
Various Amazon APIs (difficult to use)

Listing of may APIs at

Software: TextWrangler, a good text editor (similar to BBEdit). (free) (Mac)
JEdit, text editor for Mac and PC. (free)
Filezilla, sftp client for Mac and PC. (free)
Putty, an ssh client for PC. (free)
UCSB VPN client (for accessing the online book storage Safari and academic articles, data etc.)

Misc: Page with some data sites...please contribute.
Eco Vis Challenge
Mashup Listing
"Ten Best Flickr Mashups"
Student Projects 06/07
Netsquared Mashup Challenge