Prof. Dr.-Ing. Detlef Krömker

Goethe-Universität, FrankfurtGraphische Datenverarbeitung

Graphische Datenverarbeitung

Prolog und Einführung

SS 20012Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

Übersicht

1. Übersicht Technologie und Anwendungen2. Relationen zu anderen Technologiegebieten3. Die fachliche Breite der CG4. Geschichtlicher Überblick zur CG

Computergraphik an der Goethe-Uni� Relation GDV und GDV-E� Relation zu den weiteren Lehrveranstaltungen

5. Ziele dieser Veranstaltung

SS 20013Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

Übersicht (Fortsetzung)

6. Themenübersicht Graphische Datenverarbeitung7. Literatur, Unterlagen zur Vorlesung,

Fachzeitschriften, Konferenzen, Web-Quellen8. Übungen 9. Prüfungen, Scheine, etc.10. Zusammenfassung 11. Glossar12. Ausblick – Nächste Schritte

SS 20014Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

1. Übersicht Technologie und Anwendungen

GDV Animation

Kunst

Training(CGI)

Spiele

CAxCAM

CADCAE

CG

• Graphische Daten-verarbeitung GDV

synonym• Computergraphik CG

oder Computergrafik

war oft Enabling Technology•• Ingenieuranwendungen CAx• Training (Sichtsimulation,

CGI Systeme)• Spiele• Animation• Kunst

SS 20015Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

2. Relationen zu anderen Technologiegebieten

� Bildverarbeitung� Screen- und UI-Design� Animation� Multimedia� Virtual Reality� Visualisierung (Daten und Informationen)

SS 20016Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

Die Relation zur BildverarbeitungDie Relation zur BildverarbeitungDie Relation zur BildverarbeitungDie Relation zur BildverarbeitungDas klassische Schema nach RosenfeldDas klassische Schema nach RosenfeldDas klassische Schema nach RosenfeldDas klassische Schema nach Rosenfeld

Eingabe

Ausgabe

Bild Beschreibung

Bild Bild-verarbeitung

GenerativeComputer-

Graphik

Beschreibung Bildanalyse „alles andere“

SS 20017Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

Computergraphik und Bildverarbeitung

• Symbolische Ebene:

• Merkmalsebene:

• Abtastebene:

• Reiz- & Aktionsebene :

