sistemi multimediali aa 2005/06

Sistemi multimediali AA 2005/06

Gli artefatti digitali 1

Gli artefatti digitali

Sistemi multimedialiM.A. Alberti

Gli artefatti digitali2

L’abbinamento strutturale

• Il design attua l’abbinamento tra corpo e artefattodigitale mediante criteri grafici• Forma, colore, dimensione, posizione, orientamento, texture

e trasformazioni temporali (animazioni, video)

• Un’azione viene avviata tramite action triggers• Pulsanti o bottoni raggruppati in menu



L’abbinamento strutturale

Utente Azione o compito Interfaccia dell’utensileo artefatto





L’interfaccia

Il progetto di un’interfaccia riguarda:

• l’analisi delle sequenze operative che l’utente deve compiere per eseguire determinati compiti

• le componenti visive tramite cui si costituisce lo spazio operativo sullo schermo del monitor



L’interfacciaIl progetto di un’interfaccia consiste:

• scelta delle funzioni• loro denominazione • organizzazione in gruppi di similitudine• individuare una gerarchica su livelli diversi• trattamento visivo

Nella concezione riduzionistica del designesso si limita all’ultimo passo.

Infodesign non è infostyling.





Ingegneria vs design

• Punto di vistadell’ingegneria

velocitàaffidabilitàprestazione...

• Punto di vista deldesign

facilità e rapiditàd’apprendimento daparte di utenti nonnecessariamenteesperti

Il programma vienevalutato in termini di



Il design

• Il design non può essere applicato dopo che ilprodotto è stato realizzato• Anche se questo è quello che comunemente si

crede

• Il design deve essere parte integrante delprocesso di sviluppo per essere efficace



Il processo del design

• Simile alle tipiche metodologie dell’ingegneria

• Una comprensione iniziale del problema basatasull’esperienza o sulla ricerca

• Seguita da un processo iterativo di generazione evalutazione fino alla soluzione che meglio soddisfa irequisiti



Il contesto del design• Analizzare e interpretare i processi operativi• Specificare la funzionalità d’uso• Organizzare i comandi• Definire i flussi delle diverse sequenze

operative• storyboards

• Design dei componenti grafici• Design della documentazione

• i manuali parte integrante del progetto di interfaccia• Design del materiale promozionale



Il ruolo del designer• Svolge un servizio

L’infodesign offre poche opportunità di soddisfare tendenze narcisistiche e diffondere creazioniegocentriche. Si suppone che il pubblico non sia particolarmente interessato a queste manifestazionipersonali. L’infodesign è in primo luogo un servizio.Questa constatazione contrasta con le ambizioni diespressione individualistica.

Gui Bonsiepe



Il ruolo del designer

• Svolge un ruolo cognitivo in quanto è uncoautore

— selezione dei contenuti— ordinamento— gerarchizzazione— collegamenti— distinzioni visive

Azione efficace





Il designer sceneggiatore

• Il ruolo del designer d’interfacce è simile al ruolo dellosceneggiatore teatrale

• Una rappresentazione di oggetti e di ambienti perfornire un contesto per l’azione• In scena: disegni di oggetti che hanno alcune funzioni (porte

che si aprono), luci per attirare attenzione (colore intensitàorientamento), pannelli che rappresentano elementi diarchitettura

• Nelle interfacce: disegni degli oggetti modellati dal sw, delmodo per impartire loro un comportamento e dell’ambientein cui si svolgono azioni



Una rappresentazione delmondo

• Lo sceneggiatore e il designer grafico creanorappresentazioni del mondo reale• Simulando aspetti del reale

• Ma il design visuale non è tutta l’interfaccia

• Come lo sceneggiatore non scrive completamente ilpezzo teatrale



Arte e design

• Il designer non è un artista• Spesso un elemento di confusione

• L’arte è valutata per la sua originalità edespressività

• Il design deve risolvere conflitti imposti dalproblema, dal budget, dalla tempistica• Più vicino all’ingegneria• Trova continuamente compromessi (trade-off)

There are no simple answers,only tradeoffs

Donald A. Norman



La via del successo

