Wednesday, April 28, 2010

Bruce Sterling clip


Advice to the young

"What is a Spime, and Why is it Useful?"

Bruce Sterling's thoughts on Design

Viridian Design Movement - Bruce Sterling

Classic address by Bruce Sterling to the 1992 Games Developers Conference:

http://lib.ru/STERLINGB/story.txt


Excellent book on Industrial Design: "Shaping Things" by Bruce Sterling as a free download.

Bruce Sterling "Blobjects" speech at SIGGRAPH 2004

Monday, April 26, 2010

Playing a sound when user rolls over an image using WYSIWYG html editor

http://www.wysiwygwebbuilder.com/events.html

Learning from Ginsberg


Alan Ginsberg as well as William Burroughs are responsible for some of the finest writing to emerge from America.

here are lists to audio recordings of classes by Ginsberg

and readings and classes by William Burroughs at the internet archive

The web - where will we be in five years? (written at the end of 2009)

http://www.noupe.com/trends/the-future-of-the-web-where-will-we-be-in-five-years.html

Speaking of Timelines - the timeline of art history

http://www.metmuseum.org/toah/

The Web Based


The Web Based - a useful web design gallery

About.com - getting a web design job


About.com articles on getting a job in web design

Exam now on the 10th May at 6.:30pm

Class,

A new date for the DAI527 exam is the 10th May at 6.30 in room 115.

The exam will run for one hour and will comprise true/false, multiple choice,
as well as short written response.

It will cover most of the concepts covered in the course.

There will be an exam review on the 5th May which is also the deadline for the liquid identity projects.

DC

A good reason to include blogging in your website

http://news.bbc.co.uk/2/hi/technology/4132752.stm

Radical Web Design (UK)

http://www.radicaldesigns.org/

Radical Designs is a full service web development group focused exclusively on the needs of non-profit and grassroots social change organizations.

And a cool CSS web-magnification effect done using 'hover'

New iPhone found in bar


http://gizmodo.com/people/diskopo/posts/

Prototype - Javascripting made slightly easier and code snippets from Webmonkey

http://www.webmonkey.com/2010/02/get_started_with_prototype/

and


Code Snippets


and

Templates

Wednesday, April 21, 2010

QA on other student's websites

Please make sure your sites have links from your blogs or please allow students to
use your machines tonight so that we can do Quality Assurance testing on each other's work.

Use this form for a post session survey

Cut & paste the info from this .pdf into a word file then use word to fill out the form on your colleague's site, then email this to them.

DC

Jonathan Harris - the Web's Secret Stories

http://www.ted.com/talks/jonathan_harris_tells_the_web_s_secret_stories.html

Artist and computer scientist Jonathan Harris wants to make sense of the emotional world of the Web. With deep compassion for the human condition, his projects troll the Internet to find out what we're all feeling and looking for.

Tim O'Rielly of O'Rielly publishing discusses 'the cloud'

http://www.youtube.com/watch?v=WqLB99dA48k&feature=player_embedded

Very interesting talk on the notion of 'cloud' computing where data is porcessed by a system that resides online or in 'the cloud'

Some interesting ideas that point to a new way of thinking of the relationship between data and how it is used.

Also some very timely pointers on some possible work opportunities in the new healthcare initiatives in Washington.

DC

IDSA


The IDSA stands for the Industrial Designer's Society of America. There are chapters all around the country; this one is for San Francisco.

http://idsasf.blogspot.com/

Monday, April 19, 2010

Please post the link to your live site on your blog

Class,

Please post a link to your live site on your blog.

Even if your site is not 'ready' its important to publish it to see how it performs live.

REMEMBER:

Your inquiry should not be limited to an isolated self-analysis but should include, for example, broader community and national perspectives, and critical investigations of human relationships, the influences of cultural environment, and the impact of technology.

The process should take into consideration some of the following questions:

who are we as individuals?
who are we as citizens/part of a community?
how are identities constructed?
how are identities defined?
how are identities maintained?
how are identities stolen/lost?
what are we?
what does it mean to be human?
where do we draw the line between human and machine?

Central to notions of identity are these interrelated topics :
individual identity
cultural identity
virtual identity (ie non physical)
liquid identity (ie multiple identities - see A.R.Stone, 1996)
family and ethnicity
class
economics
religion
sexuality
spirituality
mass mediated identity
feminist issues
political identities

The aim of the assignment is to provide the opportunity for you as designers and creative writers to demonstrate the technical skills gained and theoretical concepts explored in the lab
workshops and independent commitment to the project.