Text, Tabellen (Noten, ..Modelle (Kinematik,

Dynamik, Verhalten)

Geometrie & visuelle Merkmale

Animation Festbild

Digitalvideo

Graphik- undBV-Primitive

Digitales Bild

optisch

SS 20018Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

Graphikbearbeitung

Bildverstehen

Merkmalsextraktion

Aufnahme

Bildbearbeitung

Rechnerpräsentation von Medien

• Symbolische Ebene:

• Merkmalsebene:

• Abtastebene:

• Reiz- & Aktionsebene :

CG und BV

Graphik- oderBV-Primitive

Digitales Bild

optisch

Visualisierung

Rendering

Anzeige

SS 20019Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

User Interface DesignBenutzungsschnittstelle

nicht Benutzerschnittstelle„Gesicht“ eines interaktiven Programms� Screen Design:

Graphischer Entwurf, Layout � DesignaufgabeRolle / Wirkung von Form, Farbe, Bewegung, ...

� Interaktions-Design:Metaphern, z.B. Desktop, Drag&Drop, Point&Click, Gummiband, ...

SS 200110Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

Interaktion

� Schlüsselelement fürGraphischeBenutzungsoberflächen

� WIMP-SchnittstellenWindowsIcons MenuesPointing Devices

� Basis der Werkzeug-Metapher

Sutherland’s Sketchpad (1963)

Engelbart’s Mouse (1963-64)

SS 200111Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

Terminologie Animation(1) Animation bezeichnet die Gesamtheit der

Methoden zur Erzeugung synthetischer Bewegtbilder

(2) Animation nennt man ein vermittels (1) erzeugtes Produkt (auf Bewegtbildmedien)

Ursprünge: animus: Lufthauch, Atemanimos: belebenανεµοσ (anemos): Wind, Atem

Zeitvariante Computer Graphik

Animation und Videocomputing

Animation� Gesamtheit der Methoden

zur Erzeugung synthetischer Bewegtbilder

� Animationssystem realisiert die Animationspipeline

� die Methoden, die zur Belebung einer Szene dienen: auf allen Ebenen!

� die erzeugten Produkte

Videocomputing� Erzeugung, Bearbeitung,

Speicherung, Übertragung von digitalem Video

� klassischer Schnitt und Effekte

� moderner Schnitt (nichtlinear)

� Morphing, ...

Basistechnologien der modernen GDV

SS 200113Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

Multimedia

Zu viele Definitionen:

Interaktion macht den Unterschied!Ivan Sutherland (1965)

„The screen is a window through which one sees a virtual world. The challenge is to make that world look real, act real, sound real, feel real”

MM >TextBildGraphikTonVideo

Σ

SS 200114Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

Virtual Reality (VR)

� (Jaron Lanier, 1987) geht zurück auf� Artifical Reality

von Myron Krueger, 1982 als Buchtitel

heute zunehmend benutzt� Virtual Environments

Hauptziel: Immersion (Vermittlung des Gefühls, Teil des Geschehens zu sein – eingetaucht zu sein)

Eingabegeräte: Handschuh, 3D-Mouse, ...Ausgabegeräte: Head Mounted Display, Walls, Caves

SS 200115© Prof. Dr.-Ing. Detlef Krömker

Visualisierung(Daten und Informationen)

� “making visible, especially to one’s mind (thingnot visible to the eye)”

� “forming a mental image of something (thing notpresent to the sight, an abstraction, etc.)”

� the use of computers or techniques for comprehending data or to extract knowledge from the results of simulations, computations, or measurements

Mc Cormick, De Fanti, Brown

SS 200116© Prof. Dr.-Ing. Detlef Krömker

Prinzipien

Abbildung von Daten / Informationen �Wahrnehmungsprimitive

� Form 2D oder 3D� Farbe max. 2 unabhängige Werte !!!� Textur zwischen 2 und 5 � Zeit 1

Achtung - Wahrnehmung der Primitive ist nicht unabhängig voneinander

- oft Redundanz zu empfehlen

SS 200117© Prof. Dr.-Ing. Detlef Krömker

Das Visualisierungsproblem

8 1E-09 0,39269908 0,78539816 1,17809725 1,57079633 1,96349541-6,28318531 -3,8998E-17 -3,8003E-17 -3,511E-17 -3,0583E-17 -2,4827E-17 -1,835E-17-5,89048623 -0,06496636 -0,06330941 -0,05849027 -0,05094748 -0,04135887 -0,03056849-5,49778714 -0,12861662 -0,1253363 -0,11579564 -0,10086286 -0,08187988 -0,06051772-5,10508806 -0,1809723 -0,17635667 -0,16293232 -0,14192089 -0,11521054 -0,08515253-4,71238898 -0,21220659 -0,20679434 -0,19105306 -0,16641523 -0,13509491 -0,09984914-4,3196899 -0,21387636 -0,20842152 -0,19255637 -0,16772468 -0,13615792 -0,10063481

-3,92699082 -0,18006326 -0,17547081 -0,16211389 -0,14120801 -0,11463183 -0,0847248-3,53429174 -0,10827726 -0,10551569 -0,09748379 -0,08491247 -0,06893145 -0,05094748-3,14159265 7,4579E-16 7,2677E-16 6,7144E-16 5,8486E-16 4,7478E-16 3,5091E-16-2,74889357 0,13921362 0,13566303 0,1253363 0,10917317 0,08862614 0,0655039-2,35619449 0,30010544 0,29245136 0,27018982 0,23534668 0,19105306 0,14120801-1,96349541 0,47052798 0,45852733 0,42362402 0,3689943 0,29954742 0,22139658-1,57079633 0,63661977 0,62038301 0,57315917 0,49924569 0,40528473 0,29954742-1,17809725 0,7842133 0,76421222 0,70604003 0,61499051 0,49924569 0,3689943-0,78539816 0,90031632 0,87735407 0,81056947 0,70604003 0,57315917 0,42362402-0,39269908 0,97449536 0,9496412 0,87735407 0,76421222 0,62038301 0,458527332,2204E-15 1 0,97449536 0,90031632 0,7842133 0,63661977 0,470527980,39269908 0,97449536 0,9496412 0,87735407 0,76421222 0,62038301 0,458527330,78539816 0,90031632 0,87735407 0,81056947 0,70604003 0,57315917 0,423624021,17809725 0,7842133 0,76421222 0,70604003 0,61499051 0,49924569 0,36899431,57079633 0,63661977 0,62038301 0,57315917 0,49924569 0,40528473 0,299547421,96349541 0,47052798 0,45852733 0,42362402 0,3689943 0,29954742 0,221396582,35619449 0,30010544 0,29245136 0,27018982 0,23534668 0,19105306 0,14120801

SS 200118© Prof. Dr.-Ing. Detlef Krömker

Was ist dies?

0,000000001 -6,283185307-5,890486225-5,497787144-5,105088062-4,71238898-4,319689899-3,926990817-3,534291735-3,141592654-2,748893572-2,35619449-1,963495408-1,570796327-1,178097245-0,785398163-0,3926990822,22045E-150,3926990820,7853981631,178097245

SS 200119© Prof. Dr.-Ing. Detlef Krömker

oder dies?

-0,4

-0,2

0

0,2

0,4

0,6

0,8

1

-6,2

8318

53

-5,1

0508

81

-3,9

2699

08

-2,7

4889

36

-1,5

7079

63

-0,3

9269

91

0,78

5398

2

1,96

3495

4

3,14

1592

7

4,31

9689

9

5,49

7787

1

6,67

5884

4

7,85

3981

6

9,03

2078

9

10,2

1017

6

11,3

8827

3

12,5

6637

1

0,0000000010,3926990830,7853981641,1780972461,5707963281,9634954092,3561944912,7488935733,1415926553,5342917363,9269908184,31968994,7123889815,1050880635,4977871455,8904862266,2831853086,675884397,0685834727,461282553

SS 200120© Prof. Dr.-Ing. Detlef Krömker

Die 2D-sinc Funktion

-6,2

83-4

,712

-3,1

42-1

,571

0,00

01,

571

3,14

24,

712

6,28

37,

854

9,42

510

,996

12,5

66

0,0001,963

3,9275,890

7,854-0,3-0,2-0,1

00,10,20,30,40,50,60,70,80,9

10,9-10,8-0,90,7-0,80,6-0,70,5-0,60,4-0,50,3-0,40,2-0,30,1-0,20-0,1-0,1-0-0,2--0,1-0,3--0,2

SS 200121Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

3. Die fachliche Breite der CG

� Hardware und Systeme� Psychophysik des Visuellen Systems und

Bildwahrnehmung: Form, Farbe, Bewegung, ...� Geometrische Probleme, numerische Probleme� physikalische Modellbildung,

z.B. Licht-Materie-Interaktion� algorithmische Probleme und Optimierungen� Systemtheorie� Design- und Gestaltungsfragen, ... � Softwareergonomie, SW-Engineering, ...

SS 200122Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

Entwicklung der Gerätetechnik war entwscheidend für die Verbreitung graphischer Systeme:

4. Geschichtlicher Überblick zur CGErste Schritte bis 1965

50er

1959

1961

1961

Kathodenstrahlröhre wird zur Bildausgabe unter Computersteuerung eingesetzt: OszilloskopKalligraphische (Vektor-) Displays = (x,y)-Schreiber

Lichtgriffel um Punkte auf dem Bildschirm anzusprechenErstes computergestütztes Zeichensystem DAC-1 (Design

Augmented by Computers) bei General Motors /IBMSketchpad-System (Sutherland, PhD 1963 )

Datenstrukturen / BildhierarchienBildkomposition aus graphischen StandardelementenInteraktionstechniken (Tastatur, Lichtgriffel)

Steve Russel (MIT) entwickelte erstes video game,Spacewar auf einer DEC PDP-1

SS 200123Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

Sturm und Drang1965 - 1975

1969

1971

19711970 – 1975

1974

Alan Kay (Xerox Parc) entwickelt die Methafer des graphischen User Interfaces ���� Apple (Lisa, MAC, …)

Bézierkurven (Bézier) werden bei Renault eingesetzt, CAD-Systeme

Erstes RasterdisplayGINO (van Dam) Geräteunabhängiges Ein-Ausgabesystem

(Logische Ein-Ausgabegeräte, normalisierte Gerätekoordinaten)

Seillac 1 und Seillac 2 WorkshopBasis für Internationale Normen (Standards):

(CORE 1977), GKS 1985, PHIGS 1989, CGI, … )

