La presentazione è in caricamento. Aspetta per favore

La presentazione è in caricamento. Aspetta per favore

Modulo e programma I programmi si basano sulla ripetizione di grandezze e proporzioni (moduli) – aspetto quantitativo forme, colori … (temi) – aspetto.

Presentazioni simili


Presentazione sul tema: "Modulo e programma I programmi si basano sulla ripetizione di grandezze e proporzioni (moduli) – aspetto quantitativo forme, colori … (temi) – aspetto."— Transcript della presentazione:

1 Modulo e programma I programmi si basano sulla ripetizione di grandezze e proporzioni (moduli) – aspetto quantitativo forme, colori … (temi) – aspetto qualitativo che apportano regolarità e strutturano lesperienza dellutente. Il visual design finalizzato alla comunicazione implica lo sviluppo di programmi: sistemi di organizzazione globale.

2 Modulo e programma corporate identity libro o brochure a stampa sistema di GUI (on e off line) merchandising … I diversi aspetti del programma sono applicati allintera gamma dellattività di design:

3 Modulo e programma Il designer deve definire un programma dotato di flessibilità per dar spazio alle singole parti componenti. Le parti devono essere modellate affinché rientrino in un sistema comprensibile.

4 I benefici Struttura Il modulo è correlato alla struttura: il modulo trae giustificazione dai requisiti strutturali la struttura è rivelata e rinforzata dalla ripetizione del modulo Es. segnaletica stradale sistema di icone per le diverse discipline sportive dei giochi olimpici Prevedibilità Il design programmato semplifica il compito comunicativo: prepara lutente a rispondere in modo prevedibile a poche e familiari configurazioni la semplicità e la regolarità facilitano lapprendimento e la memorizzazione anche con scarsa attenzione

5 I benefici Efficacia Il design modulare consente una grande economia di produzione: grandi quantità di prodotti in poco tempo e con bassa expertise

6 La griglia Divide le pagine in un piccolo numero di unità primitive lungo le 2 dimensioni. Comprende suddivisioni orizzontali e verticali. Consente di posizionare in modo consistente nelle diverse pagine importanti elementi strutturali. Specifica lampiezza delle colonne e degli spazi tra queste.

7 Design basato sulla griglia La griglia aiuta il designer a mantenere un programma coerente nelle diverse pagine, schermate… La griglia aiuta lutente a trarre beneficio dalla propria esperienza, consentendogli di prevedere dove reperire uninformazione

8 Design basato sulla griglia La griglia non è una camicia di forza: non inibisce lo sviluppo di nuove soluzioni allinsorgere di unanomalia. La griglia favorisce la propagazione della variazione a tutto il sistema. La griglia consente al designer di concentrarsi sul contenuto. La griglia è applicabile al design 2d e 3d. La griglia è indispensabile nel design di grandi sistemi dinformazione.

9 Principi Focus La griglia fornisce un quadro di riferimento per i diversi elementi di un sistema. Questo scheletro ha un focus concentrato su una o poche unità modulari, che rivelino la soggiacente logica spaziale. Es.

10 Principi Flessibilità La flessibilità nellaffrontare situazioni inattese è un fattore di successo. Le griglie non devono limitarsi a costruzioni semplicistiche e regolari fino al limite della rigidità, possono essere variate per adattarsi allunicità di un compito.

11 Principi Flessibilità Nelle GUI la flessibilità è ancora più indispensabile perché lutente può scalare la finestra a piacimento. Flessibilità di supporto ad un layout dinamico. Espressione delle misure in percentuale e non in unità assolute. Es. X Window

12 Principi Applicazione consistente Il programma di progetto, per essere efficace, devessere usato consistentemente ovunque. Es. Sistema delle banconote

13 Principi Applicazione consistente Nella corporate identity è fondamentale luso consistente di colori immagini caratteri tipografici … espressione visiva dei valori e della cultura di unazienda. Gli elementi del programma devono essere applicabili con minime alterazioni a una vastissima gamma di artefatti.

14 Principi Applicazione consistente Nelle GUI le problematiche sono simili. Lutente desidera sapere in anticipo cosa aspettarsi quando si apre un dialog box. La consistenza di posizionamento ed apparenza lo aiuta a rispondere alle situazioni nuove. Scansione rapida di menu, palette, bottoni...

15 Errori comuni Posizionamento e dimensionamento arbitrario dei componenti posizionamento casuale e grandezza variabile dei bottoni, proporzionali alla lunghezza delle etichette bottoni grossi corrispondono a comandi più importanti di quelli piccoli? mancano gli allineamenti.

