View as presentation
→ Slide 1

Einführung in die Computergrafik und Bildverarbeitung

Dr. Raphael Wimmer

Sommersemester 2025

→ Slide 2

Kurze Vorstellung

→ Slide 3

Konzept

Anstelle einer klassischen Vorlesung mit Übung gibt es:

→ Slide 4

Organisatorisches

→ Slide 5

Leistungsnachweis

→ Slide 6

Materialien

Sie erhalten von mir:

→ Slide 7

Feedback der letzten beiden Male

Aufwendiger Kurs, aber sehr praktisch weswegen es auch Spaß macht und die Zeit die man dafür aufwendet auch schnell verfliegt.
Interessante Vorlesung, die mir neue Themen und Anwendungsmöglichkeiten beigebracht hat. Die Einführungen in die OpenGL und OpenCV waren spannend und mir davor nur vom hören bekannt. Die Studienleistungen ließen sich auch gut bearbeiten. Waren am Anfang etwas überfordernd (da es bei mir kaum/kein Vorwissen gab), aber ließen sich meistens doch ganz gut durcharbeiten.
Sehr interessante Vorlesung, die viel praktisches Wissen mit sich bringt
Sehr interessant, aber man muss am Ball bleiben
Die Studienleistungen waren sehr interessant und anspruchsvoll, haben aber auch Spaß gemacht. Hab mir teilweise etwas schwer getan, auch weil mir die Erfahrung mit Python gefehlt hat. [...] Ansonsten sehr interessante und coole Veranstaltung, bei der man auch viel selber herumprobieren durfte (v.a. bei Studienleistungen) und gut erklärte Beispiele bekommen hat.
→ Slide 8

Zeitplan

↓ Slide 9

29. April 2025 - Einführung, Überblick

Klassische frontale Vorlesung zum Einstieg.

Themen heute:

Danach eine Übung mit:

↓ Slide 10

Ausblick: 6. Mai 2025 - Wiederholung Grundlagen, Praxis Rastergrafik

→ Slide 11

Wichtige Veranstaltungen diese Woche

→ Slide 12

Advance Organizer

(kommt noch)

→ Slide 13

Einführung Python

Material:

↓ Slide 14

Voraussetzungen für Teilnahme am nächsten Termin

→ Slide 15

GraphIT

https://graphit.ur.de/wiki/Courses/CGBV_25SS

↓ Slide 16

Graph heute

→ Slide 17

Überblick: 6. Mai 2025 - Wiederholung Grundlagen, Praxis Rastergrafik

↓ Slide 18

Graph heute

→ Slide 19

PATH

→ Slide 20

Python IDEs

→ Slide 21

PEP 8 - Style Guide für Python

→ Slide 22

Paketmanagement in Python

Es gibt drei verbreitete Möglichkeiten, Python-Module zu installieren:

Um für jede Anwendung separate Module zu installieren: virtual environments

↓ Slide 23

Paketmanagement durch Betriebssystem

↓ Slide 24

Paketmanagement mit pip

↓ Slide 25

Paketmanagement mit conda

↓ Slide 26

Virtual Environments

↓ Slide 27

uv - die eierlegende Wollmilchsau

→ Slide 28

13. Mai 2025 - Bildfilter, Studienleistung 1

↓ Slide 29

Unser Graph heute

↓ Slide 30

Wiederholung: Bildfilter

→ Slide 31

Studienleistung 1: Bitmap-Grafik (1)

Entwickeln Sie eine Anwendung filtertool, mit der man (destruktiv) Bilder bearbeiten kann. Bilder liegen als RGB- oder Graustufenbild vor und können mit Pillow eingelesen und geschrieben werden. Ansonsten sollen alle Bildoperationen selbst geschrieben werden.

Abgabe: Mi, 28. Mai 2025, 23:59 Uhr (5 Bonuspunkte - pro angefangener weiterer Woche 1 Punkt weniger)

→ Slide 32

Studienleistung 1: Bitmap-Grafik (2)

Verpflichtende Features:

→ Slide 33

Studienleistung 1: Bitmap-Grafik (3)

Wahlpflichtfeatures (3 Features):

→ Slide 34

Studienleistung 1: Bitmap-Grafik (4)

→ Slide 35

Aufgaben bis zum nächsten Mal

→ Slide 36

20. Mai 2025 - Image Filters, Tk-GUIs

↓ Slide 37

Überblick

↓ Slide 38

Kommandozeilenparameter parsen

python3 app.py --mode simple -a file.txt

Mehrere Möglichkeiten in Python:

↓ Slide 39

Posterize

↓ Slide 40

Blending / Mixing

→ Slide 41

3. Juni 2025 - Fragen zur Studienleistung 1, Vektorgrafik

↓ Slide 42

Aufgaben bis zum nächsten Mal

→ Slide 43

Studienleistung 2: Vektor-Grafik

↓ Slide 44

Aufgabenstellung

Entwickeln Sie eine Zeichenanwendung mini-draw, mit der man Vektorgrafiken erstellen und bearbeiten kann. Die Funktionsweise soll gängigen Vektorgrafikprogrammen wie z.B. Inkscape ähneln. Die Anwendung soll einen tkinter.Canvas verwenden, in dem über die create_rect()-Methode einzelne Pixel gesetzt werden. Alle weiteren Zeichenoperationen sollen auf dieser Basis implementiert werden. Abgabe: Mi, 25.6. 2025 (5 Bonuspunkte - pro angefangener weiterer Woche 1 Punkt weniger)

