Skip to content

Tutorials — Web Capstone

INET 2895: Web Design Capstone (3 credits) ==

Tues,  Thurs from 2:00pm –3:45pm

=============================================================

===============================================================

******* For most issues — go directly to www.processing.org *********

******* For secondary issues —- try a google search as specific to your issue or error message as possible*******

*******Don’t forget to join our google group for answers to common questions and quick support *******

============================================

OCTOBER 17TH — WE WILL HAVE A LABORATORY ON LEARNING THE CONSTRAIN FEATURE,

AND THE NEXT PROJECT IS ASSIGNED….

============================================

MAKE A SKETCH OF TWO EYES…  the eyes can be any eyes (animal, cartoon, monster, dinosaur, etc.) .  We only want the eyes (no other facial features like noses, teeth, etc.).    It is important that you make the eyes exhibit an expressive quality whether that be distraction, anger, scared, etc… Think about a cats eyes and how expressive they are, and how they can exhibit many of their emotions and intent.  Make sure to use the building blocks we have learned in laboratories:  how to display an image, how to change cursor display, how to use Mouse X and Mouse Y, the constrain feature, loops, if else statements… wow… where to begin?  where to begin?

How about prototype on paper and plan out your attack for your sketch!!  Show it to teacher (me)  and brag at how awesome it is going to be….

THE PROJECT IS WORTH 10 POINTS… AND WE WILL WANT TO BE PERSUADED AND WOWED BY YOUR PRESENTATION….

=============================   =============================

HERE IS A LIST OF SOME OF THE ELEMENTS…

— THAT REACT TO THE CURSOR

— THAT UTILIZE A IMAGE THAT YOU CAN EITHER CREATE IN PHOTOSHOP, GIMP, TAKE FROM THE WEB, ETC…

— THAT USE THE CONSTRAIN FEATURE

— THAT USE MOUSE CLICK

— THAT USE MOUSE X, AND MOUSE Y

============================   =============================

here are some eyes for inspiration:

http://www.wrighteyecare.com/images/Strabismus1.jpg

http://www.layoutsparks.com/1/142739/pretty-eyes-lashes-beautiful.html

http://www.bigoo.ws/images/gif-eyes-halloween

============================   =============================

OCTOBER 6TH — IN MEMORY OF STEVE JOBS

—————————————————-

OCTOBER 3RD – LEARNING MOTION

-——————————————————————


SEPTEMBER 6TH ASSIGNMENT

Make a Mondrian Mosaic

=============================================

SEPTEMBER 13TH ASSIGNMENT

Do a self portrait using :  10 variables and atleast 3 variables 3 times.

===============================================

z Syllabus

GETTING STARTED WITH PROCESSING LECTURE

Assignments

HOMEWORKS = TURN IN AS A DIGITAL FOLDER = EXTRA POINTS IF YOU MAKE IT AN APPLICATION FOR THE WEB
================
= mosaic (10 Points)

= bezier (10 Points)

= slide show (10 Points)

= key press / spray paint (10 Points)

= creating a class (10 Points)

= clock assignment (use sec, milli, min, etc) & use constrain (10 Points)

= recreate your version of space invaders (10 Points)

2 QUIZES = MEET ME TO COMPLETE
================
make sure that you have received credit for them/// so come and see me
if you haven’t

Quiz 1  (5 Points)

Quiz 2  (5 Points)

FINAL PROJECT = TURN IN ON THE DAY OF OUR FINAL1
=====================

= FINAL PROJECT  (20 Points)

——————————————————–

Processing Inspiration:

Flight 404Robert Hodgins

NYX or Lina Nilson

Sabin & Jones

Reza Ali

Universal Everywhere

MTV Brazil

Golan Levin’s New Years Cards

BMW kinetic sculpture

Dataisnature

Infosthetics

The Teeming Void

Serial Consign

CONT3XT

FlowingData

Abstractmachine

Burak Arikan

Processing blogs

Pixelsumo

Sojamo Tumblr

we-make-money-not-art

Visual Complexity

