...

http://thenextweb.com/media/2012/06/02/jayse-hansen-on-creating-tools-the-avengers-use-to-fight-evil-touch-interfaces-and-project-glass/

...

Project

All of the following inputs help you get start with developing for the Web.

Right from the start we will begin with building ourselves a new web portfolio.

Here is some inspiration: http://www.awwwards.com

Inputs

1. The Web (8.4)

• History of the Internet
• How the Web works.
• Basic Introduction to HTML and CSS.
• The CSS Box Model.

Exercises

1. Install the Atom Code Editor.
2. Start with writing some HTML for your Portfolio.
3. Start with writing some CSS to style your Portfolio.

2.

...

Advanced Layouts (15.4)

• Advanced Introduction to HTML and CSS.
• Inline and Block Elements.
• Float Layouts.

Exercise

Create a list of your projects with titles, images and descriptions.

3.

...

Basic Logic (29.4)

• Basic Introduction to JavaScript.

  4. ? (13.5)

  tbd

  X. Prototyping Tools (17.5)

  Gäste einladen?

  5. ? (20.5)

  tbd

  7. Mentoring (27.5)

  Project based mentoring in the atelier.

  8. Mentoring (3.6)

  ...

  • • Differences to Processing (Compiled, Interpreted)
    • Variables (var (Number, Array, ...) vs. int, float, ...)
    • Similar Conditionals & Loops
    • Functions
  • Working with jQuery.
    • .$()
    • .click()
    • .text()
    • .css()

  Exercise

  Create a Calculator with jQuery.

  4. Graphical User Interface Elements (13.5, 20.5)

  • Basic Elements: Button, Text Field, Checkbox, Switch
  • Advanced Elements: Progress Bar, Drop Down, Slider, Radio Group
  • Navigational Elements: Toolbar, Tab Navigation, Accordion
  • Basic Layouts: Content Card, Dialog, Formular
  • Special Elements: Window, Tooltip

  Exercise

  Start working on your personal GUI Catalog.

  5. Deployment & Testing (27.5)

  • FTP, @zhdk, Hostpoint, ...?
  • Local Server => iPad, iPhone