1/35 Giacomo Mason - Aprile 2008 Intranet design Principi di base di Intranet Design.

1/35 Giacomo Mason - Aprile 2008

Intranet design

Principi di base di

Intranet Design


Intranet design

- Tipi di Strutture -

E’ la più usata

Sito Blog Portale


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


Intranet design

ContenutiNavigazione

Navigazione

Motore

- Il rapporto contenuti/navigazione -

TaglineLogo

80%20%


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


Intranet design

Progettare lo spazio web

- Sezione a destra -


Accesso rapido a servizi chiave

Quick links a parti profonde

Instant polI

Instant content (Meteo, Borsa)

Elementi di communty

Accesso agli applicativi aziendali


Intranet design


- Sezione a Sinistra -


Menù principale

Menù contestuali

Link rapidi

Finestre su servizi chiave


Intranet design


- Footer -


Richieste di feed-back

Data delle pagine

Accesso pagina redazione

Quanti sono connessi in questo momento

Referenti delle pagine


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


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


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.


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


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


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


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


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


Intranet design

- Architettura per task/servizi -

SI usa per intranet che hanno molti servizi per l’utente e per intranet che presentano aspetti operativi


Intranet design

Navigazione per aree

tematiche e dipartimenti

H.R

Organizzazione

Formazione

ecc

Navigazione per servizi o appartenenza

My page

Mio dipartimento

Miei gruppi

Servizi principali

- Architetture ibride -


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)


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à


Intranet design

Home page


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 -


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


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 -


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”?-


Intranet design

- Home page “solo servizi” -


Intranet design

- Home page solo news -


Intranet design

Notizie Documenti

My page

Discussioni

Applicativi

Logo

Servizi

Notizie e documenti

Logo

- Non solo notizie e documenti -

Aree profilate


Intranet design

NotizieServizi

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


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


Intranet design

Spazio per i comportamenti emergenti

- Comportamenti emergenti -


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


Intranet design

- Standard per le pagine sottostanti -

Identità

Sottosezioni

Referenti

Documenti

Evidenza

Links

News


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



Box “Elenco categorie”Casa scuola famiglia personale trasferimenti corsi

Casa scuola famiglia personale trasferimenti corsi


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

1/35 Giacomo Mason - Aprile 2008 Intranet design Principi di base di Intranet Design.

Documents

Transcript of 1/35 Giacomo Mason - Aprile 2008 Intranet design Principi di base di Intranet Design.