Example Presentation
A Guide to Creating Memorable Presentations
September 22, 2025
Samantha Monty
Chair for Human-Computer Interaction, University of Würzburg

Application Areas

img/application-areas.jpg

Important Application Areas

  1. Human-Computer Interaction, e.g.,
    • 2D Graphical User Interfaces
    • 3D XR (VR, AR, MR)
  2. Industry & Science
    • CAD/CAM
    • (Scientific) Visualization
  3. Entertainment
    • Computer Games
    • Movies

Observation

  • More exist but most are a combination of the ones specified.
  • Above list is sorted roughly by historical appearance.

Application Areas: Human-Computer Interaction

SKETCHPAD (sutherland:1964aa?)

  • Based on modified oscilloscope.
  • Used input by light pen.
  • Implemented 2D draw application.

Note

  • Also first interactive CAD.
  • Highly influential work.

Application Areas: Human-Computer Interaction Now

Application Areas: CAD Examples Now

CATIA (Dassault Systèmes)

  • Computer Aided Three-Dimensional Interactive Application
  • Model 3D objects and scenes.
  • Create 2D sketches and technical drawings.
  • Off-line and real-time rendering.

VRED (Autodesk)

  • 3D visualization and virtual prototyping.
  • Data processing and optimization.
  • Real-time rendering and interaction.

Application Areas: Movies (here by Pixar)

The Adventures of André and Wally B. (1984)

  • Pixar founded 1979 as part of Lucasfilm Graphics Groups.
  • Bought by Steve Jobs 1986.
  • VP: Edwin Catmull (the one with the Z-Buffering, Texture Mapping and B-Splines)
  • Pixar’s RenderMan still up-to-date.

Application Areas: Movies (here by Pixar)

Toy Story (1995)

  • First computer-generated full movie.
  • Directed by John Lasseter.
  • Renderfarm consisting of 117 Sun SparcStation 20
  • Final took 500 GB on 1.200 CDs.

Application Areas: Movies Now

Avatar (Cameron 2009)

  • Visual Fx lead by Weta Digital
  • 35.000 – 40.000 water-cooled CPUs
  • 105 TB RAM, 2 PB HD
  • Scenes took up to 48h to render.
  • Each minute has 17,3 GB.

Coco (Pixar 2017)

Application Areas: Games

Tennis for Two (Higinbotham 1958)

  • One of the first ever built computer games purely for entertainment.
  • Developed on a Donner Model 30 analog computer at Brookhaven National Laboratory.

Pac-Man (Namco 1980)

  • Developed by Toru Iwatani.
  • Considered one of the classics from the golden age of video arcade games.
  • Initiated uncountable clones.
  • Became a media iconic.

Application Areas: Games Now

Titanic (Epic Games 2017)

  • Demo done with Unreal Engine 4.
  • UE lead developer Tim Sweeny.
  • First engine version 1998.
  • Supports multiple OSs.
  • Modular architecture, see RIS lecture.

The Future of Gaming

  • Outlook on the future of interactive graphics.
  • Samantha Monty

Testing Code

What is wrong with this code?

Example Dog Javascript

let bodhi = 11;
let frieda = 6;

if (bodhi + frieda = 17)
    console.log('ages are correct');
else ()
    console.log('wrong ages');

Free Input

What does PCIe stand for?

  • Peripheral Component Interal Express
  • PCIe
  • Peripheral Con

Databus

What is a databus in computer architecture?

  • A communication system that transfers data between components inside a computer or between computers
  • A port that allows you to connect your mouse
  • A card that processes graphics
  • A system that transfers actions to pixels

Multiple Choice 1 - Fancy

All choices get an optional comment to be potentially shown with the result.

  • a
    So ist das.
    A second tooltip.
  • b
    So nicht.
    Tooltip2
  • c
    So auch nicht

Multiple Choice 2 - Plain

Choices appear in a column. Click the circle to the left of the choice to select. Choices are corrected immediately. A green check will appear in the circle for correct responses, and a red x for incorrect responses. Hover over the circle to see a tooltip. All choices get an optional comment to be potentially shown with the result.

  • a
    So ist das.
    A second tooltip.
  • b
    So nicht.
    Tooltip2
  • c
    So auch nicht

Multiple Choice 3 - Plain, Inline

Choices are displayed in a row.

What is the result of the following term?

