07. Gestaltregeln-Diagramme-Helligkeit V1€¦ · Prof. Dr.-Ing. Detlef Krömker...

Prof. Dr.-Ing. Detlef Krömker

Goethe-Universität, FrankfurtGraphische Datenverarbeitung

Visualisierung

Gestaltregeln – Diagramme - Helligkeit

WS 2000/20012

Gestaltregeln und Diagramme Helligkeitswahrnehmung7. Kapitel© Prof. Dr.-Ing. Detlef Krömker

Rückblick� Unterscheide: Sensorische und willkürliche visuelle Kodes

(Zeichen, Symbole, Bilder)� Eigenschaften des Visuelles Systems zur Wahrnehmung

von Positionen, Größen und Orientierungen� Elementare Mappingverfahren

Positionen, Längen, Flächen, Orientierungen Winkel� Spezielle Diagramme

FlächendiagrammSäulendiagrammBalkendiagrammKreisdiagrammRingdiagramm

KursdiagrammBlasendiagrammNetzdiagrammFlächendiagrammKegel, Zylinder, Pyramidendiagramm

WS 2000/20013


Übersicht

1. Nachtrag: Isolinien (Isoplethen, Höhenfelder)2. Gestaltregeln3. Eine Wahrnehmungs-Syntax für

Diagramme4. Wahrnehmung von Helligkeit 5. Kontrast6. Abbildung auf Helligkeit

WS 2000/20014


Übersicht (Fortsetzung)

7. Zusammenfassung 8. Glossar9. Ausblick – Nächste Schritte

WS 2000/20015


Isolinien (und Isoplethen)

� Daten mit Orts- oder Raumbezug � Isolinien bezeichnen Kurven, die diejenigen

Punkte des Beobachtungsraumes verbinden, für die gleiche Datenwerte vorliegen

� Beispiel: Höhenlinien in Karten� allgemein zur Darstellung skalarer Größen

in einem 2D (3D) Beobachtungsraum

WS 2000/20016


Isolinie

� f(x,y)= const mit f(x,y) eine skalare Funktion� Um diese Paare (x,y) zu bestimmen, muß eine

Kontourfindung (Contouring) durchgeführt werden.

� Zwei Ansätze:� Gitterbasierte Erzeugung

� Pixel-by-Pixel Contouring� Zellenbasiertes Contouring

� Gitterfreie Erzeugung

WS 2000/20017


Pixel-by-Pixel Contouring

Gegeben:

skalares Datenfeld: φφφφ[1…xmax, 1…ymax]Isowerte: I1, I2, … In

Algorithmus:Für alle x = 1…xmaxFür alle y = 1…ymaxWenn (|φ|φ|φ|φ (x, y) – Ik||||) ≤≤≤≤ εεεε , k = 1…n

dann P(x, y) = Cksonst P(x, y) = Cbackground

Ende

Nachteil:Relativ großer Aufwand

WS 2000/20018


BeispielFischverteilung in der Bautzener Talsperre

WS 2000/20019


Zellenbasiertes Contouring

Gegeben:

skalares Datenfeld: φφφφ[1…xmax, 1…ymax]

Datengitter: fi,j = φφφφ[xi, yj]Isowerte: I1, I2, … In

Algorithmus:

1. Bestimme für jede Gitterzelle {fi,j,fi+1,j, fi,j+1, fi+1,j+1},fmin und fmax

2. Ermittle die Gitterzellen, für diegilt: fmin ≤≤≤≤ Ik ≤≤≤≤ fmax, k = 1,2..,n

WS 2000/200110


Zellenbasiertes Contouring (Fortsetzung)

3. Bestimme die Schnittpunkte der Gitterzelle mitder Isolinie durch lineare Interpolationzwischen den Gitterpunkten:

Für den Schnittpunkt der Kante mitxmin = xmax ergibt sich:

Für ymin = ymax analog!

4. Zeichne Isolinie (xc,1,yc,1), (xc,2,yc,2),(xc,3,yc,3), …(xc.k,yc.k)

Bemerkung: Üblich ist hier ein zeilenweisesVorgehen!

( ) ( )minmax

maxminminmax,

min,

ffyfIyIfy

xx

kkkc

kc

−⋅−+⋅−=

=

WS 2000/200111


