UX: metodi, strUmenti e casi stUdiodaVide Genco11.04.2014

UX: metodi, strUmenti e casi stUdio

master snid sociaL netWorK inFLUence desiGn

UX: metodi, strUmenti e casi stUdioindice

1.metodi e strUmenti2.casi stUdio

UX: metodi, strUmenti e casi stUdiomaster snid

metodi e strUmenti

UX: metodi, strUmenti e casi stUdio

UX: metodi, strUmenti e casi stUdio

UX desiGn sViLUPPo

iL FLUsso di ProGetto

raccoLta reQUisiti

anaLisi case stUdYUser storYPersonas

inFormation arcHitectUreWireFraminGPrototYPinG

sUrVeYa/B test

conoscenZa

metaProGetto

ProGetto

VeriFica

benchmarkinGbrieF concePt

UX: metodi, strUmenti e casi stUdiooUtPUt

Lo UXd si aVVaLe di moLtePLici metodoLoGie e strUmenti cHe danno eFFicienZa, eFFicacia e QUaLità aL Processo di ProGettaZione deLLa User eXPerience.

i destinatari dei sUoi oUtPUt di ProGetto sono GeneraLmente:

iL cLienteVaLida Le sceLte

iL GraFicoVisUaLiZZa i WireFrame

Lo sViLUPPatoreasseconda i reQUisiti

L’Utente FinaLeVeriFica La ProPosta

UX: metodi, strUmenti e casi stUdioanaLisi case stUdY

1. deFiniZione Parametri

2. deFiniZione scaLa di GiUdiZio

3. VaLUtaZione

4. PosiZionamento

5. seLeZione ...aPPLicando iL ProPrio FiLtro ProGettUaLe.

oUtPUt

• PresentaZione (PdF)

strUmenti

• iLLUstrator• indesiGn• KeYnote•oFFice•GooGLe doc

...

UX: metodi, strUmenti e casi stUdiodesiGn Pattern

strUmenti

• iLLUstrator• raW• inFoGr.am•ViZ

...

oUtPUt

• diPende da oBiettiVo

Complessità Aggregazione Selezione Formalizzazione

Bar ChartGraduatorie

ScatterplotConcentrazione

ArchiRelazione

TreemapProporzioni

Diagram mapNetwork

SankeyCorrispondenza

Line ChartTrend

MatriceQuantità

Tag cloudConcetti

UX: metodi, strUmenti e casi stUdiotoUchPoint

strUmenti

• iLLUstrator• indesiGn• KeYnote•oFFice•GooGLe doc

...

oUtPUt

• PresentaZione (PdF)

a toUchPoint is a Point oF interaction inVoLVinG a sPeciFic HUman need in a sPeciFic time and PLace.

chris risdon, adaPtiVe PatH

UX: metodi, strUmenti e casi stUdioUser storY

strUmenti

• LUcidcHart• createLY•GLiFFY•mUraLLY• iLLUstrator• indesiGn• KeYnote•oFFice•GooGLe doc

...

oUtPUt

• scHede (PdF)

GLi Use case descriVono Una serie di interaZioni deLL’Utente con iL sistema e La reLatiVa risPosta deL sistema.

Le User storY si concentrano narratiVamentesUL VaLore cHe L’interaZione ottiene daL sistema.

titoLo

rUoLo deLL’Utente

descriZione

obiettiVo scoPo

criterio di VaLidaZione

UX: metodi, strUmenti e casi stUdioPersonas

Le Personas deLineano iL ProFiLo deLL’Utente ideaLe attraVerso L’indiVidUaZione deLLe sUe caratteristiche PersonaLi e deLLe sUe necessità risPetto aLL’attiVità in QUestione.

oUtPUt

• scHede (PdF)

strUmenti

• iLLUstrator• indesiGn• KeYnote•oFFice•GooGLe doc

...crea Lo

scenariodetermina

n°raccoGLi

datiinteGrarePort

coLmai VUoti

UX: metodi, strUmenti e casi stUdioaLbero di naViGaZione

oUtPUt

• scHema (PdF)

strUmenti

•mindmeister•mindJet• tHe Brain• Freemind• iLLUstrator

...

L’aLberatUra VisUaLiZZa Le seZioni, i LiVeLLi di ProFondità e Le Gerarchie deLL’arteFatto diGitaLe.

UX: metodi, strUmenti e casi stUdionaViGation maP

