Compare commits

...

22 Commits

Author SHA1 Message Date
Romane b82629a890 empty commit
Build marp presentation / build marp presentation (push) Successful in 21s
2026-06-24 18:07:40 +02:00
Romane 8d0fc29712 spellcheck
Build marp presentation / build marp presentation (push) Successful in 19s
2026-06-24 18:05:07 +02:00
Romane 17e7ff4138 add use disclusure as per instructions
Build marp presentation / build marp presentation (push) Successful in 34s
2026-06-24 18:04:30 +02:00
Romane d023962bc4 end title
Build marp presentation / build marp presentation (push) Successful in 17s
2026-06-24 09:27:51 +02:00
Romane 767d2baa87 slash
Build marp presentation / build marp presentation (push) Successful in 24s
2026-06-24 09:25:00 +02:00
Romane f25f818e72 title formats, broken lnks
Build marp presentation / build marp presentation (push) Successful in 17s
2026-06-24 09:12:57 +02:00
Romane a451506543 commit last
Build marp presentation / build marp presentation (push) Successful in 18s
2026-06-24 09:08:08 +02:00
Romane 1fb895d3f2 quotes
Build marp presentation / build marp presentation (push) Successful in 18s
2026-06-24 08:49:04 +02:00
Romane a977f950d6 sources
Build marp presentation / build marp presentation (push) Successful in 19s
2026-06-24 08:47:42 +02:00
Romane a31dbdec2a wrap up content somewhat
Build marp presentation / build marp presentation (push) Successful in 24s
2026-06-24 08:21:38 +02:00
Romane 6cf5befe9d changes
Build marp presentation / build marp presentation (push) Successful in 45s
2026-06-18 14:06:12 +02:00
Romane da0adbdf3e progress
Build marp presentation / build marp presentation (push) Successful in 41s
2026-06-12 22:01:42 +02:00
Romane 839add7809 adding first progress
Build marp presentation / build marp presentation (push) Successful in 58s
2026-06-12 15:04:14 +02:00
Romane 320d7ac7f3 it's push to prod tuesday!!! (last commit i think) 2026-05-26 15:07:15 +02:00
Romane b07eef79e8 some more progress 2026-05-26 08:03:56 +02:00
Romane 3fd3943133 update images 2026-05-25 23:25:54 +02:00
Romane e31388f601 fix typos 2026-05-21 13:21:37 +02:00
Romane e9215b634b done for the evening 2026-05-21 01:11:17 +02:00
Romane 6a320569bd progress intermediary ci/cd render 2026-05-21 00:26:17 +02:00
Romane 99f628a12d progress 2026-05-20 13:12:30 +02:00
Romane 68555de14c progress 2026-05-20 10:03:58 +02:00
Romane 054f56105e 2026-05-18 progress 2026-05-18 17:50:43 +02:00
21 changed files with 154 additions and 211 deletions
+1 -1
View File
@@ -26,7 +26,7 @@ jobs:
- name: upload to pages
run: |
curl -X PUT --fail \
https://pages.ct.cozytren.ch/sti-presentation \
https://pages.ct.cozytren.ch/m1s2-eng-presentation \
-T ./presentation.zip \
-H "Content-Type: application/zip" \
-H "Authorization: Pages ${{ secrets.GIT_PAGES_TOKEN }}"
+13
View File
@@ -0,0 +1,13 @@
# EN-Presentation
Uhhhhhh this is awkward - guess you can now see the "behind the scenes" of this *magnificent* presentation
## Links
- HTML: https://pages.ct.cozytren.ch/m1s2-eng-presentation
- PDF: https://pages.ct.cozytren.ch/m1s2-eng-presentation/presentation.pdf
## Toolchain
- Marp ecosystem for markdown presentation rendering
- MarpX for custom parsing logic + custom themes
- Gitea actions auto render & upload pipeline
BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 72 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 44 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 157 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 90 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 30 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 570 B

After

Width:  |  Height:  |  Size: 365 B

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 115 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 216 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 30 KiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 138 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 570 B

After

Width:  |  Height:  |  Size: 561 B

BIN
View File
Binary file not shown.

Before