Sonderfall bei 3.

Werden an den diagonal gegen-überliegenden Eckpunkten jeweils höhere (+) bzw. niedrigere Werte (-) als der aktuelle Isowertgemessen, so kreuzen zwei Isokurven die Gitterzelle. Ein weiterer Meßpunkt in der Mitte der Zelle gibt dann Aufschluß, ob die Kurven von links oben nach rechts unten (obere Variante) oder von links unten nach rechts obengeht.

WS 2000/200112


Kritik: Zellenbasiertes Contouring

� Darstellung erfolgt:� Streckenzug (Polygonzug)

(vermittelt Eindruck der Genauigkeit)� Splinekurve

(sieht gefälliger aus – aber entspricht i.d.R. nicht dem tatsächlichen Verlauf der Isolinie)

Nach Bertin: Unterstützen nicht die spontane Gruppierung von Datenklassen.

WS 2000/200113


IsoplethenHöhenfelder

� Isoplethen: Anstelle der Begrenzungslinien werden farbige Bänder dargestellt� Stärkere Gruppierung der Daten

� Höhenfelder: Datenwerte werden nicht nur auf Isolinien und z.B. Farben abgebildet, sondern zusätzlich auf eine dritte Raumkoordinate. Darstellung erfolgt durch perspektivische TransformationEinfach z.B. wenn Daten auf einem regelmäßigen Gitter vorliegen: Dann erzeugen drei Punkte ein Dreieck.

WS 2000/200114


Beispiel Höhenfeld

Druckverteilung in einem Radialgleitlager

WS 2000/200115


Gestaltgesetze

� (Frankfurter) Schule der Gestaltpsychologie:Max Wertheimer, Kurt Koffka, Wolfgang Kohler, ...

auch im Englischen „Gestalt Laws“ „Gestalt School“� ab ≈ 1912 ... Emigration in den 30ern„Das Ganze ist verschieden von der Summe seiner

Teile.“Verschiedene Phänomene der höheren

Wahrnehmung (im Gegensatz zum frühen Sehen)

WS 2000/200116


Gestaltgesetze

Sieben robuste Regeln, die insbesondere beschreiben, wie unser visuelles System Elemente nach bestimmten Gruppierungsregeln zusammenfaßt.

Die damaligen Erklärungen entsprechen nicht dem heutigen Wissensstand – die Regeln (besser Prinzipien) selbst sind jedoch nach wie vor gültig und sehr wichtige Designprinzipen:� Prinzip der Nähe (Proximity)� Prinzip der Ähnlichkeit (Similarity)� Prinzip der stetigen Fortsetzung (Continuity)� Prinzip der Symmetrie (Symmetry)� Prinzip der Konvexität (Geschlossenheit, Closure)� Prinzip der Relativen Größe (Relative Size)� Prinzip der Figur-Grund-Trennung (Figure and Ground)

WS 2000/200117


Prinzip der Nähe (Proximity)

� Näheres wird als zusammenhörig empfunden� Eines der wirksamsten Prinzipien� Einfachste und mächtigste Möglichkeit eine enge

Beziehung zwischen Entitäten auszudrücken

WS 2000/200118


Weitere Besispiele:Prinzip der Nähe (Proximity)

Spätere Erweiterung nach Slocum 83 (Prinzip der „spatial concentration“)

WS 2000/200119


Prinzip der Ähnlichkeit (Similarity)

� Gleiches (oder fast gleiches) wird als zusammengehörig empfunden

� Farbe gruppiert stärker als Form

WS 2000/200120


Prinzip der stetigen Fortsetzung (Continuity)

� Es werden eher einfache, regelmäßigere, glatte oder kontinuierliche Formen wahrgenommen – im Gegensatz zu solchen mit abrupten Änderungen

WS 2000/200121


Anwendung des Prinzips der stetigen Fortsetzung

in Blockdiagrammen

Verbindungen zwischen Diagrammelementen werden einfacher erkannt, wenn die Linien kontinuierlich und glatt sind

WS 2000/200122


Wieder eine Ergänzung (Palmer und Rock 1994)

Prinzip der Verbundenheit (Connectedness)

� Verbundenheit ist stärker als Nähe, Farbe, Größe, Form

WS 2000/200123