La maPPa di naViGaZione esPLicita i FLUssi, Le sceLte ed i coLLeGamenti trasVersaLi (crossLinK) ProPostiaLL’Utente neLLa FrUiZione deL sistema.

oUtPUt

• scHema (PdF)

strUmenti

•mindmeister•mindJet• tHe Brain• Freemind• iLLUstrator

...

UX: metodi, strUmenti e casi stUdioWireFraminG

oUtPUt

• docUmento (PdF)

strUmenti

• indesiGn• KeYnote•HotGLoo• BaLsamiQ•UXPin• PrototYPer•omniGraFFLe

...

Un WireFrame descriVe iL LaYoUt, GLi eLementi ed iL Loro comPortamento aLL’interno deLLe PaGine, aL Fine di VaLidare Le sceLte ProGettUaLi Prima di Procedere aLLo sViLUPPo GraFico e tecnoLoGico.

UX: metodi, strUmenti e casi stUdioPrototYPinG

oUtPUt

• PrototiPo naViGaBiLe

strUmenti

• PaPer PrototYPinG

•HotGLoo• BaLsamiQ•UXPin• PrototYPer•omniGraFFLe•aXUre• PoP• inVision

...

i WireFrame Possono essere PrototiPiZZati costrUendo deLLe Versioni naViGabiLi cHe consentono aLL’Utente di comPiere dei Percorsi Limitati aLLe sessioni da testare Per ricaVarne i Feedback.

UX: metodi, strUmenti e casi stUdioUser test

L’eFFicacia di Un’attiVità di UXd PUò e deVe essere VeriFicata sia in corsa, sia doPo iL riLascio.

Per QUesto è necessario:

•deFinire a Priori deLLe metriche da raGGiUnGere e misUrarLe doPo L’interVento ProGettUaLe Per reGistrarne eVentUaLi VariaZioni PositiVe o neGatiVe.

•monitorare L’eVoLUZione neLL’Uso deL sistema da Parte deGLi Utenti Per risPondere Prontamente ai Loro nUoVi bisoGni.

La riLeVaZione PUò essere sUPPortata da diVerse metodoLoGie: sUrVeY, a/b test...

oUtPUt

• rePort

strUmenti

•anaLYtics•VisUaL WeB

oPtimiZer•UserVoice•oPtimiZeLY• cLicKtaLe• inVision•UsertestinG• LooP11

...

UX: metodi, strUmenti e casi stUdioiL GiUsto metodo

UX: metodi, strUmenti e casi stUdiomaster snid

casi stUdio

UX: metodi, strUmenti e casi stUdio

UX: metodi, strUmenti e casi stUdiocasi stUdio

come arricchire L’esPerienZa sU Un oWned media

UX: metodi, strUmenti e casi stUdiocasi stUdio

i ProFessionisti deVono FronteGGiare Un Panorama sociaL e tecH in continUa eVoLUZione ed essere consaPeVoLi dei trend in atto.

i sociaL media costitUiscono soLo Una Parte deLL’ecosistema diGitaLe e Vanno oPPortUnamente coordinati aLL’interno di Una strateGia Unitaria.

GLi esemPi cHe seGUono costitUiscono deLLe testimonianZe di come L’esPerienZa Utente sU aLcUni oWned media è stata VaLoriZZata mediante L’iBridaZione con dinamiche sociaLi e tenendo conto deLLe PecULiarità d’Uso di oGni deVice.

UX: metodi, strUmenti e casi stUdiodata mininG

UX: metodi, strUmenti e casi stUdioecosistema inteGrato

UX: metodi, strUmenti e casi stUdiodiFFerenZiaZionedesktoP Vs mobiLe

UX: metodi, strUmenti e casi stUdiocorreLaZionedesktoP Vs mobiLe

UX: metodi, strUmenti e casi stUdiointeGraZione oWned / earned media

UX: metodi, strUmenti e casi stUdioVisUaLiZZare La ParteciPaZione

UX: metodi, strUmenti e casi stUdiosociaL come FaciLitatori

UX: metodi, strUmenti e casi stUdioaUmentare i toUchPoint

UX: metodi, strUmenti e casi stUdioViraL LooP

UX: metodi, strUmenti e casi stUdioreLaZioneFisico / diGitaLe

UX: metodi, strUmenti e casi stUdioPiattaForma oPen