Width:  |  Height:  |  Size: 157 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 571 B

After

Width:  |  Height:  |  Size: 565 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 72 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.6 MiB

BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 MiB

-3
View File
@@ -1,3 +0,0 @@
original video: https://www.youtube.com/watch?v=1l0wKk6q_ss
ffmpeg command to convert to gif: ffmpeg -ss START_TIME -to END_TIME -i input_video.mp4 -vf "fps=10,scale=320:-1:flags=lanczos" output.gif
BIN
View File
Binary file not shown.

After

Width:  |  Height:  |  Size: 101 KiB

+140 -207
View File
@@ -1,14 +1,11 @@
---
title: "Shifty: A Weight-Shifting Dynamic Passive Haptic Proxy
to Enhance Object Perception in Virtual Reality"
title: "Privacy by design: DIY Marp(X) AI presentations without sending data to third parties"
author: R.Viton
description: "Shifty: A Weight-Shifting Dynamic Passive Haptic Proxy
to Enhance Object Perception in Virtual Reality"
description: "Privacy by design: DIY Marp(X) AI presentations without sending data to third parties"
keywords: []
header: "Shifty: A Weight-Shifting Dynamic Passive Haptic Proxy
to Enhance Object Perception in Virtual Reality"
footer: "2026-05-26"
header: "Privacy by design: DIY Marp(X) AI presentations without sending data to third parties"
footer: "2026-06-24"
marp: true
theme: gödel
@@ -19,259 +16,195 @@ size: 16:9
lang: de
math: katex
---
<style>
.inline-img {
display: flex;
align-items: center;
gap: .5rem;
}
</style>
<!-- _class: "title-academic" -->
![bg left:35% 100%](https://placecats.com/500/900)
<div class="title">Shifty: A Weight-Shifting Dynamic Passive Haptic Proxy
to Enhance Object Perception in Virtual Reality</div>
<div class="subtitle">Präsentation zum Paper von <i>A. Zenner</i> und <i>A. Krüger</i> (2017)</div>
<div class="author">Romane Viton</div>
<div class="date">2026-05-26</div>
<div class="organization">DFI-STI, htw saar</div>
---
# Fragerunde
![bg right:35% 100%](https://placecats.com/500/900)
* Wer hat schon VR getestet?
* Wie immersiv war die Erfahrung?
* Gab es haptisches Feedback?
* Wenn ja: wie wurde das implementiert?
---
# Was ist **haptisches Feedback** ?
* Nutzer:innen bekommen eine **taktile Rückmeldung**
* Kann **Immersion** weiter als "nur hören oder sehen" treiben
* Informationen können sehr **unterschiedlich** sein (Vibration, Textur, Kraft, Wärme, ...)
* Beispiel: <box>Erzeugung von **Kräften** zur Simulation von Gewichten und Längen
---
# Nutzung der **Visual Dominance**
* **Alle Sinne** tragen zur gelebten Erfahrung bei einer Simulation bei
* Bei Konflikten hat die **Sicht** bei der Informationsverarbeitung **Vorrang** [TODO CITE]
* Bedeutung für VR: <h3><box>Für eine realistische Wahrnehmung muss **nicht die gesamte Kraft** erzeugt <br> werden, sondern nur genug, um die **Sicht** zu **unterstützen**
---
# **Hintergrund** des Papers
* *Passive Haptic Feedback* (PHF): günstig und mobil, nicht sehr realistisch
* *Active Haptic Feedback* (AHF): realistischer, weder günstig noch mobil
* $\implies$ ***Dynamic Passive Haptic Feedback* (DPHF)** als Mittelweg testen ?
* ### <box> 💡 Idee: Bewegung soll **kein direktes Feedback** sein, sondern den Controller so ändern, dass er **mehrere Gegenstände** darstellt
---
# **Hintergrund** des Papers
![center w:10000](./images/haptics-continuum.png)
---
# **Shifty** als DPHF-Versuch
### Ziel: Gewicht nach oben bzw. unten bringen, um mehr bzw. weniger Kraft zu brauchen, um gehoben zu werden
&nbsp;
<div class="multicolumn" align="center"><div>
![](./images/shifty-schema.png)
</div><div>
Eigenschaft | Wert
--------------------:|:-------------------
Masse | 440 g
Internes Gewicht | 127 g
Länge | 505 mm
Diameter | 40 mm
Nutzer-Input-Methode | Push-Button
Steuerungsmethode | Arduino in Rucksack
</div></div>
---
<!-- _class: chapter -->
# Experiment 1
## <br>Kann eine Simulation mit Shifty überhaupt funktionieren ? <br>(bzgl. **<box>Realismus**, **<box>Anstrengung** und **<box>Spaß**)
---
# **Teilnehmer:innen** des Experiments
<div align="center">
### Eigenschaften der $N = 12$ Teilnehmenden (Experiment 1)
Eigenschaft | Aufteilung
-----------------------------------:|:---------------------------------------------------
Geschlecht | 7 männlich, 5 weiblich
Alter | Min: 21, Max: 37, Mittelwert: 28 Jahre
Brillen/Kontaktlinsen in der Studie | 5 mit, 7 ohne
Rechts- bzw. Linkshändige | 9 Rechts-, 3 Linkshändige
Erfahrung mit 3D-Spielen | Min: 1, Max: 7, Mittelwert: 3,5 (Skala von 1 bis 7)
Erfahrung mit VR | Min: 1, Max: 3, Mittelwert: 1,6 (Skala von 1 bis 7)
![bg left:35% 250%](./images/title.jpg)
<div class="title">Privacy by design: DIY Marp(X) AI presentations without sending data to third parties</div>
<div class="subtitle">
... and why you should use them too!
</div>
<div class="author">Romane Viton</div>
<div class="date">2026-06-24</div>
<div class="organization">DFI-203, htw saar</div>
---
# Durchgeführte **Experimente**
<div class="multicolumn"><div>
## Umgebung
- Teilnehmer:innen über Aufgaben informiert
- Labor-Umgebung mit *HTC Vive* und Kopfhörern
- Optische Überwachung des Verhaltens
&nbsp;
&nbsp;
</div><div>
![bg right:50% 100%](./images/rahmen.png)
</div></div>
# **Contents**
1. Markdown / Writing presentations
2. Collaboration
3. Deploying / Keeping your data safe
4. Integrating LLMs
5. Evaluation / Tips
---
# Experiment 1: **kontinuierliche Änderung der Länge bzw. Dicke**
<div class="multicolumn"><div>
![w:800](./images/length-change.png)
</div><div>
&nbsp;
- Freie Bewegung innerhalb der Umgebung
- Mit virtuellem Teleskop in der Hand
- 1\. Phase mit Bewegung des Gewichts (DPHF)
- 2\. Phase ohne Bewegung des Gewichts (PHF)
- Reihenfolge der 1. und 2. Phase zufällig
- <box></box>- und <box></box>-Props in der Umgebung,
um Länge und Dicke linear zu ändern
</div></div>
# A few **questions** first
* Who here would consider themselves a **developer** ?
* Experience with **code editors / IDEs** ?
* **More comfortable** with editor than with other software ?
* Does **text** just feel faster/more efficient at this point?
---
<!-- _class: quote -->
# Erwartungen der Autoren
# <div class="inline-img"> ![w:100](./images/md.png) &nbsp; **Markdown**
## (It's everywhere - you've most likely dealt with it at least once)
```md
# Main title
## Heading 2 - You can make:
"We expect *Shifty* to outperform [PHF] in the subjective measures **realism and fun**, but **not in exertion**."
&nbsp;
*Stimmt das aber wirklich?* 🤔
- *italic text*
- **bold text**
- ~~strikethrough~~
- lists
- [links](http://example.com)
- ![images](image_name_here)
- > Quotes
```
---
# Experiment 1: **Ergebnisse**
![center w:1000](./images/exp1results.png)
<!-- In allen Fällen wurde DPHF besser als PHF bewertet, was die Erwartungen übertroffen hat. -->
</center></div></div>
# Why not write **presentations** as text ?
## <div class="inline-img"> Introducing:&nbsp;![h:75](./images/marp.png) (Yuki Hattori)
* Markdown presentation ecosystem
* <span class="inline-img"> Comes as a ![h:75](./images/bash.png) command line tool or a ![h:75](./images/vscode.png) VSCode editor extension
* Technically Just A Web Page:tm: $\implies$ can write HTML/CSS if you want to customize
* MarpX (Paolo Cunha) offers high quality ready-to-use themes
* If you know Markdown/HTML/CSS: <box>No need to learn (yet another) tool!
---
<!-- _class: chapter -->
# Experiment 2
## <br>Das Gewicht bewegt sich aber langsam ! <br><br> Kann man trotzdem (realistisch) schwere Objekte heben ?
# **Collaborating** with others / keeping track of **versions** ?
> ## "Well surely the editor can't do ***that*** ", I hear you say
* All the presentations are **text-based** versions of a file tree
* We need a tool to maintain **versions** of a text-based file tree...
* <span class="inline-img"> Ever heard of ![w:100](./images/git.png) `git`?
* We already have a **tool** to collaborate on versions of text-based projects!
---
# **Teilnehmer:innen** des Experiments
# How do we make sure data is **safe** from big companies?
- There *are* online platforms like GitHub for this (but: this defeats the whole purpose)
- It's 2026, and servers are pretty cheap
- You can set up your own infrastructure in an afternoon
- (less than 100 lines of `docker-compose.yml`)
---
# One step further: hosting services on your **own infrastructure**
- I won't tell you how to set it up (plenty of guides online)
- TL;DR: **<box>On pushing changes $\rightarrow$ Auto-Render and Upload**
- Here are some tools I'm using for my personal setup:
<center>
### Eigenschaften der $N = 12$ Teilnehmenden (Experiment 2)
Eigenschaft | Aufteilung
-----------------------------------:|:---------------------------------------------------
Geschlecht | 9 männlich, 3 weiblich
Alter | Min: 21, Max: 37, Mittelwert: 27 Jahre
Brillen/Kontaktlinsen in der Studie | 6 mit, 6 ohne
Rechts- bzw. Linkshändige | 10 Rechts-, 2 Linkshändige
Erfahrung mit 3D-Spielen | Mittelwert: 2,9 (Skala von 1 bis 7)
Erfahrung mit VR | Min: 1, Max: 4, Mittelwert: 1,8 (Skala von 1 bis 7)
Requirement | Possible tool
-:|:-
Server|Any VPS will do
Simple software deployment|Docker
HTTPS support|Caddy
Git collaboration|Gitea
Presentation hosting|Git-Pages
Automated deployment|Gitea Actions
</center>
---
# Experiment 2: **Heben von virtuellen Objekten**
# ...isn't this really **expensive**, though?
* Not really!
* Domain name: `~10 EUR/year`
* 24/7 VPS (200GB Storage, 6 vCPUs, 12GB RAM): `6.72 EUR/month`
* Also hosting other services on it and not even at capacity
* I use Contabo, but Hetzner/OVH/Hostinger also work
* *it's all yours, no need to worry about your data being accessed by third parties!*
* Privacy does have a price, but so does exposing your personal data
* **<box>Which one are you willing to pay?**
---
# ...wasn't this supposed to **integrate LLMs** as well?
* It can be done as well!
* Head start when hosting models: `Ollama` (from Ollama Inc.)
* Automatically handles the download and execution of open models locally
* **<box>💡 Works when handling content, since everything is text-based !**
* We can integrate this into our IDE of choice and never have to worry about our data being sent to anyone
---
# **Pros** and **cons** from experience
<div class="multicolumn"><div>
- Würfel verschiedener Größen sollen aus <br>einem Inventar genommen werden
- Nach dem Greifen soll der Würfel in <br>die richtige Lage gebracht werden
- Kombinationen von 6 Varianten werden <br>nach einer *Latin Square Approach* <br>von den Teilnehmenden verglichen
## Pros
- Enhanced privacy
- Very flexible if you know webdev
- No need to leave the traditional dev toolset
- Open-Source community tools, no dependency on a specific company
- Actually know what you're setting up
</div><div>
![center w:10000](./images/smoke_example.gif)
## Cons
- Steep learning curve
- Hard to collaborate with non-technical people
- Need to be comfortable with text-based tools
- Theme can be limiting if not chosen correctly
</div></div>
---
# **Tips**
- (same as any AI augmented tool): <box>Don't blindly trust the output, but use it as an assistant
- When using local models: try **different models** depending on your needs and hardware
- Don't be afraid to **tinker** around and see what works
---
# Experiment 2: **Heben von virtuellen Objekten**
<center>
### Von den Teilnehmenden getestete Varianten
Getestete Variante | 🖐️ | 👁️ | 👂
------------------:|:----:|:--------------:|:-------:
`Base` | PHF | :x: | :x:
`Hapt` | DPHF | :x: | :x:
`Prog` | DPHF | *Progress Bar* | *Whoosh*
`Scal` | DPHF | *Skalierung* | *Whoosh*
`Trans` | DPHF | *Transparenz* | *Whoosh*
`Mask` | DPHF | *Rauch* | *Whoosh*
</center>
---
## TODO rest of content
# **Conclusion**
* Presentation software / AI often feels "out of reach" and only hostable if you're a company and have the resources for it
* It doesn't have to be that way!
* Don't contribute to that narrative $\implies$ <box>De-mystify the topic!
* *Your* data belongs to *you*; own it!
---
<!-- _class: "references" -->
# Quellen
<div class="multicolumn"><div>
1. MAIN PAPER TODO
2. https://wwwx.cs.unc.edu/Research/hyre/papers/EVEAuthored/2005-VR-Burns.pdf (Visual Dominance)
3. https://www.researchgate.net/profile/Abdulaziz-Alshaer/publication/303790509_Investigating_visual_dominance_with_a_virtual_driving_task/links/575275a608ae02ac1277b8e7/Investigating-visual-dominance-with-a-virtual-driving-task.pdf (Visual Dominance with wheelchairs)
4. https://www.youtube.com/watch?v=1l0wKk6q_ss (Demo Video from researchers)
</div><div>
TODO move references on 2 cols to improve readability
</div></div>
# References
- [Marp Team, "Marp" (2026) (accessed 2026-06-23)](https://marp.app)
- [Paulo Cunha, "MarpX" (2026) (accessed 2026-06-23)](https://github.com/cunhapaulo/MarpX)
- [Ollama Inc., "Ollama" (2026) (accessed 2026-06-23)](https://ollama.com)
- [CommitGo Inc., "Gitea Official website" (2026) (accessed 2026-06-23)](https://about.gitea.com/)
- (image) https://www.pexels.com/photo/smiling-woman-doing-a-presentation-6476778/ (accessed 2026-06-23)
---
# MarpX-Präsentation online verfügbar
# **This presentation** was done with MarpX too!
<div class="multicolumn"><div align="center">
## PDF
[![](./images/pdf_qrcode.png)](https://pages.ct.cozytren.ch/sti-presentation/presentation.pdf)
[![](./images/pdf_qrcode.png)](https://pages.ct.cozytren.ch/m1s2-eng-presentation/presentation.pdf)
</div><div align="center">
## HTML
[![](./images/html_qrcode.png)](https://pages.ct.cozytren.ch/sti-presentation)
[![](./images/html_qrcode.png)](https://pages.ct.cozytren.ch/m1s2-eng-presentation)
</div><div align="center">
## Repository
[![](./images/repo_qrcode.png)](https://gitea.ct.cozytren.ch/romane/sti-presentation)
[![](./images/repo_qrcode.png)](https://gitea.ct.cozytren.ch/romane/m1s2-eng-presentation)
</div></div>
</div></div>
```bash
wget https://pages.ct.cozytren.ch/m1s2-eng-presentation/presentation.pdf
git clone https://gitea.ct.cozytren.ch/romane/m1s2-eng-presentation
```
---
# GenAI use disclosure
(slide was appended after the presentation as per class instructions)
- `qwen3-coder:30b`, hosted locally using Ollama, has been used
- No use was made when generating the content
- The model has been used while proofreading the presentation for formatting and spelling issues but hasn't changed the content in any meaningful way