CHI SONO?

25 ANNI, MI OCCUPO DI UX/UI PER DISPOSITIVI MOBILE DAL 2008.

HO FONDATO LA MIA SOFTWARE HOUSE KFLAB.COM (2008) POI EVOLUTASI INVULCANICALAB.COM

CO-FOUNDER DI COSMEETI.CO (STARTUP OPERANTE NEL SETTORE DEI COSMETICI)

SOMMARIO

UX UI CONCLUSIONI

Non vi annoierò con un sommario lungo e illeggibile.

DIAMO LA DEFINIZIONE

L' UX è un approccio della progettazione per rendere interfacce web e mobile facili da usare per l'utente finale, senza richiedere all'utente una curva di apprendimento notevolmente eccessiva e "demotivante".

L’ IMPATTO

FATTI DELLE DOMANDE SULL’ IMPATTOCHE GENERA LA TUA INTERFACCIA

L’ IMPATTO

- NON DARE NULLA PER SCONTATO

- GLI UTENTI POTREBBERO FARE RAGIONAMENTI DIVERSI DAL TUO

- L’ UTENTE PUO’ VISITARE IL SITO O APP CON UN “PERCORSO DIVERSO”

COSA VEDI TU

MENUARTICOLO

SOCIAL

COSA PUO’ VEDERE L’ UTENTE

FONT TROPPO PICCOLO

QUAL E’ IL MENU TRA

I DUE?

LA FOTO E’ CLICCABILE?

RIFLETTETE SU QUESTO

L’ UTENTE NON E’ STUPIDO!ANCHE SE PUO’ SEMBRARE STRANO, MA HA

SEMPRE RAGIONE!

RIFLETTETE SU QUESTO

“LA COLPA E’ SUA CHE NONOSTANTE UNA UI FANTASTICA, NON RIESCE A USARLA!”

SBAGLIATO!

L’ IMPORTANZA DEI NOMI

MENTRE COSTRUISCI UN SITO WEB O UN’ APP, RICORDATI DI UTILIZZARE VOCI CHE SIANO

CHIARE PER TUTTI

MENO PER L’UTENTEPIU’ IMMEDIATO LIBRO

OVVIO PER TETOMO LIBRO

MENO PER L’UTENTE

PIU’ IMMEDIATO CERCA

OVVIO PER TE

FILTRA CERCA

REGOLA FONDAMENTALE

LESS IS MORE SEMPRE

NON DARE NULLA PER SCONTATO

SECONDO IL DESIGNER...

NON DARE NULLA PER SCONTATO

SECONDO L’ UTENTE...

ORMAI SIAMO TUTTI MULTI-TASKING

ACCESSO A PIU’ CONTENUTI

MENO TEMPO PER TUTTO

MENO PAZIENZA

LE CONVENZIONI

LE CONVENZIONI SERVONO PER “STANDARDIZZARE” ALCUNI PROCESSI MIRATI A MIGLIORARE LA CURVA DI APPRENDIMENTO DEL SITO/APP O PER VELOCIZZARLA.

LE CONVENZIONI

GIUSTO COMPROMESSO TRA CREATIVITÀ E CONVENZIONI.

(SOPRATTUTTO QUANDO SI PARLA AD UN PUBBLICO ETEROGENEO)

“VIE” NUOVE RESETTANO TUTTO QUELLO CHE L’UTENTE HA IMPARATO

LE CONVENZIONI >> ESEMPI

ESEMPI NELLA VITA REALE

WC

ESEMPI NELLA VITA REALE

SIMBOLO USB

ESEMPI NELLA VITA REALE

ON - OFF

DIAMO UNA BUSSOLA ALL’ UTENTE

MINIMIZZA IL “RUMORE” VISIVO!

MENO TESTO RIDURRE TUTTO QUELLO CHE E’ INUTILE

CREARE UN PERCORSO NELLA VITA REALE

