Design & Technology

38
Design & Technology L.Galli (2008-2012) Copyright of this presentation is by referred sources for quoted/reproduced content (text & images) and/or Luca Galli for original content. Original content by Luca Galli is released as Creative Commons License BY-NC-ND 2.0

description

Hi, this deck is mainly meant to help with my Design Studies lessons to undergraduate students at NABA, Media Design and Multimedia Arts School, Milan.These slides are supposed to come with a live commentary for the class, so sorry if you wish to have more explicit context and liaisons. Please see referred sources to this purpose. Slides on Norman, Salen and Zimmerman, Haraway are based on the articles by these authors included in Design Studies.A reader. Edited by Hazel Clark and David Brody, Berg, Oxford and New York, 2009. Please see all other sources at the bottom of the slides and at the end of each section. Images are all credited to their creators and copyright holders, to the best of my knowledge and care. If you are unhappy with the fact that they are used here, of if you think that someone’s rights have not been fully respected in any manner, please mail me to lgalli at pobox dot com and I will promptly remove them

Transcript of Design & Technology

Page 1: Design & Technology

Design & TechnologyL.Galli(2008-2012)

Copyright of this presentation is by referred sources for quoted/reproduced content (text & images) and/or Luca Galli for original content. Original content by Luca Galli is released as Creative Commons License BY-NC-ND 2.0

Page 2: Design & Technology

Hi, this deck is mainly meant to help with my Design Studies lessons to undergraduate students at NABA, Media Design and Multimedia Arts School, Milan. These slides are supposed to come with a live commentary for the class, so sorry if you wish to have more explicit context and liaisons. Please see referred sources to this purpose. Slides on Norman, Salen and Zimmerman, Haraway are based on the articles by these authors included in Design Studies. A reader. Edited by Hazel Clark and David Brody, Berg, Oxford and New York, 2009. Please see all other sources at the bottom of the slides and at the end of each section. Images are all credited to their creators and copyright holders, to the best of my knowledge and care. If you are unhappy with the fact that they are used here, of if you think that someone’s rights have not been fully respected in any manner, please mail me to lgalli at pobox dot com and I will promptly remove them.

Page 3: Design & Technology

“Alongside the old idea of design as the drawing of objects that are then to be built or manufactured,

there are many ideas, all very different” (Jones 1984)

Image retrieved on http;//www.designrelated.com from Le Corbusier le grand, Phaidon 2008 used here with no prior permission request Quote from John Chris Jones, Essays in Design, Wiley 1984

L.Galli Design & Technology

Page 4: Design & Technology

“Designing as the process of devising not individual products but whole systems

or environments such as airports, transportation, hypermarkets, educational curricula, broadcasting

schedules, welfare schemes, banking systems, computer networks” (Jones 1984)

John Chris Jones, Essays in Design, Wiley 1984

Page 5: Design & Technology

Photo credit: screenshot of online course “iPhone User Interface Design” from Apple Developer Connection, used here with no prior permission request

L.Galli Design & Technology

Page 6: Design & Technology

Projects get a green light at the start, and go directly to

engineering where they are built. The next phase is when they ship--usually late, with bugs, over budget,

and missing functionality(Buxton 2007)

Bill Buxton, Sketching User Experiences, Morgan Kaufmann 2007Photo retrieved on http://www.billbuxton.com credit Microsoft Research 2007

L.Galli Design & Technology

Page 7: Design & Technology

UXUser Experience

User Research

Interaction Design

Design Research

IxD

UsabilityHuman Factors

Computer Human InteractionL.Galli Design & Technology

Page 8: Design & Technology

We recommend three principles of design [...] Early focus on Users and Tasks [...]

Empirical Measurement [...] Iterative Design

[Gould and Lewis 1985]

Gould and Lewis 1985 Designing for Usability: Key Principles and What Designers Think

L.Galli Design & Technology

Page 9: Design & Technology

Photo credit: “Donald Norman” (2005) by jordanfischer, retrieved on Wikipedia Creative Commons Attribution 2.0 Generic