PostSpectacular

Theverymany

Resources:
google
Official Processing Web Site
Processing Hacks, an advanced snippets and tutorials wiki
Processing blogs
Processing is so del.icio.us!
Images of current Processing work
The art of algorithmic movement
Code Tree, an excellent code sharing resource
Shiffman’s Processing workshop
RSS feeds for ICM Projects:

nastypixel

RSS feeds

Yahoo image search
Current weather feeds
Del.icio.us
Digg
Flickr
Google news
Yahoo developer
NetFlix

Edit this entry.

Instructor: Justin Hoffman

Phone: ext: 2600

Office: BU 109

Email: hoffjust@gmail.com

Website: www.justinhoffman.net

======================================================

Course Description:

This Course will be exploring the creative design environment, Processing. Providing students with the foundation to create visual imagery, interactive content, and programming foundations to expand their possibilities in the visual, audio, and interactive realms at large.

The creative process doesn’t exist in a vacuum– it’s a highly integrated activity reflecting history, aesthetic theory, and often the technological breakthroughs of the day. This was certainly the case during the Renaissance, when artists, engineers, scientists, and thinkers all came together to create truly remarkable works of art and engineering. Over the last few decades, we’ve been experiencing our own Renaissance with the proliferation of digital technology– creating radically new ways for people to work, play, communicate, and be creative. Processing was born directly out of these exciting developments.” (Greenberg, Ira)

Class Overview and Format

August 22 – 25 : Meet the students, discuss their computer skills/abilities/ personal interests/ dreams. Context and the processing books bibliography— summary of what processing is, examples of artists who use processing and interactivity where processing/programming is used.—- show the website and community/book — discuss philosophies on how to approach learning a language, letting the information wash over you when you are confused, when confused stopping and potentially attacking from another angle.

August 29 – September 1: Download Processing from processing.org, define terms (run, stop, new, open, save, export, file, edit) demonstrate how to receive them on site, explain the powers of google, — let them know of quiz on terms for next week, give them listing of terms and what quiz will be … example walk thru exercise

NO SCHOOL – SEPTEMBER 5

September 12 – 15 : Structure 1: code elements, coordinates and primitives, explain how the x and y coordinates are set up… demonstrate how to add color — demonstrate artists that utilize this simple shape method (i.e. abstract art, etc.) — homework to create a piece of work similar by layering simple shapes …

September 19 – 22 : Demonstrate works created, critique, and students email the code homework. Begin working on arithmetic functions and repetition (explaining the arrays, loops, for, whiles ).

September 26 -29 : The math of it all: Arithmetic, Functions, Control Decisions

October 3 -6 : Fancy Curvature – Vertices, Curves, Color by Numbers

October 10 – 13 : Create the rays of intensity – Display, Tint, Text

October 19, 20: Math is Back in a big way – Trigonometry, Random

October 24 – 27:  — MIDTERM EXAMS

October 31 – November 3 :  Lets Get 3D – Translate, Matrices, Rotate, Scale

November 7 – 10 : Modularity and Sketching, Techniques, Form, and Code

November 14 -17 : Now do you believe in Parametricism? – Parameters, Recursion

November 21, 22: Interactive Introduction –Mouse I, Static Forms, Keyboard

THANKS GIVING  BREAK

November 28 – December 2: Interactive Rules Right? – Mouse II, Time, Date

December 5 – December 9 : Working on Final Project

December 12 – December 17 :  FINAL EXAMS

Required Materials and Reading:

class web site and tutorials @ www.justinhoffman.net

Tutorials and online documentation: www.processing.org

—–

Downloads (Free) : Processing from processing.org

The Hard Cope of the Book should also be available in the Book Store

—–

Readings: Processing: a programming handbook for visual designers and Artists

( Reas and Fry)

Processing: Creative Coding and Computational Art (Greenberg)

GRADING:

===================

HOMEWORKS = 30%

PROJECTS = 35%

QUIZES / PARTICIPATION = 20%

ATTENDANCE = 15%

============== 100%