16 Errori comuni Grandezza e layout delle finestre variabili casuale il design programmato di finestre secondarie e di dialog box è raramente considerato. poiché compaiono sullo schermo isolatamente non sono considerati come parte di una serie. lutente ne incontra decine se non centinaia al giorno, con grave danno funzionale ed estetico.

17 Errori comuni

18 Dimensione e aspetto delle icone non coordinato le icone e i bottoni, sono presentati in array, quindi devono essere dimensionate in modo consistente per evitare i problemi di allineamento. spesso variano anche per layout, carattere tipografico, scala, punto di vista, densità delle immagini.

19 Errori comuni Inconsistente presentazione dei controlli Questo problema è molto attenuato nello sviluppo di GUI per applicativi, ma molto urgente per il multimedia on e off line. Qui non esistono standard di ampia condivisione: il regno della creatività.

20 Errori comuni Inconsistente linguaggio visivo Quando il linguaggio visivo non è applicato in modo consistente in tutto lambiente applicativo perde in forza comunicativa. Distacchi radicali dagli standard spesso producono effetti dannosi ben al di là del caso specifico.

21 Tecniche Modulo e programma sono particolarmente importanti nelle GUI. Qui sussiste una molteplicità di formati: finestre primarie e secondarie, dialog box, toolbox, palette... Tre tecniche servono ad apportare regolarità e prevedibilità: Creare dei layout sulla base di griglie Definire delle unità modulari Rinforzare la struttura attraverso la ripetizione

22 Tecniche La griglia canonica 1 - definire il modulo-base orizzontale e verticale. Questi parametri (altezza riga, larghezza colonna, numero di colonne) definiscono la griglia canonica. 2 - schizzate velocemente un layout che si avvicina alle dimensioni, posizioni e orientamento degli elementi principali 3 - utilizzate la griglia canonica per adattare la grandezza e la posizione degli elementi sulle righe. Allungare gli elementi troppo corti, estendere sui più moduli quelli troppo lunghi. Stabilire allineamenti consistenti. Disporre simmetricamente e bilanciare i controlli.

23 Tecniche La griglia canonica 4 - per i layout dinamici, identificare la grandezza minima ammissibile è meglio che ri-calcolare il layout per grandezze (piccole) arbitrarie.

24 Tecniche La griglia canonica

25 Tecniche Definire unità modulari 1 - definire lunità verticale. Nelle GUI ciò significa definire laltezza standard dei controlli e la loro spaziatura. 2 - lunità verticale deve consentire che 2 controlli siano posizionati vicini, una spaziatura appropriata tra controlli multi-linea e gruppi di controlli. Se le labels devono essere posizionate sopra invece che di fianco, lunità verticale deve permetterlo. 3 - definire lunità orizzontale. Larga abbastanza per contenere la maggior parte delle labels di 1 parola. Almeno 3 volte lunità verticale.

26 Tecniche Definire unità modulari 4 - lunità orizzontale ideale divide in 5-7 parti la larghezza della schermata. Può essere moltiplicata o suddivisa. 5 - evitare limpiego locale di moduli più piccoli del normale per accogliere una densità particolare di dati.

27 Tecniche Rinforzare la struttura attraverso la ripetizione Luomo tende a percepire la regolarità (leggi di unificazione figurale). Il designer può scegliere un elemento la cui ripetizione faciliti la comunicazione e fornisca un senso di confortevole familiarità.

28 Tecniche Rinforzare la struttura attraverso la ripetizione 1 – anche qui cominciare con uno schizzo sommario della serie (per intero) dei layout da produrre. 2 - cercare elementi funzionali comuni che devono essere percepiti con chiarezza nelle diverse schermate. Arrangiare le schermate singole in modo da assicurare la posizione consistente dei principali elementi Strutturali (header, footer, nav_bar…) 3 - identificare gli elementi molto spaziati che dovrebbero essere visivamente correlati, ma che non possono stare vicini. Ad esempio tramite il colore. Oppure… ?

29 Tecniche Rinforzare la struttura attraverso la ripetizione 4 - identificare il percorso dellocchio dellutente. La ripetizione di elementi strutturali marca il territorio e guida lutente nella navigazione. 5 - utilizzare la localizzazione standard e uno stile di presentazione consistente per testi, immagini, bottoniere...


Scaricare ppt "Modulo e programma I programmi si basano sulla ripetizione di grandezze e proporzioni (moduli) – aspetto quantitativo forme, colori … (temi) – aspetto."

Presentazioni simili


Annunci Google