„Hunger„ von Peter Foldes : Erster voll animierter Film mit Hilfe vonComputer Techniken( Interpolation und Inbetweening). Die erste Morphing Technik

SS 200124Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

HardwareentwicklungSchlüsseltechnologie

Mitte 70er

Ende 70er

Anfang 80er

Raster-Displays werden als Textterminal eingesetzt, damit auch Blockgraphik möglich

CRT-Controller (Bildspeicher auslesen und auf den Schirm ausgeben)

Hardwareunterstützung von 2D-Operationen BitBLT

Weitere Details siehe Doc Computer Graphics History

SS 200125Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

CG - Beispiele

� Movies� Movies

SS 200126Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

5. Ziele: Hauptvorlesung Graphische Datenverarbeitung

� Vermittlung der Grundlagen � Basis für weiterführende Themen der

Graphischen Datenverarbeitung � Visualisierung� Animation, Virtual Environments, Multimedia.

� Movies

SS 200127Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

6. Themenübersicht zur Hauptvorlesung Graphische

Datenverarbeitung Prolog und Einführung

1. Grundlagen des digitalen Bildes2. Bildwahrnehmung3. Farbmetrik und Farbrepräsentationen4. Graphische Systeme 5. Grundlagen Geometrischer

Transformationen6. Klipping

SS 200128Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

Themenübersicht zur Vorlesung Graphische Datenverarbeitung