↓ Slide 45

Verpflichtende Features

(Wenn nichts vorgegeben ist, einfach eine sinnvolle Lösung wählen)

↓ Slide 46

Wahlpflichtfeatures (3 Features)

→ Slide 47

17. Juni 2025 - Vektorgrafik 2

↓ Slide 48

Themen heute

↓ Slide 49

Signed Distance Functions

  • Kombination von individuellen SDFs über Boolsche Operationen:
  • siehe Jupyter Notebook in GRIPS
    • ↓ Slide 50

    Computational Geometry

    ↓ Slide 51

    Übung: Bibliotheken für Computational Geometry (entfällt)

    Eure Aufgabe: wählt eine der drei Python-Bibliotheken und erstellt ein Jupyter Notebook, das folgende Features demonstriert:

    → Slide 52

    24. Juni 2025 - Einführung 3D-Grafik, Szenengraphen

    ↓ Slide 53

    Themen heute

    ↓ Slide 54

    Rückblick Grundlagen 3D-Grafik

    ↓ Slide 55

    Eine simple 3D-Engine

    → Slide 56

    1. Juli 2025 - OpenGL, GLSL, ShaderToy

    ↓ Slide 57

    Themen heute

    ↓ Slide 58

    OpenGL

    ↓ Slide 59

    Immediate Mode vs. Retained Mode

    ↓ Slide 60

    OpenGL Basics

    ↓ Slide 61

    Beispiel: Immediate Mode

    glClear(GL_COLOR_BUFFER_BIT)
glColor3f(1.0, 1.0, 1.0)
glLoadIdentity()
gluLookAt(0.0, 0.0, 5.0, 0.0, 0.0, 0.0, 0.0, 1.0, 0.0)
glScalef(1.0, 2.0, 1.0)
glRotatef(45, 0, 1, 0)
glBegin(GL_QUADS)
glVertex3f(0.0, 0.0, 0.0)
glVertex3f(0.0, 1.0, 0.0)
glVertex3f(0.0, 1.0, 1.0)
glVertex3f(0.0, 0.0, 1.0)
glEnd()
glFlush()
    ↓ Slide 62

    Hands-On: OpenGL zum Laufen bringen

    → Jupyter-Notebook simple_cube_immediate_mode.ipynb

    ↓ Slide 63

    Recap: Signed Distance Functions

    ↓ Slide 64

    GLSL

    ↓ Slide 65

    ShaderToy

    ↓ Slide 66

    Fragment Shaders

    ↓ Slide 67

    Vertex Shaders

    ↓ Slide 68

    Geometry Shaders

    ↓ Slide 69

    Eure Aufgaben

    ↓ Slide 70

    Beispiele Shading in GLSL

    ↓ Slide 71

    Shaders in PyOpenGL

    gemeinsame Analyse von https://github.com/nvalis/DemoTool/

    ↓ Slide 72
    → Slide 73

    Studienleistung 3: 3D-Grafik

    ↓ Slide 74

    Regeln

    ↓ Slide 75

    Aufgabe 3a: 3D-Welt

    Entwickeln Sie eine Anwendung, die eine 3D-Welt basierend auf Meshes darstellt. Sie können zur Implementierung den OpenGL Immediate Mode oder das DemoTool verwenden.

    Verpflichtende Features

    Wahlpflichtfeatures (3 Features)

    ↓ Slide 76

    Aufgabe 3b: WebGL / ShaderToy

    Entwickeln Sie einen Shader in ShaderToy, der eine hübsche Animation erzeugt

    Verpflichtende Features:

    Wahlpflichtfeatures: keine

    ↓ Slide 77

    Aufgabe 3c: Raytracer (entfällt)

    → Slide 78

    Computer Vision 1: Grundlagen, OpenCV

    ↓ Slide 79

    Überblick

    Siehe separaten Foliensatz und Notebooks in GRIPS

    → Slide 80

    Wrap-Up, Klausur, SL 4

    ↓ Slide 81

    Themen heute

    ↓ Slide 82

    Zusammenfassung CGBV

    (interaktiv)

    ↓ Slide 83

    Klausur

    ↓ Slide 84

    Notwendige Python-Module

    Bitte vorher installieren:

    (Aufgaben zur 3D-Grafik werden keine 3D-Beschleunigung benötigen. Sie erhalten vorab ein Test-Notebook, um die Funktionalität zu prüfen.)

    ↓ Slide 85
    → Slide 86

    Studienleistung 4: Computer-Vision

    ↓ Slide 87

    Aufgabenstellung (1)

    Entwickeln Sie eine Anwendung, die in einem Bild vorhandene Objekte identifiziert und Informationen dazu anzeigt.

    Abgabe: Mo, 4. August 2024 (5 Bonuspunkte, Nachträgliche Abgabe bis zur Bewertung der Klausur möglich).

    Zur Entwicklung der Anwendung gibt es mehrere Testbilder, für die die Anwendung optimiert werden soll. Sie soll aber auch für ähnliche Bilder funktionieren. Die Anwendung soll das eingelesene Bild anzeigen und alle zu zeigenden Informationen als Overlay im Bild markieren bzw. Text darüberlegen.

    ↓ Slide 88

    Aufgabenstellung (2)

    Verpflichtende Features:

    ↓ Slide 89

    Aufgabenstellung (3)

    Wahlpflichtfeatures (3 Features):

    ↓ Slide 90

    Regeln