Il Tool Definitivo dello UX Designer

19
Il tool definitivo dello UX designer di Alberto Mucignat UX Camp Firenze 17 Ottobre 2009

description

A parte l'incipit "provocatorio", questa presentazione voleva spiegare l'importanza di riuscire a impostare un livello di comunicazione precedente alla stesura dei wireframe. Questo livello di comunicazione non viene quasi mai considerato, mentre è un momento importante per il processo creativo. In questa presentazione ho voluto sottolineare alcuni esempi e strumenti che conosco e che mi aiutano in questa fase del lavoro: carta e penna, lavagna, etc. Mi interessa molto il tuo feedback, per cui non esitare a commentare o contattarmi.

Transcript of Il Tool Definitivo dello UX Designer

Page 1: Il Tool Definitivo dello UX Designer

Il tool definitivo dello UX designer

di Alberto Mucignat

UX Camp Firenze17 Ottobre 2009

Page 2: Il Tool Definitivo dello UX Designer

L’utente.

http://www.flickr.com/photos/mikeoliveri/1322688055/

Page 3: Il Tool Definitivo dello UX Designer

Cosa fa l’UX Designer

Link 1 Link 2 Link 3

Logo

Video title Searcg

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse ut purus. Suspendisse tristique. Cras et sem at odio porttitor mattis. Donec dignissim ornare tortor. Donec lectus turpis, tempor id, cursus vitae, eleifend in, risus. Aenean turpis. Mauris ultricies quam malesuada ligula.

Video

img

Button 1 Button 3Button 2

img

img

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse ut purus. Suspendisse tristique. Cras et sem at odio porttitor mattis. Donec dignissim ornare tortor.

Comments

More videos

img

img

img

Page 4: Il Tool Definitivo dello UX Designer

Cosa fa l’UX Designer

Link 1 Link 2 Link 3

Logo

Video title Searcg

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse ut purus. Suspendisse tristique. Cras et sem at odio porttitor mattis. Donec dignissim ornare tortor. Donec lectus turpis, tempor id, cursus vitae, eleifend in, risus. Aenean turpis. Mauris ultricies quam malesuada ligula.

Video

img

Button 1 Button 3Button 2

img

img

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse ut purus. Suspendisse tristique. Cras et sem at odio porttitor mattis. Donec dignissim ornare tortor.

Comments

More videos

img

img

img

Marketing

UX Team

Sviluppatori

Stakeholders

Dirigenti

Fornitori

Brand Manager

Product Manager

Page 5: Il Tool Definitivo dello UX Designer
Page 6: Il Tool Definitivo dello UX Designer

Maria22 anni, Roma

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

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

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

Obiettivi

• ------------- ----- --- ---- -- -----

• ---- -- ----- --- - -- ---- ------

• ---- ----- --- ---- -- ---- ---- -----

• ---- -- ----- --- - -- ---- ------

Task

• ------------- ----- --- ---- -- -----

• ---- -- ----- --- - -- ---- ------

• ---- ----- --- ---- -- ---- ---- -----

• ---- -- ----- --- - -- ---- ------

Link 1 Link 2 Link 3

Logo

Video title Searcg

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse ut purus. Suspendisse tristique. Cras et sem at odio porttitor mattis. Donec dignissim ornare tortor. Donec lectus turpis, tempor id, cursus vitae, eleifend in, risus. Aenean turpis. Mauris ultricies quam malesuada ligula.

Video

img

Button 1 Button 3Button 2

img

img

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse ut purus. Suspendisse tristique. Cras et sem at odio porttitor mattis. Donec dignissim ornare tortor.

Comments

More videos

img

img

img

Page 8: Il Tool Definitivo dello UX Designer

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

Tempo

Co

sto

Page 9: Il Tool Definitivo dello UX Designer

“Using wireframes earlier in the design process focuses time and attention

on all the wrong details and activities.”

http://www.adaptivepath.com/ideas/essays/archives/000863.php

Page 10: Il Tool Definitivo dello UX Designer

“Above the bar is what the user sees. Below the bar is what they do. An arrow connects the user’s action to a

new screen with yet another action.”

http://37signals.com/svn/posts/1926-a-shorthand-for-designing-ui-flows

Page 11: Il Tool Definitivo dello UX Designer

Testata

Contenuto principale

Azioni secondarie

Area utente

Footer

Altri

contenuti

Wireframe a blocchi

Page 12: Il Tool Definitivo dello UX Designer

La bassa fedeltà comunica meglio.http://www.mucignat.com/blog/archives/654-bassa-fedelta.html

http://www.flickr.com/photos/pasotraspaso/2561252664/

Page 13: Il Tool Definitivo dello UX Designer

Scarabocchiare è un modo di comunicare

http://www.flickr.com/photos/manueb/3275645812/

Page 14: Il Tool Definitivo dello UX Designer

Web Design 2.0

Page 15: Il Tool Definitivo dello UX Designer

“...throwing ideas on a whiteboard to help flesh out the concepts a bit more.”

-D’Arcy Norman

http://www.flickr.com/photos/dnorman/3492238090/

Page 16: Il Tool Definitivo dello UX Designer

3 idee finali

#1 Comunicare le idee attraverso il disegno

#2 Disegnare è un processo di comunicazione

#3 Disegnare assieme agli altri

Page 17: Il Tool Definitivo dello UX Designer

Le città del futuro

Page 18: Il Tool Definitivo dello UX Designer

Risorse utili

Back of the napkinDan Roam

Communicating DesignDan Brown

Sketching UserExperienceBill Buxton

Rapid VizKurt Hank

Page 19: Il Tool Definitivo dello UX Designer

Grazie!

Alberto MucignatUser Experience Designer

[email protected]://www.mucignat.com

Web che funziona.