UX: metodi, strUmenti e casi stUdioFaciLitare LoUser Generated content

UX: metodi, strUmenti e casi stUdiocomUnità diY

UX: metodi, strUmenti e casi stUdioPersonaL brandinG

UX: metodi, strUmenti e casi stUdiomaster snid

LinkoGraFia

UX: metodi, strUmenti e casi stUdio

UX: metodi, strUmenti e casi stUdioLinkoGraFia

Fonti Per La PresentaZione

• HttP://WWW.nnGroUP.com/articLes/ten-UsaBiLitY-HeUristics• HttP://WWW.nnGroUP.com/articLes/anaLYtics-User-eXPerience• HttP://UXdesiGn.smasHinGmaGaZine.com/2010/10/05/WHat-is-User-eXPerience-desiGn-oVerVieW-tooLs-and-resoUrces• HttPs://WWW.LinKedin.com/todaY/Post/articLe/20140327143305-45997570-tHe-sociaL-media-manaGer-

is-aLmost-dead-5-tiPs-on-HoW-to-eVoLVe-as-a-marKeter-mYindUstrY?trK=tod-Home-art-List-LarGe_0 HttP://WWW.sociaL-mediaeXaminer.com/9-smaLL-BUsiness-sociaL-media-sUccess-stories

• HttP://Paidcontent.orG/2013/05/30/no-tHe-JoB-oF-sociaL-media-editor-isnt-dead-BUt-it-sUre-as-HecK-Better-Be-eVoLVinG• HttP://WWW.ninJamarKetinG.it/2014/03/26/doPamina-e-sociaL-media-La-nUoVa-Frontiera-deL-content-marKetinG• HttPs://WWW.Goodreads.com/BooK/sHoW/15791237-tHe-desiGner-saYs• HttP://WWW.sKetcHin.cH/it/tooLs• HttP://WWW.sKetcHin.cH/it/BLoG/desiGn/Lo-User-eXPerience-desiGner-non-esiste-e-nemmeno-Lo-UX-desiGn.HtmL?GoBacK=.

Gmr_4356632.Gde_4356632_memBer_5803074103279632386#!• HttP://BoXesandarroWs.com/inFormation-arcHitectUres-teenaGe-diLemma/?Utm_content=BUFFerFd6B5&Utm_

soUrce=BUFFer&Utm_mediUm=tWitter&Utm_camPaiGn=BUFFer• HttP://BoXesandarroWs.com/metrics-For-HeUristics-QUantiFYinG-User-eXPerience-Part-1-oF-2• HttP://BoXesandarroWs.com/BUiLdinG-a-data-BacKed-Persona• HttP://WWW.adaPtiVePatH.com/ideas/Un-sUcKinG-tHe-toUcHPoint• HttP://500Hats.tYPePad.com/500BLoGs/2007/09/startUP-metrics.HtmL• HttP://aListaPart.com/articLe/resPonsiVe-WeB-desiGn• HttP://UnstoPPaBLeroBotninJa.com/entrY/on-BeinG-resPonsiVe• HttP://WWW.scrUmaLLiance.orG/commUnitY/articLes/2010/aPriL/neW-to-User-stories• HttP://WWW.Uiaccess.com/accessUcd/Personas_eG.HtmL• HttP://WWW.UsaBiLitY.GoV/HoW-to-and-tooLs/metHods/Personas.HtmL• HttP://BadGeViLLe.com/WiKi/GamiFication

Libri consiGLiati

• HttP://WWW.LaFeLtrineLLi.it/ProdUcts/9788871923536/desiGn_deLL’interaZione/dan_saFFer.HtmL • HttP://WWW.amaZon.com/UX-BiBLioGraPHY-saFari-content-team-eBooK/dP/B00arKLUJ8• HttP://WWW.amaZon.com/dP/0123852412/reF=WL_it_dP_o_Pd_ns_ttL?_encodinG=UtF8&coLid=2VsWQsHZ9sBmm&coLiid=i7PVVLU

K2QiXZ• HttPs://WWW.Goodreads.com/BooK/sHoW/336258.inFormation_dasHBoard_desiGn• HttP://WWW.aBooKaPart.com/ProdUcts/desiGninG-For-emotion

UX: metodi, strUmenti e casi stUdio

GRAZIE.

daVide GencodaVideGenco@GmaiL.com

-

daVideGenco.it

-

@daVideGenco