• Un reale successo può essere raggiunto soloattraverso la stretta collaborazione tra

• Designer sensibili alle problematiche di sviluppodel sistema

• Programmatori e produttori sensibili alleproblematiche del design visuale e concettuale






Gli artefatti digitali19http://www.rottentomatoes.com/ Sistemi multimedialiM.A. Alberti


www.unisource.it



www.itholding.itSistemi multimedialiM.A. Alberti


OK, ma da dove devo cominciare?

Perchè lohanno messo

lì?

Perchè lo chiamano

così?

Questi due linksembrano

uguali.Perchè?

E’ lì che devocliccare?

Ma a che cosa servequesto sito?



http://www.betterphoto.com



La manipolazione diretta

• Una rappresentazione continua econsistente dell’oggetto d’interesse

• Azioni fisiche che eliminano la necessità diapprendere sintassi complesse permodificare il comportamento degli oggetti

• Rapide operazioni incrementali e reversibili,immediatamente visibili grazie a feedback

Termine introdotto da Shneiderman





Ruolo della manipolazionediretta

• La manipolazione diretta crea un senso dicoinvolgimento diretto ed è la chiavedell’interazione uomo-macchina• Sketchpad, Sutherland 1963

• Nel mondo digitale tutto ciò che importa è larappresentazione, in cui inter-agiscono utenti,oggetti software e elementi dell’interfaccia• Una sorta di WYSIWYG esistenziale

Termine coniato allo XeroxPARC: un paradigma perinterfacce a manipolazionediretta



Sliders

MAC OS 8



Bottoni



BOTTONI OTITOLI?


Gli artefatti digitali29 ? Sistemi multimedialiM.A. Alberti


WINDOWS 2.0





WINDOWS 95Sistemi multimedialiM.A. Alberti


Usabilità

La efficacia, efficienza e soddisfazione con cuideterminati utenti possono raggiungeredeterminati obiettivi in determinati ambienti d’uso

ISO 9241



Usabilità


ISO 9241



Usabilità


ISO 9241



Usabilità


ISO 9241


Gli artefatti digitali

Tre variabili indipendentiambienti

obiettivi

utenti





Usabilità


ISO 9241

le risorse speseper ottenere talerisultato

le risorse speseper ottenere talerisultato

l’accuratezza ecompletezza concui raggiungol’obiettivo



Usabilità


ISO 9241

Possiamo definire delle metriche



chi è?



chi è?


Gli artefatti digitali41 Sistemi multimedialiM.A. Alberti


Sfondo rosso ?!?





I principi del dialogo

1. Adeguatezza al compito2. Autodescrittività3. Controllabilità4. Conformità alle aspettative dell’utente5. Tolleranza agli errori6. Adeguatezza alla personalizzazione7. Adeguatezza all’apprendimento

(ISO 9241-10)Sistemi multimedialiM.A. Alberti


1. Adeguatezza al compito

“Un dialogo è adeguato al compito nella misurain cui supporta l’utente nell’efficace ed efficientecompletamento del compito”

ISO 9241-10




2. Auto-descrittività

“Un dialogo è autodescrittivo nella misura in cuiogni passo di dialogo è immediatamentecomprensibile attraverso un feedback delsistema oppure è spiegato all’utente quandoquesti richieda l’informazione rilevante”

ISO 9241-10

help



Esempio

Da: Microsoft Word for Windows

Premendo Help:

You tried to create a copy of a file that uses the same filenameand location as the original file. You cannot copy a file to itself.To correct this problem: type a new filename or path.



Da: SQL Windows

Esempio





3. Controllabilità

“Un dialogo è controllabile nella misura in cuil’utente è capace di mantenere il controllosull’intero corso dell’interazione fino a quandol’obiettivo è stato raggiunto”

ISO 9241-10



4. Conformità alle aspettative

“Un dialogo è conforme alle aspettativedell’utente nella misura in cui corrisponde allaconoscenza del compito, alla formazione eall’esperienza dell’utente, e alle convenzionicomunemente seguite”

ISO 9241-10



5. Tolleranza agli errori

