progettare esperienze per emozionare. la transizione dalla ux alla ui

2

Roberto Falcone, aka “Bob”,

è uno User Experience Designer

con un background ibrido

allʼincrocio tra tecnologia,

design, psicologia e business.

Negli anni ho lavorato per diverse agenzie creative e studi di design, dove ho seguito progetti strategici di design per startup e clienti internazionali di alto profilo. Attualmente lavoro in Musement, start-up che ha l’ambizione di rivoluzionare il settore travel, dove seguo e coordino tutte le fasi del processo di User Experience Design.

robertofalcone

// Ex designer di Sketchin

// Collaboratore @ PoliDesign

// Insegnante @ TAG Innovation School

// Membro della giuria @ CSS Design Awards

// Fondatore di UXers

LA TRANSIZIONE DALLA UX ALLA UIE X P L O R E T A L K S

3E X P L O R E T A L K S LA TRANSIZIONE DALLA UX ALLA UI

Significativo

Piacevole

Conveniente

Usabile

Disponibile

Funzionale



Lo UI design consiste quindi nel livello di comunicazione visiva composto da: declinazione del logo, palette colori, tipografia, icone, illustrazioni, contributi video, animazioni, immagini sottoposte a trattamento fotografico.

Lo UI design (acronimo di User Interface design) è una parte del processo di UX design che si occupa prettamente degli aspetti legati presentazione visuale di un prodotto digitale.

6

Comunicare correttamente i valori dell’identità aziendale

NARRAZIONE

Guidare l’utente all’interno dell’interfaccia evidenziando

contenuti ed elementi interattivi

FUNZIONE

UI DESIGN

E X P L O R E T A L K S LA TRANSIZIONE DALLA UX ALLA UI

Rispettare i limiti e e opportunità tecnologicheINTEROPERABILITÀ

8

In che modo è possibile trasmettere i valori e

l’identità di un brand all’interno di una UI?

TOPIC #1



È un modello di rappresentazione dell’identità di un brand, che parte dal presupposto che un prodotto o servizio deve rappresentare le idee esclusive e i valori dell’identità del brand stesso.

È rappresentato come un prisma a sei facce, ognuna della quale descrive una sfaccettatura diversa che il brand intende trasmettere e di cui una UI deve farsi ambasciatrice.

PRISMA DI KAPFERER brand

1 0E X P L O R E T A L K S LA TRANSIZIONE DALLA UX ALLA UI

1 6

Quali sono le strategie da adottare per

ottenere sempre coerenza e consistenza

di una UI su tutti i dispositivi di fruizione?

TOPIC #2


1 7LA TRANSIZIONE DALLA UX ALLA UI

DESIGN SYSTEM

E X P L O R E T A L K S


DE-VICES

FRAG- ME-NTATION

LA TRANSIZIONE DALLA UX ALLA UI 1 8


COLORI GRIGLIE TIPOGRAFIA UI COMPONENTS

UI TOOLKIT

2 2

Stephen Hay

We are no longer designing pages, we are now

designing complex systems of components.


Principal UX Design Lead @catawiki


ATOMIC DESIGN


ATOMIGli atomi sono le unità mimime che costituiscono i blocchi di materia.

Nel caso delle User Interface sono ad esempio i tag, le label, gli input o un bottone.


MOLECOLELe molecole sono gruppi di atomi e sono la più piccola unità fondamentale di un insieme di elementi.

Le molecole posseggono delle loro peculiari proprietà e sono le unità base del design system.


ORGANISMIGli organismi possono consistere in uno o più tipi diversi di molecole.

La transizione da molecole a organismi organizza la creazione di componenti portabili, ricusabili e autonomi.


ECOSISTEMIGli ecosistemi (o template) consistono di gruppi di organismi che lavorano assieme per dare vita ai diversi layout di pagina.


AMBIENTIGli ambienti (o pagine) sono specifiche istanze degli ecosistemi e formano il livello più alto di astrazione delle interfacce.

Lonely Planet

E X P L O R E T A L K S LA TRANSIZIONE DALLA UX ALLA UI 3 1

3 2LA TRANSIZIONE DALLA UX ALLA UI

CASESTUDIES



GOOGLE MATERIALDESIGN LANGUAGE

Il material design un linguaggio visuale con cui Google assicura coerenza e riconoscibilità visivi ad ogni prodotto digitale che compone la sua galassia.


GOOGLE MATERIALDESIGN UI TOOLKIT


SPOTIFY GLUE

La frammentazione delle interfacce che Spotify ha dovuto fronteggiare ad un certo punto della sua vertiginosa crescita, è stata evitata grazie alla progettazione di un design language chiamato GLUE (Global Language for a Unified Experience).


SPOTIFY GLUE PRINCIPLES

GLUE oggi documenta stili, componenti e pattern

ed è accessibile ad ognuno all’interno dell’azienda.

Il processo di redesign di Spotify attraverso GLUE è iniziato attraverso la definizione di alcuni principi guida che hanno allineato le diverse influenze di design all’interno del team e si sono fatti portatori delle diverse vision dei team aziendali.

3 8

Il nuovo progetto di riprogettazione dell’identità visiva di AirBnb è uno degli esempi più significativi degli ultimi anni di costruzione di un design language efficace, riconoscibile e scalabile.

I valori del brand sono ottimamente rappresentati su tutti gli artefatti digitali e non.

NEW AIRBNB BRANDING

E X P L O R E T A L K S LA TRANSIZIONE DALLA UX ALLA UI

4 2

G R A Z I E

LA TRANSIZIONE DALLA UX ALLA UI

robertofalcone

[email protected]
