Scaricare la presentazione
PubblicatoShort form of italian names ending with Modificato 10 anni fa
1
Forma e colore Si può interpretare la storia dell’arte occidentale alla luce del rapporto tra 2 parametri opposti e complementari: forma colore
2
Forma e colore La forma può rappresentare bene la realtà anche senza colore Il colore è meno incisivo della forma sul piano descrittivo Dunque il colore è stato considerato subordinato alla forma Per la psicologia moderna vale l’equazione forma=pensiero colore=emozione
3
Forma e colore Illuminismo
La forma ha una posizione dominante, il colore è un gradevole ornamento della struttura dell’immagine Romanticismo Comincia lo studio scientifico del colore, considerato come forma d’espressione e come fattore d’organizzazione strutturale.
4
Il colore Il colore come espressione
Espressione = capacità del colore di suscitare gli equivalenti percettivi degli “stati emotivi” (Es. studi degli espressionisti tedeschi) Goethe e Kandinsky tentano di associare colori e forme d’espressione (ma su questo argomento non c’è accordo) Il colore come organizzazione strutturale L’organizzazione crea ordine. Quali sono le proprietà dei colori che fanno scaturire ordine o disordine dalla loro interazione? Parallelismo tra relazioni di tonalità in pittura e di toni in musica
5
Il sistema dei colori Il disco dei colori (color wheel): cos’è e a cosa serve? Mostra l’organizzazione di base e le interrelazioni tra i colori Fornisce una grammatica di base indispensabile a chi utilizza colori e caratteri tipografici
6
Il sistema additivo - RGB Colori primari
7
Il sistema additivo - RGB Colori secondari
Mescolando 2 primari si ottiene un secondario
8
Il sistema additivo - RGB
I colori additivi dell’intero spettro luminoso si ottengono mescolando in varie proporzioni i tre primari: rosso verde blu Es. schermi televisivi o dei PC: i pixel colorati sono ottenuti bersagliando i fosfori degli schermi con elettroni rossi, verdi o blu Il sistema RGB è alla base della produzione di grafica per lo schermo
9
Il sistema additivo - RGB
Qualunque altro colore additivo dello spettro si ottiene da una qualunque mescolanza di due colori primari mixati otticamente in due modi: attraverso la loro vicinanza fisica presentandoli in rapida successione In entrambe i casi due colori sono percepiti come un colore solo Mescolando i tre primari si ottiene luce bianca
10
Il sistema additivo - RGB
Una tecnica utilizzata nei primi esperimenti con i colori additivi: il disco dei colori
11
Il sistema sottrattivo - CMY Colori primari
Coloranti, inchiostri e pigmenti
12
Il sistema sottrattivo - CMY Colori secondari
Ogni primario assorbe il secondario opposto e trasmette i due adiacenti
13
Il sistema sottrattivo - CMY
14
Il sistema sottrattivo - CMY
Ogni oggetto colorato (naturale o artefatto) assorbe determinate onde luminose e ne riflette altre. Le onde riflesse e trasmesse all’occhio determinano il colore di quell’oggetto. Il sistema CMY è alla base della produzione di grafica stampata Mescolando i tre primari si ottiene il nero
15
Il sistema sottrattivo - CMY
Il colore a occhio nudo appare pieno. In realtà è stampato sulla carta tramite un pattern puntinato controllato a computer, detto rosette
16
Il sistema additivo - RGB e il sistema sottrattivo CMY
In teoria i 3 primari, mescolati, danno il nero (tutta la luce è assorbita). In realtà il modello CMY non può essere utilizzato da solo. Per ottenere il nero, si deve aggiungere inchiostro nero, per questo il modello è indicato come quadricromia CMYK I primari di un sistema sono i secondari dell’altro
17
Il sistema additivo - RGB e il sistema sottrattivo CMY
Nei due sistemi il gamut non coincide, ed è comunque più ristretto dell’insieme dei colori percepibili dall’occhio umano Gamut = intervallo di colori che può essere riprodotto in un sistema dato
18
Le proprietà del colore
I diversi modelli del colore in uso individuano 3 attributi fondamentali del colore: Hue (tinta o colore) la lunghezza d’onda dominante o più semplicemente il colore percepibile di un campione Saturation (saturazione) grado di purezza della tinta. Individua sino a che punto la tinta è contaminata da altre tinte o dal grigio Brightness (brillantezza) quantità di luce riflessa, ovvero quanto luminoso è il colore
19
Le proprietà del colore
I diversi modelli del colore in uso individuano i medesimi 3 attributi fondamentali del colore, cambia la terminologia
20
Le proprietà del colore HUE
3 colori primari 3 colori secondari 6 terziari I colori opposti sono complementari
21
Le proprietà del colore SATURATION = misura della purezza del colore
3 colori primari e 3 colori secondari Saturazione alta Saturazione media Saturazione bassa
22
Le proprietà del colore SATURATION = misura della purezza del colore
La saturazione può essere utilizzata come strumento compositivo, per suggerire aree interessanti, bottoni attivi o, al contrario, aree in secondo piano. I colori desaturati sono detti muted (smorzati)
23
Le proprietà del colore BRIGHTNESS = misura della luce riflessa
3 colori primari e 3 colori secondari TINTS colore mescolato al bianco SHADES colore mescolato al nero
24
Le proprietà del colore BRIGHTNESS = misura della luce riflessa
Non collocate informazioni importanti in aree scure dello schermo. Su schermi diversi potrebbero addirittura risultare come aree nere e quindi illeggibili. Lo stesso per le aree chiare.
25
Le proprietà del colore BRIGHTNESS = misura della luce riflessa
26
Linee guida per l’uso del colore
Aspetti percettivi Aspetti cognitivi Aspetti culturali
27
Aspetti percettivi
28
Le percezione del colore
I colori si influenzano l’un l’altro. Lo stesso colore, posizionato su sfondi diversi, sembra molto diverso quanto a tinta e brillantezza. Interaction of Color Josef Albers
29
Le percezione del colore
Attenzione all’uso di colori saturi agli estremi dello spettro (complementari), soprattutto nel caso di testo su sfondo a a a Difficoltà di messa a fuoco, effetto flickering, fatica
30
Testo blu su fondo rosso
Nonostante il forte contrasto di colore, i due complementari hanno uguale luminosità. L’instabilità dei contorni rende la forma poco riconoscibile. Testo blu su fondo rosso
31
Testo rosso su fondo blu
Nonostante il forte contrasto di colore, i due complementari hanno uguale luminosità. L’instabilità dei contorni rende la forma poco riconoscibile. Testo rosso su fondo blu
32
Il contrasto nero-bianco è ottimo per la percezione della forma dato che è il massimo contrasto chiaro-scuro possibile.
33
La percezione del colore
Per una agevole messa a fuoco, oltre a differenza di colore è necessaria anche una differenza di luminosità
34
Testo blu
35
La percezione del colore IL BLU
Evitare il blu per testi, linee sottili, forme piccole; il blu è un ottimo colore di sfondo (Bassa - e calante con l’età - sensibilità al blu dell’occhio umano; difficoltà di messa a fuoco)
36
Evitare il blu per testi, linee sottili, forme piccole; il blu è un ottimo colore di sfondo
37
Evitare il blu per testi, linee sottili, forme piccole; il blu è un ottimo colore di sfondo
38
Il colore del testo Scegliere con cura il colore del testo in relazione allo sfondo. Soppesare le 3 proprietà del colore per ottenere un contrasto ottimale tra sfondo e testo Delle 3 proprietà del colore la BRIGHTNESS (LUMINOSITA’) influisce di più sulla leggibilità
39
Il colore del testo Una buona regola consiste nello scegliere colori che NON sono complementari e nemmeno troppo vicini nella color wheel. Ricordarsi sempre del contrasto di luminosità. Sfondo: colori scuri agli estremi dello spettro Testo: colori chiari non saturi, al centro dello spettro
40
minore leggibilità Testo bianco su fondo rosso scuro
Testo giallo non saturo su sfondo rosso scuro Testo verde chiaro su sfondo rosso scuro Testo azzurro su sfondo rosso scuro Testo bianco su fondo rosso scuro Testo giallo non saturo su sfondo rosso scuro Testo verde chiaro su sfondo rosso scuro Testo azzurro su sfondo rosso scuro minore leggibilità
41
Testo bianco su fondo rosso scuro
Testo giallo non saturo su sfondo rosso scuro Testo verde chiaro su sfondo rosso scuro Testo azzurro su sfondo rosso scuro Testo bianco su fondo rosso scuro Testo giallo non saturo su sfondo rosso scuro Testo verde chiaro su sfondo rosso scuro Testo azzurro su sfondo rosso scuro
42
Testo bianco su fondo rosso scuro
Testo giallo non saturo su sfondo rosso scuro Testo verde chiaro su sfondo rosso scuro Testo azzurro su sfondo rosso scuro Testo bianco su fondo rosso scuro Testo giallo non saturo su sfondo rosso scuro Testo verde chiaro su sfondo rosso scuro Testo azzurro su sfondo rosso scuro
43
Testo bianco su fondo rosso scuro
Testo giallo non saturo su sfondo rosso scuro Testo verde chiaro su sfondo rosso scuro Testo azzurro su sfondo rosso scuro Testo bianco su fondo rosso scuro Testo giallo non saturo su sfondo rosso scuro Testo verde chiaro su sfondo rosso scuro Testo azzurro su sfondo rosso scuro
44
Testo bianco su fondo rosso scuro
Testo giallo non saturo su sfondo rosso scuro Testo verde chiaro su sfondo rosso scuro Testo azzurro su sfondo rosso scuro Testo bianco su fondo rosso scuro Testo giallo non saturo su sfondo rosso scuro Testo verde chiaro su sfondo rosso scuro Testo azzurro su sfondo rosso scuro
45
Testo bianco su fondo rosso scuro
Testo giallo non saturo su sfondo rosso scuro Testo verde chiaro su sfondo rosso scuro Testo azzurro su sfondo rosso scuro Testo bianco su fondo rosso scuro Testo giallo non saturo su sfondo rosso scuro Testo verde chiaro su sfondo rosso scuro Testo azzurro su sfondo rosso scuro
46
Da questo esempio si vede la difficoltà di messa a fuoco
contemporanea del rosso e del blu: da molti le righe di questi due colori vengono viste, per i motivi descritti, come se fossero collocate a distanze diverse dagli occhi. Questo fenomeno non si verifica se si usano due colori che si trovino fra loro più vicini sullo spettro visibile, come si può facilmente verificare da questo secondo esempio, che non dovrebbe presentare l’effetto tridimensionale di cui sopra.
47
Aspetti cognitivi
48
QUANTI COLORI? Usare pochi colori contemporaneamente (5 +/- 2)
49
Esempi Troppi colori Molto meglio!
The improper use of color can really detract from the aesthetic quality of an application. The toolbar used in Compuserve's WinCim application reminds us of a child's paint-by-numbers set. The images not only lend themselves to an unprofessional appearance, they are distracting. The toolbar used in Microsoft Word, in contrast, uses a much more limited set of colors, and the colors are themselves subtle. Despite these differences, Word's toolbar provides far more information in less space, because it primarily relies on shape to distinguish among the functions. In addition to presenting a more professional appearance, the judicious of color is less likely to give rise to unintended interpretation based on the user's personal and cultural color associations. Molto meglio!
50
Semantica dei colori Associare i colori ai vari significati in modo consistente
51
Associazione Usare lo stesso colore per raggruppare oggetti simili
color coding
52
Focus Usare colori brillanti e saturi per attirare l’attenzione
54
Aspetti culturali
55
Colori caldi e freddi COLORI CALDI COLORI FREDDI
azione, urgenza richiesta di risposta, vicinanza COLORI FREDDI lontananza, tranquillità, informazioni di stato
56
Colori caldi e freddi I colori caldi tendono ad avanzare, i colori freddi a recedere
57
Codici familiari: esempio
ROSSO stop, pericolo, caldo, fuoco GIALLO attenzione, rallentamento VERDE avanti, ok, sicurezza, vegetazione GRIGIO, BIANCO neutralità
58
STOP EXIT PERICOLO ! AVANTI
60
Ma le associazioni possono cambiare nelle diverse culture!
Presentazioni simili
© 2024 SlidePlayer.it Inc.
All rights reserved.