“Un dialogo è tollerante agli errori nella misurain cui, a dispetto di evidenti errori di input, Irisultati desiderati possono essere ottenutisenza (o con minime) azioni correttive”

ISO 9241-10



6. Adeguatezza allapersonalizzazione

“Un dialogo è adeguato alla personalizzazionenella misura in cui il sistema di dialogo ècostruito in modo da permettere adattamentialle necessità e capacità individuali dell’utenteper un dato compito”

ISO 9241-10



7. Adeguatezzaall’apprendimento

“Un dialogo è adeguato all’apprendimento nellamisura in cui esso fornisce mezzi, guida estimolo all’utente durante le fasi diapprendimento”

ISO 9241-10



Esempio





Esercizio

Quale delle due interfacce utente cheseguono è più adeguata?

Compito: formattare uno o più dischettiUtente: uno di noiContesto: uso tipico: casa o ufficio



Soluzione 1



Soluzione 2



Esercizio

Quale delle due interfacce utente che seguonoè la migliore?

Compito: search & replace di stringhe



Soluzione 1



Soluzione 2





Creatività e design

Quali processi permettono di creare nuovi artefatti?

• Mimesi • Ibridazione• Metafora• Mutazione• …



Mimesi



Mimesi



Mimesi



Mimesi



Ibridazione

Letteralmente:incrociare piante o animali di specie diversein modo da ottenere ibridi

• Esempio:lavagna + proiettore ⇒ lavagna luminosa





Ibridazione



MetaforaDal greco trasferimento: il processo linguisticobasato su analogia o similitudine sottointesa, percui si traspone un vocabolo o una locuzione dalsenso proprio a un senso figurato.

sei un cannone, sei un fulmine, annegare nei debiti,l’ondeggiare delle spighe, una grandine di pugni.

La similitudine originaria può non essere più presente

il braccio della lampada o la gamba del tavolo.Un mezzo espressivo, un arricchimento

semantico



Metafore comuni nel sw

• Il secchio di vernice per la funzione di colorazionedi superfici.

• Il pennello per la funzione di colorazione dellelinee.



Mutazione

Fenomeno per cui in una specie si origina unindividuo che presenta alcuni caratteri diversi dai suoiascendenti, e li trasmette alla discendenza.



Il design generativo

• Progettare un artefatto e generarne automaticamentedelle mutazioni genetiche.

• Progettare le caratteristiche essenziali di un artefattoe un computer genera possibili istanze

• metadesign o design di specie.



Metadesign

Le sedie sono ottenute automaticamente: sono tuttediverse, ma condividono i caratteri genetici

http://soddu2.dst.polimi.it/






Emergent design: Chair farm



Un metaprogetto architetturale

Diversi modelli 3D ottenuti dallo stesso meta-progettoSistemi multimedialiM.A. Alberti


Basilica, C.Soddu, 1998




Evoluzione degli artefatti

• Elettrodomestici specializzati nell’elaborazione diinformazione• Strumenti musicali elettrici, tastiere varie: l’infodomestico

musicale• Macchine fotografiche digitali, visori• Apparecchi medicali





Gli infodomestici intelligenti

• Oggetti che inglobano comportamento intelligente.• Il progetto TTT Things that think del MIT

• http://www.media.mit.edu/ttt/• Kitchen Sync: una cucina che ha conoscenza tanto da sapere

che voi volete il vino bianco chardonnay freddo e il sugo caldo;oppure conosce le misure di un pizzico, un cucchiaio …

• Mort: un pinguino parlante• Toys to Think With• Programmable Bricks• Hyperinstruments



Pro e contro

• Vantaggi• La specializzazione consente di assolvere bene

un dato compito e di realizzare un design ottimale• Strutturazione fisica su misura• Interfaccia adeguata• Conseguente facilità di utilizzo



Pro e contro

• Svantaggi• Perdita di possibilità di condivisione dati• Maggiore flessibilità del computer general

pourpose• Maggiore costo complessivo



Bibliografia

Shneiderman, B.

Designing the User Interface.Strategies for Effective Human-Computer Interaction

Addison Wesley,Reading MA 1987.

sistemi multimediali aa 2005/06

Documents