Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011

Presentazione sul tema: "Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011"— Transcript della presentazione:

1 Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011
Sketching Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

2 Cos’è? Uno sketch è un disegno a mano libera eseguito rapidamente.
E’ uno strumento di lavoro, non un prodotto finito. Non deve essere “bello” o verosimile, ma efficace. Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

3 A cosa serve? Pensare Rappresentare Comunicare Nel processo di design:
Annotare e sviluppare idee; Confrontare idee; Confrontarsi con altri progettisti; Lavorare in gruppo su un’idea; Spiegare un’idea ad altri membri del team; Test con l’utente Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

4 Perché è utile? Veloce Economico
Non necessita di strumenti sofisticati Alla portata di tutti Stimola la collaborazione Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

5 Come fare? Stabilire cosa si vuole esprimere/rappresentare
Oggetti reali? Concetti astratti? Rappresentare gli elementi chiave Semplificare Usare metafore e simboli Usare i colori per evidenziare, chiarire, aggiungere informazioni… Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

6 Al lavoro! Presentatevi…
Perché avete deciso di iscrivervi a questo laboratorio? E a “Scienze della Comunicazione”? Quali sono i vostri interessi? … Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

7 Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011
Sketching Tecniche Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

8 Strumenti - 1 Matita HB (adatta anche ai principaianti)
Una volta acquisita una certa confidenza, si possono provare anche matite più morbide. Le matite dure sono le meno adatte allo sketching… Penne, pennarelli, evidenziatori: Esplorate le differenze di tratto e gli effetti che si possono ottenere La cosa importante è che lo strumento scelto sia scorrevole! Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

9 Strumenti -2 Un comune foglio bianco (grammatura 80)
Permette di appoggiarsi comodamente sulla superficie del tavolo Adatto anche ai principianti Si può appallottolare e cestinare Un blocco per schizzi Adatto a chi ha acquisito buona confidenza con lo sketching Permette di conservare ordinatamente i propri lavori Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

10 Strumenti - 3 Un tovagliolino
Quando viene un’idea bisogna fissarla subito! Cartoncini con diverse grammature, consistenze, colori… Esplorate le differenze che si possono ottenere per trovare gli strumenti più adatti a voi! P.S.: la carta riciclata va benissimo!!! Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

11 Visual Thinking Pensare per immagini;
Usare le immagini per stimolare e sostenere il pensiero; Usare la parte destra del cervello (emozionale, creativa…) per rappresentare e organizzare l’informazione; Usare le immagini per risolvere problemi, per progettare, per rappresentare situazioni complesse, per comunicare efficacemente. Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

12 Visual Thinking – come? Acquisire un’abitudine positiva a pensare per immagini: Avere sempre con sé carta e penna; Prendere appunti, fare schizzi e schemi, rappresentare visivamente le proprie idee; Allenare la propria capacità a pensare per immagini. Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

13 Scarabocchiare “Doodling” Libero Controllato
Allena la capacità di pensare per immagini, Controllato Allena la manualità, la precisione, la capacità di ottenere esattamente ciò che si vuole tramite il disegno. Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

14 Al lavoro! Scarabocchi liberi: prendete “appunti”… quali immagini vi suggeriscono queste parole? Schianto Bruciore Fumo Pietra Scivolata Scarabocchi controllati: unire i puntini  Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