It will be important to utilise the non-linear and interactive nature of the Internet and the World Wide Web to enhance your project. In addition you need to comprehensively document your
process: this should include a site map, flow chart of the navigation and related

My other classes

Earlier in the semester, some students asked if I might find way to integrate other classes I teach at CCSF into DAI527 and so I've posted the blogs for these classes here, such that posting to them might assist you with some aspects of web design.

I will spend some time tonight presenting some ideas which I think overlap between Storyboarding & Storytelling and Videogame Design and Web Design.

GAME 100 - Exploring Game Worlds blog


MMSP145 - Storyboarding and Storytelling

Scott Rogers on Game Design - ideas applicable to web design also


http://mrbossdesign.blogspot.com/2009/03/everything-i-learned-about-game-design.html

and a text file of notes from the talk

Recent excellent articles about the web

The Dogs of War - titanic battles for control of the internet

alternative to face book, older versions of software links

http://www.wired.com/epicenter/2010/04/online-sharing-open/

Old versions of software for download

Validate your HTML & CSS

Use the W3C HTML Validator to check your html

and check the validity of your CSS by entering your site here:

http://www.jigsaw.w3.org/css-validator/

Wednesday, April 14, 2010

Tonight's Class

PART ONE

Case study - commercial design company based in San Francisco:
FINE DESIGN GROUP


Business of design - short video interviews with

Josh Kelly, principle FINE design "transition from student to professional"

Ken Cook VP, WW Creative - "pursuing work in major urban areas"

Melissa Chan - Designer, FINE - "early career advice"

Sharrie Brooks - Senior Designer, Cahan and Associates "starting your career"

PART 2 - BRIEF OVERVIEW OF STUDENT BLOGS - STATUS UPDATE ON MAJOR ASSIGNMENTS - EACH STUDENT MAKES A "SHOPPING LIST" OF TASKS TO DO THIS WEEK & NEXT WEEK


PART 3 - OPEN LAB/TROUBLESHOOTING MAJOR ASSIGNMENTS

Monday, April 12, 2010

Forms, Box Model (again), letter spacing, Pseudo-classes, 'hover'

HTML FORMS

http://www.w3schools.com/html/html_forms.asp

A form is an area that can contain form elements.

Form elements are elements that allow the user to enter information (like text fields, textarea fields, drop-down menus, radio buttons, checkboxes, etc.) in a form.

A form is defined with the
tag.

--------------------

The CSS Box Model

http://www.w3schools.com/css/css_boxmodel.asp


All HTML elements can be considered as boxes. In CSS, the term "box model" is used when talking about design and layout.

The CSS box model is essentially a box that wraps around HTML elements, and it consists of: margins, borders, padding, and the actual content.

-------------------------

CSS letter-spacing Property - it increases or decreases the space between characters in a text.

http://www.w3schools.com/css/pr_text_letter-spacing.asp


---------------------------

PSEUDO-CLASSES

CSS pseudo-classes are used to add special effects to some selectors.

http://www.w3schools.com/css/css_pseudo_classes.asp


-----------------------------

CSS :hover pseudo-class

http://www.w3schools.com/css/pr_pseudo_hover.asp


The :hover pseudo-class adds a special style to an element when you mouse over it. Active, visited, unvisited, or when you mouse over a link, can all be displayed in different ways.

A note on classroom participation - attendance, punctuality - staying until the end of class

Class,

I need to remind you that only four weeks remain until the 5th May deadline for the main LIQUID IDENTITY project.

I have been lenient with students leaving before the of class but I require students to remain in room 115 until 8.30 from now on.

You are of course free to come and go to get coffee, snacks etc, but please be mindful of the limited time that remains in which a focussed, dedicated lab has been made available for your exclusive use, with your instructor and peers there for assistance and advice.

Thanks.

David Cox

Monday, April 5, 2010

Float based layouts

The CSS 'box' model of webpage layou

http://w3schools.com/css/css_boxmodel.asp

Here are some tutorial sites that assist with 'float' based layouts of web pages

http://css.maxdesign.com.au/floatutorial/


http://webdesign.about.com/od/advancedcss/a/aa010107.htm


Use them to start to build your pages in terms of layouts - sidebars, headers, footers etc

Today's class

Crit:

Ex 4 – Liquid Identity Site Design Documents & supporting material as posted
on individual student blogs - Q&A

The Role of Sound in New Media and On the Web continued..

A look at the creative capabilities of sound in reinforcing the user/audience’s experience of
digital media and an examination of web media which push the boundaries of
possibility with audio.

Followed by a follow-up workshop on sound on the web. An overview of various approaches - review of AUDACITY freeware.