AR0051 2009-2010 Fall
From TOI-Pedia
General course information is available on the AR0051 Course overview page.
Contents
Course schedule
The course is divided into two quarters; the first quarter is an explore phase, where students do small exercises and in the second quarter the ambitions of the design and technical exercises will be used to create your website.
| Q1 | INSPIRATION | Class (2hrs) | Homework (6hrs) |
| 1 | Introduction |
|
|
| 2 | Basics of static pages (HTML) |
|
|
| 3 | The user |
|
|
| 4 | Basics of interaction 1 (Javascript) | [similar to last semester, more documentation in toipedia, jquery (and its plugins) only] |
|
| 5 | Interface basics 1 (or only about content?) | [about the portal function of the interface?] |
|
| 6 | Basics of animation (Flash) | [similar to last semester, more documentation in toipedia] |
|
| 7 | Interface basics 2 | [about the in depth content of the website?] | ? |
| 8 | Basics of interaction 2 (Flash) |
[similar to last semester, more documentation in toipedia] |
|
| WORKSHOP | CONCEPT | Build a physical 3D model of your interface |
|
| Q2 | CREATION | ||
| 1 | Plan | Presentation of selected students' concepts and group discussion of plan for translation into a website |
|
| 2 | Build and reflect |
|
|
| 3 | (repeat) | (repeat) | |
| 4 | (repeat) | (repeat) | |
| 5 | (repeat) | (repeat) | |
| 6 | (repeat) | (repeat) | |
| 7 | (repeat) | (repeat) | |
| 8 | Finish | Presentation: Process & Product | Reflection report (based on plan Q2 wk1) |
Week 1: Introduction
Meeting
- Course introduction
- Brainstorm session 'the interface'
Homework
- Create weblog
- Write course goals: Write first post on personal goals for this course. See the tutorial.
- Analyze an interface: Analyze the interface of an existing website and publish the analysis on your blog.
- Read 'user roles/cases'
- Install Firefox with Firebug: Firefox and the Firebug add-on will be used as web development tools. First install Firefox and then Firebug to get started.
- Install web template files: which will serve as a basic structure for this course. Download the web template files: File:AR0051 webtemplate.zip.
- Install netbeans (php-version): Because the Adobe CS4 suite will not be available yet this Tuesday, we will be using netbeans. This is a very comfortable HTML, CSS and Javascript editor.
- First have to install the Java Development Kit (JDK)
- After that you can install Netbeans (PHP Version). Choose the PHP version for your platform.
Week 2: Basics of static pages
Meeting
- HTML basics: analyzing HTML and CSS of existing pages using Firebug, creating pages using HTML and CSS basics, using Netbeans.
- Link to infobase: upload to InfoBase and embed InfoBase data in blog.
Homework
- Create basic style sheet for an existing webpage: see the HTML code basics tutorial.
- Upload to Infobase: see the upload to InfoBase tutorial.
- Embed in weblog: see the embed InfoBase data in blog tutorial.
- Read 'user roles/cases'
Week 3: The user
Meeting
- Role reversal: interview other people about their needs for a portfolio
- Introduction to mindmapping
- Mindmap about the user
- Introduction to 'user cases' using example
- In team of 4 each person writes a different user case (10 min)
- Group brainstorm about 'user cases'
Homework
- Write all user cases for own website on weblog
- Comment on two other students
- Select content for own website
- Describe content on weblog: Embed in weblog, see the embed InfoBase data in blog tutorial.
- Upload to Infobase: see the upload to InfoBase tutorial.