Donald Norman

L.Galli Design & Technology

Page 10: Design & Technology

The PC is hardly a technological blessing; it as much as a curse as a wonder,

and it is attacked as much as it praised[Norman 1998]

Norman 1998 The Invisible Computer, quoted from Norman “What’s wrong with the PC?” in Design Studies. A reader, ed. by Clark and Brody, Berg 2009

L.Galli Design & Technology

Page 11: Design & Technology

Photo credit: “XP BSOD Evening” by Chris Pirillo, retrieved on Flickr Creative Commons License BY-NC-ND 2.0

L.Galli Design & Technology

Page 12: Design & Technology

Rather than trying to make a complex machine easy,the better way would be to make a simple machine in the first place

[Norman 1998]

L.Galli Design & Technology

Norman 1998 The Invisible Computer, quoted from Norman “What’s wrong with the PC?” in Design Studies. A reader, ed. by Clark and Brody, Berg 2009

Page 13: Design & Technology

Source: paper "A personal computer for children of all ages" presented at the ACM National Conference, Boston; image retrieved on Wikipedia, where it is published under the following terms: “This work is copyrighted (or assumed to be copyrighted) and unlicensed. [...] However, it is believed that the use of this work in the [Wikipedia] article "Dynabook" [...] qualifies as fair use under United States copyright law. Any other uses of this image, on Wikipedia or elsewhere, may be copyright infringement. “

Alan Kay’s Dynabook (1968)

L.Galli Design & Technology

Page 14: Design & Technology

I dont’ want to use a computer,I want to accomplish something

[Norman 1998]

L.Galli Design & Technology

Norman 1998 The Invisible Computer, quoted from Norman “What’s wrong with the PC?” in Design Studies. A reader, ed. by Clark and Brody, Berg 2009

Page 15: Design & Technology

I propose an alternative approach: a human-centered development process

coupled with a set of disruptive technologies, the better to yeld a family of information appliances

designed to fit human tasks, tailored for human needs and abilities

[Norman 1998]

Norman 1998 The Invisible Computer

L.Galli Design & Technology

Page 16: Design & Technology

Photo credit: “iPad” by FHKE, retrieved on Flickr Creative Commons License BY-SA 2.0

L.Galli Design & Technology

Page 17: Design & Technology

R&D Design Engineering Sales

Management and Marketing

Adapted from Bill Buxton, Sketching User Experiences, Morgan Kaufmann 2007

Product-service development process

L.Galli Design & Technology

Page 18: Design & Technology

Needs & wants

Requirements & Specifications

Interaction & UI

Creative & Visual

Design funnel

L.Galli Design & Technology

Page 19: Design & Technology

Large-scale development

Small/medium build

Small/medium build

Quick fix

Quick fix

Quick fix

Quick fix

L.Galli Design & Technology

Page 20: Design & Technology

The Elements of User ExperienceA basic duality: The Web was originally conceived as a hypertextual information space;but the development of increasingly sophisticated front- and back-end technologies hasfostered its use as a remote software interface. This dual nature has led to much confusion,as user experience practitioners have attempted to adapt their terminology to cases beyondthe scope of its original application. The goal of this document is to define some of theseterms within their appropriate contexts, and to clarify the underlying relationships amongthese various elements.

Jesse James [email protected]

Visual Design: graphic treatment of interfaceelements (the "look" in "look-and-feel")

Information Architecture: structural designof the information space to facilitateintuitive access to content

Interaction Design: development ofapplication flows to facilitate user tasks,defining how the user interacts withsite functionality

Navigation Design: design of interfaceelements to facilitate the user's movementthrough the information architectureInformation Design: in the Tuftean sense:designing the presentation of informationto facilitate understanding

Functional Specifications: "feature set":detailed descriptions of functionality the sitemust include in order to meet user needs

User Needs: externally derived goalsfor the site; identified through user research,ethno/techno/psychographics, etc.Site Objectives: business, creative, or otherinternally derived goals for the site

Content Requirements: definition ofcontent elements required in the sitein order to meet user needs

