際際滷

際際滷Share a Scribd company logo
Elena Bignami Vincenzo Calabr嘆 Andrea Marassi
WebMonsters
1MSTC Teorie e Linguaggi della Comunicazione Digitale e del Web Marketing
1
La storia di Angelo Poretti
Il Birri鍖cio Angelo Poretti 竪 un birri鍖cio italiano.
In seguito a varie acquisizioni il nome 竪 diventato un marchio appartenente a
Carlsberg Italia S.p.a., societ facente parte del gruppo Carlsberg.
Spazio del contenuto e spazio del paratesto
2
Lo spazio del contenuto
Cosa mi vuole far vedere il sito web?
IMMAGINI TESTI VERBALI
3
Lo spazio del contenuto
4
WebMonsters X Angelo Poretti 4
Lo spazio del paratesto
Dove sono, da dove vengo e dove vado?
STRUMENTI DI NAVIGAZIONE
5
Lo spazio del paratesto
Dove sono, da dove vengo e dove vado?
STRUMENTI DI NAVIGAZIONE
Lo spazio del paratesto Home Page
- Il logo perch辿 risponde alla domanda dove sono?
- La barra principale di navigazione
- La barra di navigazione secondaria
- I collegamenti ai social (facebook, twitter, instagram)
- Le briciole di pane
- Le immagini Visita il Birri鍖cio e Momenti da Expo
- Storia di Angelo Poretti
- Expo 2015
- Fascia Le nostre birre
- Fascia In cucina con Alma
- Fascia Approfondimenti con immagini cliccabili
- Barra Footer con link utili, collegamento social, Expo
6
Saperi e Generi
7
Quali sono i saperi che il sito pone come condizione necessaria per
essere utilizzato?
Saperi
8
Saperi Lingue necessarie:
italiano o inglese
Familiarit
con i social
Conoscenza del funzionamento
del logo della homepage
Conoscenza delle concezioni minime delle interfacce web
Doppia barra di navigazione e footer
9
Il sito www.birri鍖cioangeloporetti.it 竪 un sito vetrina che pubblicizza i propri
prodotti e pubblica materiale informativo.
Si appoggia al sito e-commerce esterno www.vogliadibirra.it per la vendita dei
prodotti via internet.
Generi
10
Alberatura sito
HEADER
- Visita il birrificio
- e-Shop
- Collegamenti Social Network
- Lingua
- Italiano
- Inglese
- Export
HEADER
- ID/ Nome del sito
- La storia
-Il birrificio
- Luppolopedia
- Birre
- Le ricette
- Media
BODY
- 際際滷r fissi
- Immagini navigabili
- Testo
- Collegamenti
- Pulsanti
FOOTER
- Birrificio Angelo Poretti
- Birre
- Link Utili
- e-shop
- cookie
- www.beviresponsabile.it
- Expo 2015
- Icone social
- Copyright
Generi Analisi di Benchmarking
11
Il sito www.peroni.it 竪 un sito vetrina che pubblicizza i propri prodotti e pubblica
materiale informativo.
Alberatura sito
HEADER
- Visita il birrificio
- e-Shop
- Collegamenti Social Network
- Lingua
- Italiano
- Inglese
- Export
HEADER
- ID/ Nome del sito
- La storia
-Il birrificio
- Luppolopedia
- Birre
- Le ricette
- Media
BODY
- 際際滷r fissi
- Immagini navigabili
- Testo
- Collegamenti
- Pulsanti
FOOTER
- Birrificio Angelo Poretti
- Birre
- Link Utili
- e-shop
- cookie
- www.beviresponsabile.it
- Expo 2015
- Icone social
- Copyright
Generi
12
Il sito www.birramoretti.it 竪 un sito vetrina che pubblicizza i propri prodotti
e pubblica materiale informativo.
Analisi di Benchmarking
13
Lettore-utente modello
14
Per chi 竪 stato progettato il sito web?
1. CARATTERISTICHE
ANAGRAFICHE
2. COMPETENZE
INFORMATICHE
Lettore-utente modello
15
Lettore-utente modello 1. Caratteristiche anagra鍖che
http://www.exactitudes.com
Sesso: Uomo
Et: 27 anni
Interessi: musica, moto e moda
Sesso: Uomo
Et: 35 anni
Interessi: arte, cibo e cinema
16
Lettore-utente modello 2. Competenze informatiche
Conoscenza delle concezioni minime delle interfacce web
Utilizzo abitudinario di smartphone
Utilizzo del web anche per effettuare acquisti online
17
Azioni e desideri
18
Azioni e desideri
Quali azioni mette a disposizione il sito?
19
Azioni e desideri
ACQUISTARE INFORMARSI INTERAGIRE
20
Azioni e desideri Acquistare
21
Azioni e desideri Informarsi
22
InteragireAzioni e desideri
Il sito propone un viaggio virtuale completo all interno del mondo Poretti.
Il lettore pu嘆 seguire lo sviluppo del prodotto dalla sua nascita 鍖no all incontro
con il consumatore.
23
Analisi dello Spazio visivo
24
Angelo Poretti 竪 marchio industriale della birra, che negli ultimi anni ha deciso
di vestire i panni dellartigianale per raggiungere nuovi segmenti di mercato, con
una scelta che ha rivelato una curiosa passione per i luppoli.
cronachedibirra.it
Brand Image e linea comunicativa generale
25
Brand Image e linea comunicativa generale
La strategia di Poretti  appartenente al gruppo Carlsberg  竪 iniziata qualche anno fa, e fonda la sua
comunicazione su un numero variabile di luppoli da 3 a 10.
Lobiettivo 竪 quello di intercettare i desideri dei consumatori, che rispetto al passato sono diventati
pi湛 esigenti e diversi鍖cati.
26
Livello gra鍖co-visivo
I contenuti visivi del sito sono chiari e ben organizzati.
In alto a sinistra troviamo due paratesti:
Visita il birri鍖cio ed e-shop che rappresentano rispettivamente il chi e il che cosa andremo a
raccontare.
In alto a destra si trovano i loghi dei principali social, che rimandano alla comunicazione integrata
dellazienda, spiegando come e con quali mezzi lazienda comunica on-line.
27
Livello gra鍖co-visivo
Provando a invertire le tonalit, ad usare una scala di grigi o un semplice bianco e nero il sito risulta
sempre ben comprensibile, a favore dellaccessibilit da parte di utenti diversamente abili.
28
Livello gra鍖co-visivo
In seguito ad unanalisi di Design effective Visuals (FENG-GUI) abbiamo notato quali sono le aree che
attirano maggiormente lattenzione nei primi 3 secondi di utilizzo:
29
Analisi della coerenza e dellusabilit
30
Analisi della coerenza e dellusabilit
Sono rispettate le principali funzioni di un sito, ma manca una funzione di ricerca semplice e pratica
che possa aiutare il lettore nel ritrovare con immediatezza speci鍖ci contenuti.
Lintero sito 竪 progettato per fornire paratesti che rimandano ad articoli testuali pi湛 speci鍖ci, ma la
mappa del sito non 竪 presente e va implementata.
Nel complesso il sito risulta avere una struttura semplice ma abbastanza intuitiva.
31
Analisi della coerenza e dellusabilit
32
Analisi della coerenza e dellusabilit
33
Analisi della coerenza e dellusabilit
5. Non 竪 presente un area Search
34
Analisi della coerenza e dellusabilit
35
Analisi della coerenza e dellusabilit
7. Non sono presenti men湛 a tendina in quanto i contenuti non sono molti
8. Non ci sono contenuti promossi in homepage perch竪 il sito ha un e-commerce esterno
9. Al contrario, lhome-page 竪 molto pulita e non ci sono eccessi gra鍖ci
36
Analisi della coerenza e dellusabilit
37
Modi鍖che sito web
38
Modi鍖che sito web
Lo stato dei tasti cambia passandoci sopra con il mouse, indicando di conseguenza una possibile
interazione da effettuare.
Aggiungere Youtube nella barra di navigazione dei collegamenti social perch竪 竪 una piattaforma
web di video sharing da sfruttare e da non sottovalutare.
39
Una barra di ricerca utile agli utenti per orientarsi allinterno del sito e scrivere ci嘆 che desiderano
trovare in velocit.
Modi鍖che sito web
Le icone di Instagram e Youtube non possono mancare nella sezione dei collegamenti ai social, in
particolar modo su dispositivo mobile.
40
La mappa del sito allinterno della barra del Footer 竪 indispensabile e molto utile perci嘆 non pu嘆
non contenere le informazioni pi湛 importanti del sito web.
Modi鍖che sito web
Elena Bignami Vincenzo Calabr嘆 Andrea Marassi
WebMonsters
1MSTC Teorie e Linguaggi della Comunicazione Digitale e del Web Marketing