\[\begin{equation*} \small \begin{bmatrix} 1&0&0&1\\ 0&1&0&1\\ 0&0&1&0\\ 0&0&0&1 \end{bmatrix} \begin{bmatrix} 0&-1&0&0\\ 1&0&0&0\\ 0&0&1&0\\ 0&0&0&1 \end{bmatrix} \end{equation*}\]

  • \(\tiny \begin{bmatrix} 0&1&0&1\\ -1&0&0&1\\ 0&0&1&0\\ 0&0&0&1 \end{bmatrix}\)
    The rotational part (upper left \(3\times3\)) would not be altered.
  • \(\tiny \begin{bmatrix} 0&-1&0&1\\ 1&0&0&1\\ 0&0&1&0\\ 0&0&0&1 \end{bmatrix}\)
    Yes, that is correct.
  • \(\tiny \begin{bmatrix} 0&-1&0&0\\ 1&0&0&1\\ 0&0&1&0\\ 0&0&0&1 \end{bmatrix}\)
    The translational part (right column) would not be altered.

Multiple Choice 4 - Fancy

What is the result of the following term?

\[\begin{equation*} \small \begin{bmatrix} 1&0&0&1\\ 0&1&0&1\\ 0&0&1&0\\ 0&0&0&1 \end{bmatrix} \begin{bmatrix} 0&-1&0&0\\ 1&0&0&0\\ 0&0&1&0\\ 0&0&0&1 \end{bmatrix} \end{equation*}\]

  • \(\small \begin{bmatrix} 0&1&0&1\\ -1&0&0&1\\ 0&0&1&0\\ 0&0&0&1 \end{bmatrix}\)
    The rotational part (upper left \(3\times3\)) would not be altered.
  • \(\small \begin{bmatrix} 0&-1&0&1\\ 1&0&0&1\\ 0&0&1&0\\ 0&0&0&1 \end{bmatrix}\)
    Yes, that is correct.
  • \(\small \begin{bmatrix} 0&-1&0&0\\ 1&0&0&1\\ 0&0&1&0\\ 0&0&0&1 \end{bmatrix}\)
    The translational part (right column) would not be altered.

Matching 1 - Fancy

\((0, -k\,m, 0)\T\)
\(-k \, \dot{\vec{x}}\)
\(k \, d \, \vec{n}\)
\(m \, \ddot{\vec{x}}\)
\(-k \, \left( \norm{\vec{x}_0 - \vec{x}_1} - L \right) \, \frac{ \vec{x}_0 - \vec{x}_1 }{\norm{\vec{x}_0 - \vec{x}_1}}\)
Gravity
Damping
Collisions
Inertia
Springs

Matching 2 - Plain

Plain matchinq questions display a question/term, followed by a select box and a list of possible answers. Click the select box and then click answers as desired. Check marks will appear. Click outside of the select box to close. Select additional or deselect selected responses as desired. After clicking the solution button, answers will turn green or red to display correctness. Change answers as desired and click solve again.

A grey box surrounds the matching questions and responses to ensure that all are shown. The solution button is below this.

Matching 2 - Plain

Click the drop-down to select the correct answer.

\((0, -k\,m, 0)\T\)
\(-k \, \dot{\vec{x}}\)
\(k \, d \, \vec{n}\)
\(m \, \ddot{\vec{x}}\)
\(-k \, \left( \norm{\vec{x}_0 - \vec{x}_1} - L \right) \, \frac{ \vec{x}_0 - \vec{x}_1 }{\norm{\vec{x}_0 - \vec{x}_1}}\)
Gravity
Damping
Collisions
Inertia
Springs

Matching 3 - Plain

Drag the elements to create correct pairings

drag to A
drag to B
decker
\(\Leftarrow\) C
Distractor A
Distractor B
A
B
decker
C
Empty

Matching 4 - Fancy

drag to A
drag to B
decker
\(\Leftarrow\) C
Distractor A
Distractor B
A
B
decker
C
Empty

Matching 5 - Plain

Geben Sie jeweils die verwendete, unter Umständen zusammengesetzte, Transformation für diese 5 Quadrate an.

Rz(180)
Sxy(1, -1)
Sxy(3, 3)
Sxy(0.5, 0.5) Txy(0.5, 0.5)
Rz(-45)Txy(0.5, 0.5)
Sxy(-1,1)
Sxy(0.3, 0.3)
Sxy(-1,1) Txy(0.5, 0.5)
Rz(45)
Bild 1
Bild 2
Bild 3
Bild 4
Bild 5
Bild 6