IKEA INDICA BENE I PROPRI PERCORSI STABILITI E “OBBLIGA” I CLIENTI COSI A RESTARE PIU’ DEL TEMPO DOVUTO MA CON LA MASSIMA TRASPARENZA

...MA ANCHE NEL WEB!

RASSICURA GLI UTENTI DANDO “DELLE BRICIOLE DI PANE”

SEGUITE I MOVIMENTI

MIGLIORATE L’UX CONOSCENDO E ANALIZZANDO BENE COSA FA

L’UTENTE

TUTTO BELLO, MA LA REALTA’ E’ DIVERSA

NELLE RIUNIONI SI RIDISCUTE SEMPRE TUTTO, OGNI SETTORE CERCA DI

CONVINCE GLI ALTRI DELLA PROPRIA IDEA

TESTA, TESTA, TESTA

FAI TESTARE TUTTO DA PERSONE ESTERNECREA UN DOCUMENTO DA DISTRIBUIRE AI VARI TESTER. NON SCEGLIERE AMICI

O CONOSCENTI

COSA FARE - ALCUNI CONSIGLI

RIDUCI AL MINIMO I PASSAGGI DA FAR FARE ALL’ UTENTE

COSA FARE - ALCUNI CONSIGLI

REGOLA 80/20! (SE E’ UN’ APP)80% PERSONE USA IL 20% DELLE FUNZIONI!

FAI FOCUS ED ELIMINA O DAI MENO SPAZIO ALLE COSE MENO UTILIZZATE PER AUMENTARE

L’USABILITA’

COSA FARE - ALCUNI CONSIGLI

LESS IS MORE

COSA FARE - ALCUNI CONSIGLI

RIDUCI AL MINIMO IL RUMORECOSI DIMINUISCI IL TASSO DI

ABBANDONO!

COSA FARE - ALCUNI CONSIGLI

EVITA DI NASCONDERE LE INFO CHE INTERESSANO L’UTENTE

COSA FARE - ALCUNI CONSIGLI

IN FASE DI REGISTRAZIONE, CHIEDI SOLO LE INFO

NECESSARIE

COSA FARE - ALCUNI CONSIGLI

TESTARE, TESTARE, TESTARE, TESTARE!DIALOGA CON IL TUO GRUPPO DI TEST E

OTTIMIZZA SEGUENDO I LORO CONSIGLI!!

COSA FARE - ALCUNI CONSIGLI

CREA UNA SEZIONE FAQ PER IL SITO O DELLE SCHERMATE DI TOUR PER CHI SCARICA L’APP LA

PRIMA VOLTA

DIAMO LA DEFINIZIONE

L' UI è tutto ciò che rende possibile l’ interazione tra l’ utente e la

macchina / applicativo web o mobile

PREMESSA

NON ILLUSTRERÒ SINGOLARMENTE OGNI COMPONENTE COME

DOVREBBE ESSERE DISEGNATO.

IL PROCESSO

QUESTO PROCESSO AVVIENE SU

OGNI OGGETTO CHE CI CIRCONDA.

DESIGNER UI UTENTE

IL PROCESSO

ESEMPIO1

IL PROCESSO

ESEMPIO2

OK, CHE PASSI FARE QUINDI?

IDEA

STUDIO TARGETMERCATO

SCELTA STRADAMOBILE/WEB

WIREFRAME

PROTOTIPO

TESTING

OTTIMIZZAZIONE UI/UX

STUDIATE IL VOSTRO TARGET

E’ FONDAMENTALE CONOSCERE I NOSTRI FUTURI UTENTI/CLIENTI

STUDIATE IL VOSTRO TARGET

STUDIA LA GIUSTA STRATEGIA DI INTERAZIONE! CHE SIA UN SITO WEB O APP!

STUDIATE IL VOSTRO TARGET

MAGGIORE SARA’ IL TEMPO CHE DEDICHERETE A QUESTA FASE,

MINORE SARA’ IL TEMPO CHE PERDERETE A CAPIRE COSA VA O NON VA

DEL VOSTRO PROGETTO.

SI DICE CHE...