More Related Content

Analisi del sito web "www.birrificioangeloporetti.it"

  • 1. Elena Bignami Vincenzo Calabr嘆 Andrea Marassi WebMonsters 1MSTC Teorie e Linguaggi della Comunicazione Digitale e del Web Marketing
  • 2. 1 La storia di Angelo Poretti Il Birri鍖cio Angelo Poretti 竪 un birri鍖cio italiano. In seguito a varie acquisizioni il nome 竪 diventato un marchio appartenente a Carlsberg Italia S.p.a., societ facente parte del gruppo Carlsberg.
  • 3. Spazio del contenuto e spazio del paratesto 2
  • 4. Lo spazio del contenuto Cosa mi vuole far vedere il sito web? IMMAGINI TESTI VERBALI 3
  • 5. Lo spazio del contenuto 4
  • 6. WebMonsters X Angelo Poretti 4 Lo spazio del paratesto Dove sono, da dove vengo e dove vado? STRUMENTI DI NAVIGAZIONE 5 Lo spazio del paratesto Dove sono, da dove vengo e dove vado? STRUMENTI DI NAVIGAZIONE
  • 7. Lo spazio del paratesto Home Page - Il logo perch辿 risponde alla domanda dove sono? - La barra principale di navigazione - La barra di navigazione secondaria - I collegamenti ai social (facebook, twitter, instagram) - Le briciole di pane - Le immagini Visita il Birri鍖cio e Momenti da Expo - Storia di Angelo Poretti - Expo 2015 - Fascia Le nostre birre - Fascia In cucina con Alma - Fascia Approfondimenti con immagini cliccabili - Barra Footer con link utili, collegamento social, Expo 6
  • 9. Quali sono i saperi che il sito pone come condizione necessaria per essere utilizzato? Saperi 8
  • 10. Saperi Lingue necessarie: italiano o inglese Familiarit con i social Conoscenza del funzionamento del logo della homepage Conoscenza delle concezioni minime delle interfacce web Doppia barra di navigazione e footer 9
  • 11. Il sito www.birri鍖cioangeloporetti.it 竪 un sito vetrina che pubblicizza i propri prodotti e pubblica materiale informativo. Si appoggia al sito e-commerce esterno www.vogliadibirra.it per la vendita dei prodotti via internet. Generi 10
  • 12. Alberatura sito HEADER - Visita il birrificio - e-Shop - Collegamenti Social Network - Lingua - Italiano - Inglese - Export HEADER - ID/ Nome del sito - La storia -Il birrificio - Luppolopedia - Birre - Le ricette - Media BODY - 際際滷r fissi - Immagini navigabili - Testo - Collegamenti - Pulsanti FOOTER - Birrificio Angelo Poretti - Birre - Link Utili - e-shop - cookie - www.beviresponsabile.it - Expo 2015 - Icone social - Copyright Generi Analisi di Benchmarking 11 Il sito www.peroni.it 竪 un sito vetrina che pubblicizza i propri prodotti e pubblica materiale informativo.
  • 13. Alberatura sito HEADER - Visita il birrificio - e-Shop - Collegamenti Social Network - Lingua - Italiano - Inglese - Export HEADER - ID/ Nome del sito - La storia -Il birrificio - Luppolopedia - Birre - Le ricette - Media BODY - 際際滷r fissi - Immagini navigabili - Testo - Collegamenti - Pulsanti FOOTER - Birrificio Angelo Poretti - Birre - Link Utili - e-shop - cookie - www.beviresponsabile.it - Expo 2015 - Icone social - Copyright Generi 12 Il sito www.birramoretti.it 竪 un sito vetrina che pubblicizza i propri prodotti e pubblica materiale informativo. Analisi di Benchmarking
  • 15. 14 Per chi 竪 stato progettato il sito web? 1. CARATTERISTICHE ANAGRAFICHE 2. COMPETENZE INFORMATICHE Lettore-utente modello
  • 16. 15 Lettore-utente modello 1. Caratteristiche anagra鍖che http://www.exactitudes.com Sesso: Uomo Et: 27 anni Interessi: musica, moto e moda Sesso: Uomo Et: 35 anni Interessi: arte, cibo e cinema
  • 17. 16 Lettore-utente modello 2. Competenze informatiche Conoscenza delle concezioni minime delle interfacce web Utilizzo abitudinario di smartphone Utilizzo del web anche per effettuare acquisti online
  • 19. 18 Azioni e desideri Quali azioni mette a disposizione il sito?
  • 20. 19 Azioni e desideri ACQUISTARE INFORMARSI INTERAGIRE
  • 21. 20 Azioni e desideri Acquistare
  • 22. 21 Azioni e desideri Informarsi
  • 23. 22 InteragireAzioni e desideri Il sito propone un viaggio virtuale completo all interno del mondo Poretti. Il lettore pu嘆 seguire lo sviluppo del prodotto dalla sua nascita 鍖no all incontro con il consumatore.
  • 25. 24 Angelo Poretti 竪 marchio industriale della birra, che negli ultimi anni ha deciso di vestire i panni dellartigianale per raggiungere nuovi segmenti di mercato, con una scelta che ha rivelato una curiosa passione per i luppoli. cronachedibirra.it Brand Image e linea comunicativa generale
  • 26. 25 Brand Image e linea comunicativa generale La strategia di Poretti appartenente al gruppo Carlsberg 竪 iniziata qualche anno fa, e fonda la sua comunicazione su un numero variabile di luppoli da 3 a 10. Lobiettivo 竪 quello di intercettare i desideri dei consumatori, che rispetto al passato sono diventati pi湛 esigenti e diversi鍖cati.
  • 27. 26 Livello gra鍖co-visivo I contenuti visivi del sito sono chiari e ben organizzati. In alto a sinistra troviamo due paratesti: Visita il birri鍖cio ed e-shop che rappresentano rispettivamente il chi e il che cosa andremo a raccontare. In alto a destra si trovano i loghi dei principali social, che rimandano alla comunicazione integrata dellazienda, spiegando come e con quali mezzi lazienda comunica on-line.
  • 28. 27 Livello gra鍖co-visivo Provando a invertire le tonalit, ad usare una scala di grigi o un semplice bianco e nero il sito risulta sempre ben comprensibile, a favore dellaccessibilit da parte di utenti diversamente abili.
  • 29. 28 Livello gra鍖co-visivo In seguito ad unanalisi di Design effective Visuals (FENG-GUI) abbiamo notato quali sono le aree che attirano maggiormente lattenzione nei primi 3 secondi di utilizzo:
  • 30. 29 Analisi della coerenza e dellusabilit
  • 31. 30 Analisi della coerenza e dellusabilit Sono rispettate le principali funzioni di un sito, ma manca una funzione di ricerca semplice e pratica che possa aiutare il lettore nel ritrovare con immediatezza speci鍖ci contenuti. Lintero sito 竪 progettato per fornire paratesti che rimandano ad articoli testuali pi湛 speci鍖ci, ma la mappa del sito non 竪 presente e va implementata. Nel complesso il sito risulta avere una struttura semplice ma abbastanza intuitiva.
  • 32. 31 Analisi della coerenza e dellusabilit
  • 33. 32 Analisi della coerenza e dellusabilit
  • 34. 33 Analisi della coerenza e dellusabilit 5. Non 竪 presente un area Search
  • 35. 34 Analisi della coerenza e dellusabilit
  • 36. 35 Analisi della coerenza e dellusabilit 7. Non sono presenti men湛 a tendina in quanto i contenuti non sono molti 8. Non ci sono contenuti promossi in homepage perch竪 il sito ha un e-commerce esterno 9. Al contrario, lhome-page 竪 molto pulita e non ci sono eccessi gra鍖ci
  • 37. 36 Analisi della coerenza e dellusabilit
  • 39. 38 Modi鍖che sito web Lo stato dei tasti cambia passandoci sopra con il mouse, indicando di conseguenza una possibile interazione da effettuare. Aggiungere Youtube nella barra di navigazione dei collegamenti social perch竪 竪 una piattaforma web di video sharing da sfruttare e da non sottovalutare.
  • 40. 39 Una barra di ricerca utile agli utenti per orientarsi allinterno del sito e scrivere ci嘆 che desiderano trovare in velocit. Modi鍖che sito web Le icone di Instagram e Youtube non possono mancare nella sezione dei collegamenti ai social, in particolar modo su dispositivo mobile.
  • 41. 40 La mappa del sito allinterno della barra del Footer 竪 indispensabile e molto utile perci嘆 non pu嘆 non contenere le informazioni pi湛 importanti del sito web. Modi鍖che sito web
  • 42. Elena Bignami Vincenzo Calabr嘆 Andrea Marassi WebMonsters 1MSTC Teorie e Linguaggi della Comunicazione Digitale e del Web Marketing