...

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

Inputs

1. The Web (6.4

...

, 09.00-12.00

...

, 4.K14)

• History of the Internet
• How the Web works.
• Install the Atom Code Editor.
• Basic Introduction to HTML and CSS.

...

Prepare a simple design in Photoshop or Sketch for an App, Website, Portoflio or a crazy Science-Fiction UI.

2. HTML & CSS (12.4

...

, 09.00-12.00

...

, 4.K14)

• Box & Font Formatting.
• The CSS Box Model.

...

Begin building some elements of your design in HTML and CSS.

3. Advanced Layout Techniques (20.4

...

, 09.00-12.00

...

, 4.K14)

• Inline and Block Elements.
• Float Layouts.

...

Improve your design and use more advanced techniques to improve the layout.

3. JavaScript (12.5

...

, 09.00-17.00

...

, 4.K14)

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

...

Start working on your personal GUI Catalog.

4. Graphical User Interface Elements (19.5

...

, 09.00-12.00

...

, 4.K14)

• 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

...

Finish your personal GUI Catalog.

5. Deployment & Future (26.5

...

, 09.00-12.00

...

, 4.E08)

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