15 Disegnare persone - 1 (da: Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

16 Stick figure: tutorial - 1
Iniziare sempre disegnando il corpo (invece che la testa). Disegnare un cerchio per la testa. La posizione della testa rispetto al corpo aiuta a rappresentare molti stati d’animo e situazioni. Dare un’espressione al volto: le classiche “emoticons” possono essere molto utili. Disegnare il naso (basta una riga sottile) aiuta ad indicare l’orientamento del corpo, utile soprattutto quando ci sono vari personaggi che interagiscono. Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

17 Stick figure: tutorial - 2
Aggiungere le gambe – sono fondamentali per rappresentare posizione e movimento-. I piedi possono essere rappresentati con due piccoli ovali e aiutano a connettere il personaggio ad un “suolo” immaginario. Disegnare le braccia, completando la posizione o il movimento che si è iniziato con le gambe. Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

18 Stick figure: tutorial - 3
Aggiungere le mani con due piccoli tratti. Usare fumetti, se necessario, per rappresentare i pensieri e le parole del personaggio e renderlo più espressivo. Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

19 Disegnare persone - 2 profili La stella (star figure)
Il blob (blob figure) Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

20 Al lavoro! Allenatevi a disegnare persone secondo il modello della stella e del blob: Differenziate i personaggi Uomo/donna, alto/basso, magro grasso… Con la barba, con gli occhiali, con i capelli lunghi… Disegnate le persone in diverse posizioni Sedute, di profilo, che corrono, che ballano… Che muovono un braccio… Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

21 Mani, maniglie e bottoni
Le mani sono una delle cose più difficili da disegnare! Semplificare: solo 4 dita (una è il pollice!) Rappresentare in dettaglio solo quando serve! Servono per afferrare maniglie, premere bottoni… Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

22 Al lavoro! Provate a disegnare mani che afferrano e premono:
Premere un bottone; Afferrare un joystick; Ruotare una maniglia; Afferrare una pallina; Portare una valigia Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

23 Espressioni Le espressioni del volto sono fondamentali per comunicare le emozioni: Semplificare: concentrarsi sulle parti più espressive. Prendere ispirazione dalle emoticon: Semplici Standard (o quasi) Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

24 Al lavoro! Quante espressioni diverse riuscite a disegnare?
Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

25 Metafore Alcune metafore visive ci permettono di rapresentare concetti astratti: Lampadina accesa  idea; Ingranaggi lavoro Al lavoro: Quali altre metafore vi vengono in mente? Quali sono concetti ci sarebbe bisogni di rappresentare parlando di HMI? Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

26 Al lavoro! Dividete il foglio in 12 caselle e scrivete in ognuna il nome di un oggetto di uso comune. Scambiate il foglio con un compagno. Disegnate un’icona per ciascun oggetto: L’obiettivo è semplificare, non fare un disegno estremamente verosimile! Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

27 Casualità - 1 Un modo per stimolare la creatività (di nuovo!) nel pensare per immagini è quello di usare una macchia come punto di partenza. Ad esempio: Appoggiate una bustina di the su un cartoncino; Quando la macchia è asciutta, provate a farne il punto di partenza per un disegno; Ripetete l’esercizio con costanza  Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

28 Casualità - 2 Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

29 Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011
Sketching Uno scenario completo Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

30 Al lavoro! E’ il momento di mettere tutto insieme…
Concentratevi sull’ambito dell’Interazione Uomo-Macchina Scegliete una situazione e qualche tipo di metafora… Disegnate una “storia” in quattro fasi: Situazione iniziale Problema Soluzione Conclusione Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

31 Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011
Oltre lo sketching Paper Prototyping Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

32 Paper prototyping Fare sketch per il paper prototyping
è più semplice a veloce che utilizzare qualche sw specifico. non pone vincoli tecnici (sulla carta, tutto si può fare!) è veloce da modificare: si può sperimentare, cambiare idea, fare miglioramenti, entrare in un ciclo di progettazione e riprogettazione… Si possono usare elementi stampati: oggetti che possono entrare nel progetto, layout interessanti da incollare, scarabocchiare, modificare… Consente di prendere appunti “contestuali” E’ molto utile per rappresentare la maggior parte delle interfacce “tradizionali”. Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

33 Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero
Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

34 Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero
Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

35 Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero
Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

36 Paper prototyping Test con utenti:
Selezionare tester rappresentativi degli utenti finali; Preparare scenari e task Documentare le sessioni sperimentali (es. con un video) per poter rilevare emozioni e stati d’animo; Intervistare i tester per verificare se ricordano l’interfaccia Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

37 Vantaggi & Svantaggi Vantaggi: Svantaggi:
Gli utenti stessi possono fare un mock up cartaceo per proporre le loro idee o per spiegare cosa si aspettano che succeda Si possono prendere appunti sul mock up stesso (dove un utente ha cliccato…) Non è necessario alcun supporto tecnologico Svantaggi: Non permette di verificare fattori legati alla tecnologia: tempi di caricamento, scrolling… E’ meno immediato verificare gli aspetti visivi (font, immagini…), a meno che non si usino parti stampate. Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero

38 Paper prototyping con slide
Estendendo un po’ il concetto, è anche possibile usare delle slide per i test con gli utenti… Le transizioni sono gestite automaticamente Meno impegnativo per lo sperimentatore Riproducibile (può essere inviato via ) Permette di testare gli aspetti visivi (look and feel), usando grafica digitale. Laboratorio di Interazione Uomo-Macchina – a.a. 2010/2011 F. Vernero