NM 320: Intermediate Interactive Design

INTERMEDIATE INTERACTIVE DESIGN

instructor: curt cloninger
email: curt at lab404 dot com
office: Zeis 214. Monday 1-2:30. Tuesday 12-1:30.
location: university of north carolina asheville
* indicates an offline media object

class-specific | resources | student sites

CLASS-SPECIFIC

intro
syllabus
rough project calendar
attendance and grading policies

major assignments
Art Movement Site (HTML/CSS)
Expressive Character/Environment Project (Flash)

required texts
HTML5 for Web Designers (keith)
CSS3 for Web Designers (cederholm) [example code]
lynda.com video tutorials (via Ramsey Library)

optional text
Bulletproof Ajax [via Ramsey Library site] (keith)

RESOURCES

Web Site Usability Basics (Cloninger)
Ladislav Sutnar: Web Design Before the Internet (Heller)

Art Movement Site
pre-design deliverables: creative brief
a list of 20th Century art movements
The Russian Avant-Garde Book [strong example]
Multimedia: From Wagner to VR [weaker example]

HTML/CSS
HTML tags
CSS reference table
CSS3 transitions specs
browser safe font list
google web fonts
javascript image rollover code (view source)
CSS positioning 101 (stokes)
CSS Floats 101 (stokes)
CSS Browser reset code (meyer)
dragable elements script
CSS drop down menu code [view source]
lightbox 2
web putty

Web Grid Systems
The Grid System: online grid system resources
designing with grid-based approach
960 grid system
gridding the 960 (moll)
Setting Type on the Web to a Baseline Grid (miner)
CSS Grid Positioning Module
Yahoo! UI Library: Grids CSS
CSS Grid Builder
baseline grid framework
grids are good [pdf] (vinh)

Expressive Character/Environment Project
flowchart/site map software
Rafaël Rozendaal
Angelo Plessas
Arcangel Constantini [automatic drawings]
sketch
the fragile circus (campbell)
samorost (1 * 2) / machinarium
hi-res
snarg
oculart (lillemon)
i made this. you play this. we are enemies. (nelson)
the shy picture (reeders/macleod)
reverse flash back (jimpunk)

Experimental Interfaces
multi-touch interface (han)
Seadragon/Photosynth (arcas)
dontclick.it
wooden mirror (Rozin)

Flash
Thoughts on Flash (Jobs)
AdobeTV Flash Video Tutorials
Adobe AS3 Written Tutorials
Flash & Math AS3 Written Tutorials
stencyl
Flash Embedding Cage Match (van der Sluis)

STUDENT SITES