Blanktext/Inserting MC

Like multiple-choice, however, the choices are shown as drop-down lists embedded inside the text. Hence, beware of the whitespaces below.

Insert 1 - Fancy

Decker is a software built using
  • Scala
    Unfortunately not.
    A second tooltip.
  • Haskell
    Due to Pandoc.
  • Java
    Surely not.
  • Ruby
    hm no
and builds upon the tool
  • Pandoc
    See previous tooltip.
    A second tooltip.
  • PowerPoint
.

Insert 2 - Plain

Questions are corrected immediately, displaying red or green based on correctness. Retry is allowed. Hover over the select box to display the tooltip below the question.

Decker is a software built using
  • Scala
    Unfortunately not.
    A second tooltip.
  • Haskell
    Due to Pandoc.
  • Java
    Surely not.
  • Ruby
    hm no
and builds upon the tool
  • Pandoc
    See previous tooltip.
  • PowerPoint
.

Free Text

These questions now include multiple versions of correct answers with additional optional comments (as before). Hence the Syntax is slightly different in its compact representation.

Free Text 1 - Fancy

Das Ergebnis von \(2*2=~?\) ist?

  • 4
    Die perfekte Lösung
    A second tooltip.
  • vier
    Auch ok
  • four
    Deutscher Studiengang
  • fier
    RTL?

Free Text 2 - Plain

Type the answer and push Enter to correct the question.

What’s the first letter in the alphabet?

  • A
    The modern form of the capital letter A evolved from a the Latin script, a transformation of Greek script, which is in turn a transformation of the Phoenician script.
    A second tooltip.
  • α
  • B
    The letter B isn’t used in any numbers until billion.

What’s the fourth letter?

  • C
    “C” comes from the same letter as “G”. The Semites named it gimel. The sign is possibly adapted from an Egyptian hieroglyph for a staff sling, which may have been the meaning of the name gimel.
  • D
    The letter “D” has retained the fourth place in the alphabet from the earliest point at which it appears in history. It corresponds to Semitic daleth and Greek delta (Δ). The form is thought to derive from an early pictograph, possibly Egyptian, indicating the folding door of a tent.

Free text alternative

This alternate forms allows you to define free-text questions as lists without brackets. All answers are correct.

Free Text Alternative 1 - Fancy

Das Ergebnis von \(2*2=~?\) ist?

  • 4
    Die perfekte Lösung
    A second tooltip.
  • vier
    Auch ok
  • four
    Deutscher Studiengang
  • fier
    RTL, no not really?

Free Text Alternative 2 - Plain

Das Ergebnis von \(2*2=~?\) ist?

  • 4
    Die perfekte Lösung
    A second tooltip.
  • vier
    Auch ok
  • four
    Deutscher Studiengang
  • fier
    RTL, no not really?

fenced divs syntax

Das Ergebnis von \(2*2=~?\) ist?

  • 4
    Die perfekte Lösung
    A second tooltip.
  • vier
    Auch ok
  • four
    Deutscher Studiengang
  • fier
    RTL, no not really?
  • *
    ganz falsch, so oder so?

Decker is a software built using
  • Scala
    Unfortunately not.
    A second tooltip.
  • Haskell
    Due to Pandoc.
  • Java
    Surely not.
  • Ruby
    hm no
and builds upon the tool
  • Pandoc
    See previous tooltip.
  • PowerPoint
.

Multiple Choice 2 - Plain

What is a databus in computer architecture?

  • A communication system that transfers data between components inside a computer or between computers
  • A port that allows you to connect your mouse
  • A card that processes graphics
  • A system that transfers actions to pixels

Testing

A databus is a communication system that transfers data between components inside a computer or between computers

A databus is a communication system that transfers data between components inside a computer or between computers

Databus

What is a databus in computer architecture?

  • A communication system that transfers data between components inside a computer or between computers
  • A port that allows you to connect your mouse
  • A card that processes graphics
  • A system that transfers actions to pixels

Quiz Time

What does PCIe stand for?

Let’s start with a quiz.

  • Peripheral Component Interal Express
  • Peripheral Component Interconnect Express
  • Peripheral Connector of Internal Equipment nector of Internal Equipment