UI COOL NON SIGNIFICA SUCCESSO

CUCITE UN VESTITO PERFETTO

IN BASE ALLE ESIGENZE, CREATE UNA UI CHE SIA ADATTA PER IL WEB/MOBILE (O ENTRAMBE)

CUCITE UN VESTITO PERFETTO

RAGIONATE ANCHE IN BASE AL CONTESTO DI UTILIZZO!

CUCITE UN VESTITO PERFETTO

L’ INTERFACCIA DI UN'APP MOBILE NON SEGUE GLI STESSI PATTERN DI UN’ INTERFACCIA WEB!

WIREFRAME

REALIZZATE I WIREFRAME DELLA STRUTTURA FACENDO ATTENZIONE IN QUESTA FASE AGLI

SPAZI TRA GLI ELEMENTI, CERCATE DI REALIZZARE IN GRANDI LINEE LA UI CHE

IMMAGINATE FUNZIONI

PROTOTIPO

SIETE QUASI ALLA FINE...

TESTA, TESTA, TESTA

FAI TESTARE TUTTO DA PERSONE ESTERNECREA UN DOCUMENTO DA DISTRIBUIRE AI VARI TESTER. NON SCEGLIERE AMICI

O CONOSCENTI

OTTIMIZZA UI/UX

DARE DELLE DATE E’ GIUSTO, MA NON FARTI PRENDERE DALLA FRETTA, QUESTA FASE E’

IMPORTANTISSIMA

COSA FARE - ALCUNI CONSIGLI

USA ICONE CON SIMBOLI “CONVENZIONATI”RIDUCE DUBBI NELL’ UTENTE

COSA FARE - ALCUNI CONSIGLI

FATTI AIUTARE ANCHE DAI COLORI PER INDICARE I VARI “STATI D’ANIMO”

COSA FARE - ALCUNI CONSIGLI

FONT CHIARO

COSA FARE - ALCUNI CONSIGLI

FAI “RESPIRARE” IL LAYOUT CON PAUSE TRA I VARI ELEMENTI

COSA FARE - ALCUNI CONSIGLI

MAI FAR VENIRE DUBBI ALL’ UTENTE.UN PULSANTE DEVE AVERE LA FORMA DI UN

PULSANTE.

COSA FARE - ALCUNI CONSIGLI

PROVATE SEMPRE DURANTE LA COSTRUZIONE, QUESTO ABBATTE I COSTI EVENTUALI DI

RESTYLING

COSA FARE - ALCUNI CONSIGLI

L’UI DEVE AVERE UNA BUONA CURVA DI APPRENDIMENTO, L’UTENTE NON DEVE

RITENERLA COMPLESSA

COSA FARE - ALCUNI CONSIGLI

DEVE ESSERE EFFICIENTE: DEVE POTER ESEGUIRE L’OPERAZIONE CON IL MINOR NUMERO

POSSIBILE DI PASSAGGI

COSA FARE - ALCUNI CONSIGLI

PIU’ E’ FACILE DA USARE > SARANNO LE POSSIBILITÀ CHE VENGA RIUTILIZZATA

COSA FARE - ALCUNI CONSIGLI

RENDI VISIBILI LE INFO PIU’ IMPORTANTI

COSA FARE - ALCUNI CONSIGLI

IMPORTANTE E’ DARE IL FEEDBACK VISIVO

COSA FARE - ALCUNI CONSIGLI

SII ORIGINALE, MA SENZA PERDERE DI VISTA LE “CONVENZIONI”

CONCLUSIONI

PAIN CLAIM GAIN BINGO

CONCLUSIONI

FATTO QUESTO, COSTRUISCI IL TUO PROGETTO TENDENDO PRESENTE TUTTE QUESTE COSE CHE

CI SIAMO DETTI.

GRAZIE

FACEBOOK.COM/RICCIOMICHELE

TWITTER.COM/MICHELERICCIO

IT.LINKEDIN.COM/IN/MICHELE-RICCIO