Prinzip der Symmetrie (Symmetry)

WS 2000/200124


Prinzip der Konvexität (Geschlossenheit, Closure)

� Konvexe Formen werden bevorzugt wahrgenommen � schwarzer Kreis� Rechteck vor dem Kreis

WS 2000/200125


Anwendungen des Prinzips der Konvexität

(Geschlossenheit, Closure)

Interpretation des Venn Diagramm: � Elemente können gleichzeitig zur Menge A und C gehören aber

nicht zu A,B,C� Alle Elemente, die die sowohl zu B als auch zu C gehören sind

auch Elemnte von D Interpretation einer Multi-Window-Umgebung:

Die Position der Objekte wird relativ zum umschließenden Rahmen beurteilt

WS 2000/200126


Prinzip der Relativen Größe (Relative Size)

� Kleinere visuelle Komponenten werden eher als Objekte wahrgenommen: hier ein Propeller vor weißem Grund

� Beachte: generell werden horizontale oder vertikale Strukturen gegenüber diagonalen häufiger als Objekte erkannt

WS 2000/200127


Prinzip der Figur-Grund-Trennung (Figure and Ground)

� Visuelles System unterscheidet Vordergrund (Objekte, Figuren) und Hintergrund

� Grundlage für die Objektidentifikation� Viele Einzelelemente (geschlossene Konturen, Sym-

metrie, weiße Fläche als Hintergrund, ...) tragen dazu bei� Klare geometrische Strukturen sind nicht erforderlich

nach Thurston 86

nachRubin 21

WS 2000/200128


� Auch grundlegende höhere Wahrnehmungsprozesse kön-nen situationsbedingt unterschiedliche Ergebnisse liefern

� Wertheimer hat auch wichtige Beiträge zur Bewegt-bildwahrnehmung geliefert: Phi-Phänomen (später)

� Wahrnehmung von Konturen hat große Bedeutung bei der Visualisierung von Vektorfeldern (später)

� Gestaltprinzipien sind seit mehr als 80 Jahren bekannt, trotzdem neurophysiologisch kaum verstanden

Weitere wichtige Erkenntnisse der Gestalttheoretiker

WS 2000/200129


Grobstruktur des Visuellen SystemsGestaltprinzipien sind Wahrnehmungs-

phänomene der Stufe I und II

Frühes Sehen:Konturen, FarbeTexturen,Räumliche Wahrnehmungseffekte

Räumliche Anordung

Wahrnemungfür Aktionen

Objekterkennung

Visueller Langzeitspeicher

MotorischeAusgabe

Sprachzentrum

Stufe II

Schnelle ParallelarbeitExtraktion von Konturen, OrientierungenFarbe, Texturen, Muster, BewegungBildgedächtnis (Iconic Store)

Stufe I

Langsame serielle Verarbeitung

Einbeziehung des LangzeitgedächtnissesVerarbeitung willkürlicher BilderZwei Wege: Visuell gesteuerte Bewegung und Objekterkennung

WS 2000/200130


Eine Wahrnehmungs-Syntax für Diagramme

� Achtung: im Englischen sind Diagrams eine Sonderform der Charts:

� Diagrams zeigen nicht-quantitative Beziehungen zwischen Elementensind sowohl willkürlich wie auch sensorisch:

� Besonders häufig: Knoten-Kanten-Diagramme(Blockdiagramme)

� Wir suchen solche, die besonders leicht wahrzunehmen sind.

WS 2000/200131


Beispiele für Knoten-Kanten-Diagramme

WS 2000/200132


Erzeugt geteilte Entität5. Teilende Linien innerhalb der Regionen

Wert der Entität:Größer = Mehr

4. Größe der ge-schlossenen Region

Typ der Entität3. Farbe der ge-schlossenen Region

Typ der Entität2. Form der geschlossenen Kontour

Entität, Objekt, Knoten1. Geschlossene Kontour

SemantikVisuelle Ausprägung

Graphischer Kode

Elemente einer visuellen Grammatik für Knoten- Kanten Diagramme

WS 2000/200133




Graphischer Kode

Eine Beziehung zwischen den Entitäten

9. Verbindungslinie

Eine Sequenz8. Örtlich geordneteFormen

Enhaltene Entitäten7. Formen von einerKontoureingeschlossen

