IL RESPONSIVE WEB DESIGN NON SOLO UNA QUESTIONE DI LAYOUT:
IL WEB PER UN'ORGANIZZAZIONE COMPLESSA COME L'UNIVERSIT DI
SIENA
IGOR BERSANETTI@bigol76
Perch cambiare ?
Il web come l'abbiamo conosciuto
Perch cambiare ?
Il web com' oggi!
The web's moved beyond the desktop, and it's not looking back. The number of devices we're designing for is growing just as quickly as mobile traffic.Ethan Marcott
Perch cambiare ?
Un mondo nuovo di dispositivi...
Perch cambiare ?
...e di situazioni ...
Soluzioni?
Mobile Applications ?
Mobile Website ?
Responsive Web Design ?
Mobile Apps
Migliore user experience possibile sul device indirizzato
Costi elevati di sviluppo e soprattutto manutenzione
Soddisfa solo una piccola parte dell'utenza
Approccio non future friendly
Mobile Apps
Creeresti una App per ognuno di questi ?
Mobile Website
Interfaccia pensata e ottimizzata per display pi piccoli
Contenuti riveduti e ottimizzati per schermi piccoli
Sito semplice, rapido da consultare
Costi di sviluppo extra
Veicola solo una parte dei contenuti disponibili
Richiede un doppio lavoro di redazione
User Agent
Mobile Website
Decifrare la user agent cos semplice ?
Android Webkit Browser - Mozilla/5.0 (Linux; U; Android 2.3.5; zh-cn; HTC_IncredibleS_S710e Build/GRJ90) AppleWebKit/533.1 (KHTML, like Gecko) Version/4.0 Mobile Safari/533.1- Mozilla/5.0 (Linux; U; Android 2.3.5; en-us; HTC Vision Build/GRI40) AppleWebKit/533.1 (KHTML, like Gecko) Version/4.0 Mobile Safari/533.1
IE Mobile
- Mozilla/5.0 (compatible; MSIE 9.0; Windows Phone OS 7.5; Trident/5.0; IEMobile/9.0)
- HTC_Touch_3G Mozilla/4.0 (compatible; MSIE 6.0; Windows CE; IEMobile 7.11)
- Mozilla/4.0 (compatible; MSIE 7.0; Windows Phone OS 7.0; Trident/3.1; IEMobile/7.0; Nokia;N70)
Responsive Web Design
Abbatte i costi complessivi del progetto:
- 1 solo progetto
- 1 sola redazione
La user experience sempre coerente
Il contenuto di un sito responsive lo stesso per tutti; anche questa una forma di equit sociale
future friendly
Il progetto di design aumenta in complessit
Servono competenze mirate in tutte le fasi del progetto.
Responsive Web Design
Ancora dubbi
??http://mobile.smashingmagazine.com/2012/08/22/separate-mobile-responsive-website-presidential-smackdown/
Ho scelto... e adesso ?
Quali sono i passi necessari per realizzare un progetto sostenibile ?
Un progetto sostenibile
Sviluppare il progetto con la governance dell'organizzazione e gestire positivamente le naturali resistenze interne
Definire gli obiettivi della comunicazione
Scegliere una piattaforma tecnologica adeguata
Adottare le corrette metodologie di analisi e sviluppo
I protagonisti?
Universit di Siena
www.unisi.it
la Governance d'Ateneo
il Personale d'Ateneo
Il Servizio portale
L'Utente finale
Gli obiettivi
Trasmettere
il brand di AteneoUn portale
orientato allo studente
e all'internazionalizzazioneDiffondere
l'identit digitale
e le soluzioni
tecnologiche
su tutti i
siti satellitiMantenere bassi
i costiIntegrare i
gestionali
Gli obiettivi
Raggiungere il
maggior numero
di utenti possibileLavorare con un strumento
veloce e flessibileParlare con
efficacia
a tutte
le categorie
di utentiValorizzare e
promuovere
con efficacia le
eccellenze d'Ateneo
Gli obiettivi
Lavorare con interfacce
semplici e intuitiveInserire le informazioni
una sola voltaMigliorare i
processi interni
Gli obiettivi
Raggiungere
velocemente
le informazioni
che mi servonoRimanere aggiornata
sulle opportunit per
lo studio e per il lavoroTrovare
informazioni
comprensibili!Conoscere
l'Universit e
la citt di Siena
Progettazione partecipata
User researchSono stati raccolti i punti di vista di tutti i key users
Progettazione partecipata
Scelte condivisela Governance d'Ateneo valida ogni singolo aspetto
Progettazione partecipata
Knowledge TransferCondividere la conoscenza aiuta la sostenibilit del progetto
Yes! We Drupal
Costi contenuti
Drupal
Flessibilit
Integrabile
Modulare
Robusto
Configurabile
Drupal
SemplicitDopo un'oretta di corso tutte le resistenze verso lo
strumento scompaiono
Giacomo
Il backend snello e intuitivo. Personale molto eterogeneo lo usa
in egual modo
Giacomo
Drupal
Supporto al responsive design
Approcci e Metodologie UX
Architettura dell'informazioneFacilitare l'accesso alle
informazioni:
meno livelli e pi sezioni tematiche
Approcci e Metodologie UX
Sapere esattamente cosa vuoi comunicare...
e cosa l'utente si aspetta di trovare!
Content StrategyCosa far
da grande ?
Approcci e Metodologie UX
Mantenere il tuo messaggio intatto a prescindere dalla dimensione dello schermo
Content Strategy
Approcci e Metodologie UX
Continuos
User Experience
Il risultato?
Smart TV Samsung nel salotto di Roberto
Ipad 3 di Luca, utilizzato anche a Machu Picchu
Samsung S2 di Elena,
pi volte scampato per miracolo alla pentola del sugoHTC Magic di
Roberto, il suo preferito
Sony Ericsson
P1i (a.d.2007)
di Giacomo
Blackberry9360 di Marco, 41 anni, Ingegnere Elettronico. Pensa di acquistare anche un Playbook...
Nokia N97 di Fabio, uno dei tanti della sua collezione
Samsung Nexus 7 di Marcopolo Expert
Casalecchio di Reno(BO)
NintendoDS di Vera, 10 anni e nativamente mobile. Interrotta durante una sessione di Animal Crossing
Fon Fon Tan Crin di Giuseppe, 49 anni, romagnolo
Domande ?
Suggerimenti per la lettura:http://www.lukew.com/
http://www.alistapart.com/articles/responsive-web-design
http://bradfrostweb.com/blog/web/mobile-first-responsive-web-design/
http://www.alistapart.com/articles/your-content-now-mobile/
DICE GRAZIE A SPONSOR
MEDIA PARTNER
IN COLLABORAZIONE CON
FIRMATO: GLI ORGANIZZATORI ;)