7. Visibilitätsrechnung8. Rastern9. Shading10.Beleuchtungsrechnung11.Texturen12.Ray Tracing und Radiosity13. Elemente der Bildverarbeitung14.Ausblick

SS 200129Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

7. Literatur, Unterlagen zur Vorlesung, Bücher, Weitere Quellen

� Folien auf WWW Server www.agc.fhg.de� in ca. 2 Wochen (fast ) vollständig

Ergänzungen Zug um Zug� ggf. Folien aus SS 2000 benutzen

Lehrbücher� Foley, James D et.al : Introduction to Computer

Graphics, ADDISON WESLEY LONGMAN� Watt, Alan: 3D Computer Graphics, ADDISON

WESLEY LONGMAN

SS 200130Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

Weitere Lehrbücher

� Encarnacao, Strasser, Klein: Graphische Datenverarbeitung I+II, Oldenbourg

� Möller, Haines: Real-Time RenderingAK Peters Ltd.

� Schuhmann, Müller: VisualisierungSpringer 2000

SS 200131Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

8. Computergraphik an der Goethe-Uni Hauptstudium

GDV4V+2Ü

GDV-E2V+1Ü

VIS2V+1Ü

Anim+MM2V+1Ü

PraktikumP4 AG

CGKoll.S

PSSS

WS

Diplomarbeiten

Praktikum oder HIWI im

SS 200132Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

Wo findet man uns?

Prof. Dr.-Ing. Detlef KrömkerVarrentrappstraße 40-42, 2. OG60486 FrankfurtTel. .: 49 (0)69 979 95-0140Email: kroemker@cs.uni-frankfurt.dewww: http://www.agc.fhg.deSprechstunde: Dienstag 13 –15 Uhr

nach VereinbarungSekr. Frau Goinar, Frau Quasten

Fraunhofer-AnwendungszentrumComputergraphik in Chemie und Pharmazie (AGC)

Johann Wolfgang Goethe-UniversitätFachbereich Biologie und InformatikGraphische Datenverarbeitung

Rob

ert-M

ayer

-Stra

ßeVarre

ntra

ppst

raße

SS 200133Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

Wie lernt man CG?

drei Zugänge:Übersicht (Survey) � Vorlesung(alles erscheint einfach ... Aber können Sie es umsetzen,

eigene Lösungen finden?)Algorithmisch � VorlesungDetails, Details, Details, ... Schnelles Vergessen garantiert!

Programmieren, Aufgaben � Übung„I do and I understand“

SS 200134Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

9. GDVÜbung

� Vertiefungen und Übungen zum Vorlesungsstoff 6 Übungsblätter

Basieren auf VRML und JAVA 3D� Hausaufgaben

Fingerübung JAVA-3D ... eine Hausaufgabe� Vorlesung 4 SWS: Mo 10-12, Mi 10-12� Übung 2 SWS: Di 14-16 14-tägig � PT3 (P5, P6)� Beginn: nächste Woche (Intro to VRML)

SS 200135Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

Ergänzungen zurGraphischen Datenverarbeitung

Vertiefung theoretischer und mathematischer Hintergründe:

� 2D Systemtheorie� Aliasing: Diskretisierungs- und

Quantisierungseffekte� Alternative Transformationsverfahren� Parametrische Kurven- und

Flächenrepräsentationen

SS 200136Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

GDV-E

� Vorlesung 2 SWS: Mi 8-12� Übung 1 SWS: Di 16-18 (14-tägig)

� PT3 (P5, P6)

SS 200137Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

Ausblick – WS

� Multimedia, VR und Animation (V2+1Ü)� Visualisierung (V2+1Ü)� Praktikum: Virtuelle Welten ...

SS 200138Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

10. Scheine

(Aktive Beteiligung in der Übung)

� Hausaufgaben schriftlich

� Mündliche Rücksprache nach Vereinbarung am Ende des Semesters / auch ggf. in der vorlesungsfreien Zeit

SS 200139Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

Glossar

Graphische Datenverarbeitung (GDV)Computergraphik (Computergrafik, CG)BildverarbeitungMultimedia (MM)VisualisierungAnimationVirtual Reality (VR)CAD, CAM, CAE, CAx

SS 200140Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

Glossar (2)

Screen DesignBenutzungsschnittstelle (User Interface, UI)BildrepräsentationenAustauschformateApplication Programmers Interface (API)

SS 200141Graphische Datenverarbeitung00. Prolog und Einführung© Prof. Dr.-Ing. Detlef Krömker

Ausblick – Nächste Schritte

� Fundament legen: � Was erzeugen, bearbeiten, speichern,

übertragen wir: BILDER� Repräsentation von Bildern

im Rechner, ...� Austausch, APIs, ...

Prof. Dr.-Ing. Detlef Krömker

Goethe-Universität, FrankfurtGraphische Datenverarbeitung

DANKE

für Ihre Aufmerksamkeit