Angeheftete EntitätenTeil_von_Relation

6. AngehefteteFormen

WS 2000/200134




Graphischer Kode

Gruppen von Entitäten

13. Nähe

Ein Passen der Entitäten

12. Art des Verbindungsstücks

Stärke (Festigkeit) der Beziehung

11. Linienstärke

Typ der Beziehung 10. Linientyp

WS 2000/200135


Wahrnehmungscharakteristika von Helligkeit

� Helligkeit (Hell-Dunkel-Unterschied)sehr wichtige Empfindungsgröße fürs Formensehen,

Objektsehen, ...bisher angenommen, dass der Unterschied groß genug

ist: für kleine Details mindestens 3:1 (besser 10:1) ISO 9241, part 3 fürs Text lesen

� Keine absolute Wahrnehmungsgröße; abhängig von:� Reizstärke (Leuchtdichte)� Leuchtdichte zuvor --> ADAPTION� Leuchtdichte in der Umgebung� Absolute Größe des Reizes

� Kontrast, CSF

WS 2000/200136


Helligkeit

Gar nicht so einfache Fragen:� Was ist weiß?� Was ist schwarz?� Was ist ein mittleres Grau?

Einige Effekte:� Simultankontrast� Hermann Grid Illusion� Mach-Bänder� Chevreul Illusion

WS 2000/200137


Simultankontrast 1

WS 2000/200138


Simultankontrast 2

128 171

WS 2000/200139


Hermann Grid Illusion

WS 2000/200140


Simultankontrast 3

(128,128,128)

(185,185,185)

WS 2000/200141


Mach Bänder

Ergebnis einer linearen Interpolation(z.B. nach Gouraud)Helle Bänder erscheinen dort, wo die 1. Ableitung eine unstetige Änderung aufweißt.

WS 2000/200142


Chevreul Illusion

Die Streifen sind jeweils gleich hell;sie erscheinen jeweils am linken Rand dunkler als

am rechten Rand.

WS 2000/200143


Analyse:Simultankontrast - Hermann Grid Illusion

Mach-Bänder - Chevreul Illusion

� Effekte des „frühen Sehens“ (Retina, erste verarbeitende Nervenzellen)

� Antwort eines Rezeptiven Feldes: DOG (Difference of Gaussians) Modell

� Basis für die Kanten- und Konturerkennung

WS 2000/200144


Luminance (Lichtstärke) Brightness (Leuchtdichte oder Helligkeit)

Lightness� Luminance (luminous intensity) LichtstärkeGemessene Lichtmenge, die aus einer Region des Raumes abgestrahlt wird.

Wird in Candela (cd) gemessen.

� Brightness (1) Leuchtdichte [cd/m2]auch 1Stilb = 1sb = 1cd/cm2

1Apostilb = 1asb= 0,3183 cd/m2

1 Lambert = 1L = 104/π cd/m2

1 foot-Lambert = 1fl = 3,426 L auf der Netzhaut (Retina) oft in:1 troland = 1cd/cm2 bei 1mm Pupillenöffnung

� Brightness (2) Helligkeit (1)Entspricht der wahrgenommenen Menge an Licht, das von einer

selbstleuchtenden Lichtquelle (z.B. Monitor) ausgeht.

� Lightness Helligkeit (2)Entspricht der wahrgenommenen Menge an Licht, das von einer reflektierenden

Oberfläche ausgeht.

WS 2000/200145


Radiometrie und PhotometrieRadiometrie: Physikalische Beschreibung elektromagneti-scher Energie, z.B. Betrag der Lichtenergie je Wellenlänge

Photometrie: psychophysikalische Messung der visuellen Energie, die vom elektromagnetischen Spektrum erzeugt wird.

[ ] λλλ dEVmcdLnm

nm�=

740

380

2/

-0,2000

0,0000

0,2000

0,4000

0,6000

0,8000

1,0000

1,2000

350 450 550 650 750 850

c

CIE V (λ)

WS 2000/200146


Definition KONTRAST

verschiedene Definitionen üblich

(Modulationsgrad)m k l ll l

= = −+

max min

max min

ergrundesHdesteLeuchtdichLizesdesteLeuchtdichLmit

LL

LLLK

H

R

HH

