Johnny Benson • Fall 2014
Tuesday & Thursday • 7:30-9:20PM
Rm 813 • 3 credit hrs
Office hours by appointment or directly after class
Email <johnny.benson@nyu.edu>
Class Website <https://github.com/IDMNYU/DM2193FA2014>
Our challenge to the children is simple: solve an everyday problem by creating a muscle-powered tool. Their response is extraordinary - with tools that do everything from making household tasks easier, to improving the lives of the young, disabled or elderly.
— Bob Vila
- Reading Discussion: Engineering, Craftsmanship, and Art
- Environments
- Browser
- Server
- CLI
- Browsers
- IE
- Firefox
- Safari
- Chrome
- -Netscape-
- -Mosaic-
- Early Web
- This website works best in Netscape Navigator at 640x480
- Web 2.0
- Document Object Model
- HyperText Markup Language
- Elements
- Attributes
- Semantics
- Cascading Stylesheets
- CSS 1, 2, 3
- Selectors
- Properties
- Specificity
- Javascript
- ES5 Tables
- ES6 Tables
- Classical vs. Prototypical Inheritance
- Native Objects
- jQuery
- Tools
- Sublime Text
- Github
- Chrome Inspector
- Photoshop, Illustrator (?)
- caniuse.com
- More resources
- Putting it all together
- The Designer and the Developer
- Final Product, Timeline, Budget (Good, Fast, Cheap ▲ )
- Audience
- User Interface vs. Content
- Heirarchy and Organization
- Usability and Intentionality
10min at the end of class for any unanswers questions
- Wroblewski, Luke. “Visible Narratives: Understanding Visual Organization.” LukeW Interface Designs. 2003. (21 Aug. 2008)
- The Unproven Path BY JOEL SPOLSKY
- (Optional) Garrett, Jesse James. “Chapter 2: Meet the Elements.” from The Elements of User Experience: User-Centered Design
- Put together three recipe pages.
- Mark them up in HTML
- Make them use the same heirarchical structure!
- Commit them to your Week 2 folder.
- index.html, index2.html, index3.html
- Create a valid HTML Document that contains:
- At least three different block level elements
- Inside each block level element should be three different inline elements
- One of the inline elements should be this image: https://38.media.tumblr.com/tumblr_lmi0qugt5r1qindnxo1_400.gif
- Commit this HTML Document to your Github before class.
- Info:


