Date post: | 01-Sep-2014 |
Category: |
Documents |
Upload: | giacomo-mason |
View: | 8,107 times |
Download: | 1 times |
1/35 Giacomo Mason - Aprile 2008
Intranet design
Principi di base diIntranet Design
2/35 Giacomo Mason - Aprile 2008
Intranet design
- Tipi di Strutture -
E’ la più usata
Sito Blog Portale
3/35 Giacomo Mason - Aprile 2008
Intranet design
- Alcuni principi di progettazione in intranet -
Rapporto contenuti/navigazione = 80% - 20%
Uso dei template
Header rigoroso e funzionale
Menù principale ripetuto in tutte le pagine
Briciole di pane per la navigazione in profondità
Se, possibile, pochi livelli di profondità
Grafica essenziale e uso di elementi ricorrenti
Architettura informativa rigorosa
Uso corretto della home
4/35 Giacomo Mason - Aprile 2008
Intranet design
ContenutiNavigazione
Navigazione
Motore
- Il rapporto contenuti/navigazione -
TaglineLogo
80%20%
5/35 Giacomo Mason - Aprile 2008
Intranet design
- Header -
In genere può contenere
Logo
Tagline
Motore di ricerca
Menù servizi personali (Il mio profilo, la mia posta, i miei messaggi…)
Menù principale o servizi importanti
Casella cercapersone
6/35 Giacomo Mason - Aprile 2008
Intranet design
Progettare lo spazio web
- Sezione a destra -
In genere può contenere
Accesso rapido a servizi chiave
Quick links a parti profonde
Instant polI
Instant content (Meteo, Borsa)
Elementi di communty
Accesso agli applicativi aziendali
7/35 Giacomo Mason - Aprile 2008
Intranet design
Progettare lo spazio web
- Sezione a Sinistra -
In genere può contenere
Menù principale
Menù contestuali
Link rapidi
Finestre su servizi chiave
8/35 Giacomo Mason - Aprile 2008
Intranet design
Progettare lo spazio web
- Footer -
In genere può contenere
Richieste di feed-back
Data delle pagine
Accesso pagina redazione
Quanti sono connessi in questo momento
Referenti delle pagine
9/35 Giacomo Mason - Aprile 2008
Intranet design
- Un buon esempio di footer -
Titolo pagina
Data ultima modifica pagina
Responsabile dei contenuti della pagina
Riferimenti per questioni sul contenuto
Riferimento per questioni tecniche
10/35 Giacomo Mason - Aprile 2008
Intranet design
- Errori di progettazione intranet -
Header tropo alto Piazzare loghi, claim e tagline in modo troppo evidente e invadente
Killer utility nascoste Tenere nascoste le utility principali, in nome dell’eleganza
Architettura a “organigramma” Rispecchiare meccanicamente l’organigramma aziendale
Poche informazioni Non sfruttare le home page in maniera ricca
Troppe informazioni Eccedere nel numero di informazioni presenti
No filtri Non usare spazi “vetrina” per evidenziare contenuti
11/35 Giacomo Mason - Aprile 2008
Intranet design
- Raggruppare i contenuti -
Una volta definiti i contenuti occorre raggrupparli ed ordinarli, in modo da ottenere l’architettura informativa e i menù di navigazione.
Questa operazione deve rispecchiare il più possibile le abitudini, le priorità e la mappa mentale delle persone che useranno la intranet.
12/35 Giacomo Mason - Aprile 2008
Intranet design
- Il card sorting -
Si mostrano a gruppi di persone dei post it che elencano i diversi contenuti della intranet e si chiede loro
• Di raggrupparli in modo omogeneo
• Di dare un nome ai ragguppamenti
• Di definire quali sono per loro i conenuti prioritari
In un lasso di tempo definito (30-40 minuti)
Questi raggruppamenti e i loro nomi diventano la bozza di architettura informativa della intranet
Sito
13/35 Giacomo Mason - Aprile 2008
Intranet design
- Definizione dell’architettura -
Grazie al lavoro di card sorting e alla mappa dei contenuti è possibile definire l’architettura informativa, ovvero
I diversi menù di navigazione
I sottomenù
I label delle diverse vocì
Questa architettura diventa l’infrastruttura informativa di tutte le pagine della intranet
14/35 Giacomo Mason - Aprile 2008
Intranet design
- Tre tipi di architettura -
Per categorie Modello con contenuti informativi divisi per aree omogenee (es. per dipartimenti, per tipi di informazioni, per aree di attività)
Per appartenenza Modello con contenuti per tipo di utente (es. Contenuti generali, Contenuti del mio dipartimento, contenuti personali, contenuti dei miei sottogruppi)
Per servizi/task Contenuti divisi per tipo di task e di servizi a cui l’utente deve accedere (es. Notizie, formazione, rapporto di lavoro, Community, Area blog, area wiki ecc.)
Spesso sono compresenti nella stessa intranet
Categorie + appartenenza
Categorie + task
Appartenenza + task
ecc
N.b. L’architettura non è la navigazione
15/35 Giacomo Mason - Aprile 2008
Intranet design
- Architettura per categorie/sezioni -
Ottima sotto il profilo della scalabilità, abbastanza semplice da realizzare
Molto usata per intranet con tante notizie, inserite in appositi “canali”
Si usa spesso per la parte istituzionale e per le parti non profilate della intranet
16/35 Giacomo Mason - Aprile 2008
Intranet design
- Architettura per appartenenze -
Richiede una intranet profilata sull’utente
Molto usata per intranet con publishing decentrato
In genere si usa per intranet molto grandi, nelle quali esistono sottosezioni di dipartimento
17/35 Giacomo Mason - Aprile 2008
Intranet design
- Architettura per task/servizi -
SI usa per intranet che hanno molti servizi per l’utente e per intranet che presentano aspetti operativi
18/35 Giacomo Mason - Aprile 2008
Intranet design
Navigazione per aree
tematiche e dipartimenti
H.R
Organizzazione
Formazione
ecc
Navigazione per servizi o appartenenzaMy page
Mio dipartimento
Miei gruppi
Servizi principali
- Architetture ibride -
19/35 Giacomo Mason - Aprile 2008
Intranet design
- Tipi di navigazione -
Navigazione principale E’ la navigazione presente in tutte le pagine secondo un modello standard
Navigazione istituzionale La navigazione delle info istituzionali della intranet (L’azienda, help, La redazione, mappa del sito ecc)
Navigazione personale La navigazione di alcuni task di servizio e servizi personali, presente in genere verso destra o in alto (es. my profile, posta elettronica, my page, ecc)
20/35 Giacomo Mason - Aprile 2008
Intranet design
- Tipi di navigazione principale -
Tutta a sinistra
In genere le voci sono già “esplose”
Comoda per aggiungere facilmente sezioni
Rischi: “overflow informativo”
Tutta in alto
Poche voci che vengono esplose in un sottomenù
orizzontale
Più elegante
Rischi: colli di bottiglia e difficoltà a trovare le info al
primo clic
In alto e contestuale a sinistra
Oppure servizi + task
Molto usata
Il menù di sinistra varia al variare delle voci in alto
Buon bilanciamento tra eleganza e scalabilità
21/35 Giacomo Mason - Aprile 2008
Intranet design
Home page
22/35 Giacomo Mason - Aprile 2008
Intranet design
Barra orizzontale: 100 pixels. Tipicamente usata per il logo, navigazione globale e ricarca.
Colonna di sinistra: 200-250 pixels. Tipicamente usata per la navigazione globale con dettagli e/o per la navigazione locale.
Area centrale: Bianca, 400-600 pixels. Tipicamente una o due colonne con foto, notizie in evidenza, task prioritari e applicazioni
Colonna di destra: bianca, 200-250 pixels. Tipicamente usate per box di servizi e fotografie
- Home page intranet per Nielsen -
23/35 Giacomo Mason - Aprile 2008
Intranet design
- La home page: caratteristiche fondamentali -
NOSILa Home page ha come funzione:
• Risparmiare all’utente dei clic
• informare sulle novità e aggiornamenti
• creare una vetrina e fornire scorciatoie per alcune
parti del sito
•dare risalto agli strumenti di navigazione e di ricerca e alle utility
• favorire l’accesso alle killer utility
• Guidare l’utente verso particolari contenuti (aspetto “push”)
La Home page non ha come funzione:
• fare da “coperta” grafica a contenuti disomogenei
• dare un senso di mera “eleganza”
• stupire l’utente con efffetti grafici
• Esprimere un qualche senso di mera “appartenenza”
• Fare da “tappo di bottiglia” ai contenuti
24/35 Giacomo Mason - Aprile 2008
Intranet design
Presenta in evidenza la navigazione principale
Convivono news, servizi e documentazione
Dà accesso alle risorse più recenti
Dà accesso alle risorse informative più rilevanti
Dà scorciatoie per parti profonde del sito
Dà accesso ai comportamenti emergenti
Dà immediato accesso alle “killer utility”
Dà immediato accesso al motore di ricerca
- Caratteristiche della home -
25/35 Giacomo Mason - Aprile 2008
Intranet design
Una killer utility è quell’applicazione (servizio, notizia, prodotto) che giustifica l’accesso alla intranet stessa
Qual’è la Killer utility della vostra Intranet?
- Che cos’è una “killer utility”?-
26/35 Giacomo Mason - Aprile 2008
Intranet design
- Home page “solo servizi” -
27/35 Giacomo Mason - Aprile 2008
Intranet design
- Home page solo news -
28/35 Giacomo Mason - Aprile 2008
Intranet design
Notizie Documenti
My page
Discussioni
Applicativi
Logo
Servizi
Notizie e documenti
Logo
- Non solo notizie e documenti -
Aree profilate
29/35 Giacomo Mason - Aprile 2008
Intranet design
Notizie Servizi
Documentazione
Discussioni
Applicativi
Navigazione
principale
TaglineLogoServizi importanti nell’header (in tutte le pagine)
Motore
“Killerutility”
- Una possibile divisione logica della home -
Notizie
Utility
Documenti
Navigazione
Applicazioni
Servizi
Community
30/35 Giacomo Mason - Aprile 2008
Intranet design
- Comportamenti emergenti -
Le pagine più viste
Le notizie più cliccate
La documentazione più scaricata
Gli ultimi interventi nel forum
Le ultime segnalazioni dagli utenti
…
I comportamenti dei singoli determinano il posizionamento dei contenuti
31/35 Giacomo Mason - Aprile 2008
Intranet design
Spazio per i comportamenti emergenti
- Comportamenti emergenti -
32/35 Giacomo Mason - Aprile 2008
Intranet design
- Alcuni errori da evitare sulle pagine interne -
Dare uno standard poco rigoroso e riconoscibile alle pagine
Creare pagine fatte solo di elenchi senza una gerarchia precisa
Utilizzare template troppo rigidi
Non dare spazio alle risorse più importanti
33/35 Giacomo Mason - Aprile 2008
Intranet design
- Standard per le pagine sottostanti -
Identità
Sottosezioni
Referenti
Documenti
Evidenza
Links
News
34/35 Giacomo Mason - Aprile 2008
Intranet design
- Il modello “Lego” -
Box “primo piano”Box “Risorse”
Box “Elenco notizie” Box “Vetrina”
Box “Documenti” (Anche per gli ultimi, i più richiesti, i più importanti..)
Box feed back e invio materiali dagli utenti Box “quick link”
Box “Galleria foto”
Box “Segnalazioni dei lettori”
Sottosezione 1Descrizione della sottosezione
Sottosezione 2Descrizione della sottosezione
Sottosezione 3Descrizione della sottosezione
Box “Elenco categorie”Casa scuola famiglia personale trasferimenti corsi
Casa scuola famiglia personale trasferimenti corsi
35/35 Giacomo Mason - Aprile 2008
Intranet design
I Vantaggi dei “Lego” per i template
Permette di creare infinite variazioni mantenendo una coerenza interna
Permette con facilità di venire incontro ad esigenze spot di qualunque tipo
Permette la gestione ottimale di sezioni gestite dalla redazione distribuita