HR

intRe

==

∆=−=

WS 2000/200147


� Bestimmbar z.B. durch MASSON-ScheibeRing Schwarzanteil %

1 2,382 1,193 0,794 0,605 0,48

� starke individuelle Unterschiede� bei mittleren Leuchtdichten (10-1000 cd/m2) ist

diese Schwelle konstant: ca. 0,8 %: Weber-Fechnersches Gesetz

� kleinere Leuchtdichten: de Vries-Rose-Gesetz

Helligkeits-UnterschiedsschwelleSchwellenkontrast

WS 2000/200148


Weber-FechnerschesStevensches Gesetz

� Webersches Gesetz

� Fechnersches Gesetz

� Stevensches Gesetz

∆ ∆LL

RR

co n s t= = .

E k R= ⋅ log

E c R k= ⋅k=2,13(Schmerz); =0,96 (Wärme); = 0,32 (Schall); =0,21 (Licht)

WS 2000/200149


Erkennung kleiner Details

� Begrenzt durch � optische Eigenschaften des Auges,

insbesondere Beugungserscheinungen� Abtastung durch Rezeptoren

(hier insbesondere die Zapfengröße)� nervöse Verarbeitung

� Maß: Kontrastempfindlichkeit (contrast sensitivity)

Schwellenkontrast z.B. als Funktion der Ortsfrequenz

© Detlef Krömker

CSF

WS 2000/200150


CSFContrast Sensitivity Function

WS 2000/200151


Die CSF (contrast sensitivity function)

� ist die MTF des Visuellen SystemsMTF: Modulationstransferfunktion

(siehe GDV-E)Beispiele

� Übliche Approximation (normalisiert)Abbildung auf Helligkeit

© Detlef Krömker

H u v H A e

mit A

p( , ) ( )

, ; , ; , ; ,

= = + �

��

�

��

�

�

�� ⋅

= = = =

−��

�

��

ρ α ρρ

α ρ β

ρρ

β

0

0

0

2 6 0 0192 8 772 11

WS 2000/200152


Empfindungsmäßige Helligkeitsskalanach CIE

� sogenannte psychometrische Helligkeitsfunktion� Siehe auch CIELUV, CIELAB� ∆L = 1: gerade noch wahrnehmbar

sferenzweisdesteLeuchtdichYteLeuchtdichY

YYfür

YY

YYfür

YY

L

W

ww

ww

Re::

1008856.016116

008856.0029.903

31*

��

�

��

�

�

≤<−��

��

⋅

≤≤⋅

=

WS 2000/200153


Uniforme Grauwertskalen

� Empfindungsmäßige Helligkeitsskalen erlauben die Erzeugung von wahrnehmungsmäßig uniformen Skalen.

� Beachte: Dieses sind immer nur grobe Approximationen

� Für Werteskalen nur 3-4 Werte nutzen.� Gut geeignet für Differenzdarstellungen� Einige weitere Aspekte betrachten wir beim

Mapping auf Farbe.

WS 2000/200154


Ein weiterer EffektKontrastverstärkung

Differenzen werden umso stärker wahrgenommen, je näher sie an der Hintergrundhelligkeit liegen.

Dieser Effekt wird auch von uniformen Grauwertskalen nicht berücksichtigt.

WS 2000/200155


Zusammenfassung

� Gestaltregeln� Eine Wahrnehmungs-Syntax für

Diagramme� Wahrnehmung von Helligkeit � Kontrast� Abbildung auf Helligkeiten (auf Grauwerte)

WS 2000/200156


Glossar

� Glossar der Begriffe� Definieren Sie die Fachausdrücke, wie sie

zu diesem Thema verwendet werden.

WS 2000/200157


Ausblick – Nächste Schritte

� Farbwahrnehmung� Abbildung auf Farbe� Farbskalen

Nächstes Kapitel

WS 2000/200158


CG KolloquiumMittwoch, den 29.11.2000, 18 Uhr ct

Magnus Hörsaal

07. Gestaltregeln-Diagramme-Helligkeit V1€¦ · Prof. Dr.-Ing. Detlef Krömker...

Documents

Transcript of 07. Gestaltregeln-Diagramme-Helligkeit V1€¦ · Prof. Dr.-Ing. Detlef Krömker...