Interface Design: as in traditional HCI:design of interface elements to facilitateuser interaction with functionalityInformation Design: in the Tuftean sense:designing the presentation of informationto facilitate understanding

Web as software interface Web as hypertext system

Visual Design: visual treatment of text,graphic page elements and navigationalcomponents

Concrete

Abstract

time

Conception

Completion

FunctionalSpecifications

ContentRequirements

InteractionDesign

InformationArchitecture

Visual Design

Information DesignInterface Design Navigation Design

Site ObjectivesUser Needs

User Needs: externally derived goalsfor the site; identified through user research,ethno/techno/psychographics, etc.Site Objectives: business, creative, or otherinternally derived goals for the site

This picture is incomplete: The model outlined here does not account for secondary considerations (such as those arising during technical or content development)that may influence decisions during user experience development. Also, this model does not describe a development process, nor does it define roles within auser experience development team. Rather, it seeks to define the key considerations that go into the development of user experience on the Web today.

task-oriented information-oriented

30 March 2000

© 2000 Jesse James Garrett http://www.jjg.net/ia/

Copyright Jesse James Garrett, slide reproduced here with no prior permission request

J.J.Garrett’s Elements of User Experience

L.Galli Design & Technology

Page 21: Design & Technology

Lego People Photography by Joe Shlabotnik 2006 CC by 2.0 retrieved on Flickr

L.Galli Design & Technology

Page 22: Design & Technology

“Within the HF [human factors] approach,the human is often reduced to being

another system component” (Bannon 1991)

“the very idea of ‘the user’ reconfigures a multifaceted human being as an adjunct to a piece of

hardware or software” (Satchell-Dourish 2009)

Liam Bannon, From Human Factors to Human Actors 1991Christine Satchell, Paul Dourish, Beyond the User: Use and Non-Use in HCI 2009

About users

L.Galli Design & Technology

Page 23: Design & Technology

User Research / Design Research

L.Galli Design & Technology

Book covers are copyright of respective publishers, used here with no prior permission request

Page 24: Design & Technology

Understanding context

Developing insights

Defining opportunities

Setting strategies

Creating tangible (digital) design expressions

Sharing the vision

Helping in the go to market / go public

Observing adoption and usage

Redesigning

L.Galli Design & Technology

Page 25: Design & Technology

Bill Buxton (2007) Sketching User Experiences, Morgan Kaufmann

John D. Gould and Clayton Lewis (1985) Designing for Usability: Key Principles and What Designers Think, in Communications of the ACM, vol. 28-3

Donald Norman (1998) The Invisible Computer, MIT Press

L.Galli Design & Technology

Page 26: Design & Technology

Game StudiesGame Theory

Game Design

play Cybernetics

L.Galli Design & Technology

Page 27: Design & Technology

Image from Doom retrieved on Wikipedia, uploaded from User:Fredrik, published under the following terms: “This is a screenshot of a non-free copyrighted video game or computer game, and the copyright for it is most likely held by the company or person that developed the game. It is believed that the use of a limited number of web-resolution screenshots for identification and critical commentary on the computer or video game in question [...] qualifies as fair use under United States copyright law, as such display does not significantly impede the right of the copyright holder to sell the copyrighted material, is not being used to generate profit in this context, and presents ideas that cannot be exhibited otherwise.” http://en.wikipedia.org/wiki/File:Doom_gibs.png

L.Galli Design & Technology

Page 28: Design & Technology

Image from The Sims retrieved on Wikipedia, uploaded from ClonedPickle, published under the following terms: “This is a screenshot of a non-free copyrighted video game or computer game, and the copyright for it is most likely held by the company or person that developed the game. It is believed that the use of a limited number of web-resolution screenshots for identification and critical commentary on the computer or video game in question [...] qualifies as fair use under United States copyright law, as such display does not significantly impede the right of the copyright holder to sell the copyrighted material, is not being used to generate profit in this context, and presents ideas that cannot be exhibited otherwise.” http://en.wikipedia.org/wiki/File:SimsSS.jpg

L.Galli Design & Technology

Page 29: Design & Technology

Inputs are how the systems monitor the environment - they allow the environment

to influence the system. Outputs are the ways that

the systems take action - they are how the system influences the environment

[Salen and Zimmerman 2003]

Salen and Zimmerman 2003 Rules of Play: Game Design Fundamentals, quoted from Salen and Zimmerman “Introducing Cybernetic Systems” in Design Studies. A reader, ed. by Clark and Brody, Berg 2009

L.Galli Design & Technology

Page 30: Design & Technology

A cybernetic system contains three elements [...]The sensor senses something about the environment

or the internal state of a system.The comparator decides whether or not a change

to the system needs to made as a result of the sensor’s reading,

and the activator activates the change[Salen and Zimmerman 2003]

L.Galli Design & Technology

Salen and Zimmerman 2003 Rules of Play: Game Design Fundamentals, quoted from Salen and Zimmerman “Introducing Cybernetic Systems” in Design Studies. A reader, ed. by Clark and Brody, Berg 2009

Page 31: Design & Technology

The scoring function is the system’s sensor that measures some aspects of the game state.

The controller is the comparator, which looks at the sensor’s reading and makes the decision

whether or not to take action. The game mechanical bias is the activator,

a game event or set of events that can be turned on or off depending on the decision of the comparator

[Salen and Zimmerman 2003]

L.Galli Design & Technology

Salen and Zimmerman 2003 Rules of Play: Game Design Fundamentals, quoted from Salen and Zimmerman “Introducing Cybernetic Systems” in Design Studies. A reader, ed. by Clark and Brody, Berg 2009

Page 32: Design & Technology

Jeesper Juul (2003) Half-Real: Video Games between Real Rules and Fictional Worlds, The MIT Press

Joost Raessens and Jeffrey Goldstein (edited by) (2005) Handbook of Computer Game Studies, The MIT Press

Katie Salen and Eric Zimmerman (2003) Rules of Play: Game Design Fundamentals, The MIT Press

Katie Salen and Eric Zimmerman (edited by) (2005) The Game Design Reader: A Rules of Play Anthology, The MIT Press

Credit for Game Studies selected readings above: Cristiano Poian http://www.poian.org

L.Galli Design & Technology

Page 33: Design & Technology

altGender studies

Cyborg

Critical Theory

Feminism

CyberpunkCyberculture

Philosophy

Politics

L.Galli Design & Technology

Page 34: Design & Technology

Photo credit: “Donna Haraway” (2010) by jeanbaptisteparis - Jean-Baptiste LABRUNE retrieved on Flick Creative Commons Attribution-ShareAlike 2.0 Generic (CC BY-SA 2.0)

Donna Haraway

L.Galli Design & Technology

Page 35: Design & Technology

Photo credit: “Chimera. Apulian red-figure dish, ca. 350-340 BC.” by Jastrow (2006) retrieved on Wikipedia released in Public Domain http://en.wikipedia.org/wiki/File:Chimera_Apulia_Louvre_K362.jpg

L.Galli Design & Technology

Page 36: Design & Technology

By the late twentieth century, our time, a mythic time, we are all chimeras, theorized and fabricated hybrids

of machine and organism; in short, we are cyborgs

[Haraway 1991]

Haraway 1991 A Cyborg Manifesto, quoted from Haraway “A Cyborg Manifesto” in Design Studies. A reader, ed. by Clark and Brody, Berg 2009

L.Galli Design & Technology

Page 37: Design & Technology

Late twentieth-century machines have made thoroughly ambiguous

the difference between natural and artificial, mind and body, self-developing and externally designed,

and many other distinctions that used to apply to organisms and machines

[Haraway 1991]

L.Galli Design & Technology

Haraway 1991 A Cyborg Manifesto, quoted from Haraway “A Cyborg Manifesto” in Design Studies. A reader, ed. by Clark and Brody, Berg 2009

Page 38: Design & Technology

tnxtechnology

@lga11i

#designL.Galli Design & Technology

GAME OVER