README.md

visualeffects

Kurs Visuelle Effekte WS 2018/2019 Hochschule Fulda

Teilnehmer: Nicolai Fröhlig
Matrikelnummer: 639186
Projekt: Fresnel Effekt (Ist dann im Ordner "\Fresnel")

Um das Projekt laufen lassen zu können, auf lokalen Server starten lassen (Live-Server von VSCode, XAMPP, etc.) und auf die html-Datei navigieren (index.html in Fresnel-Ordner).

Um dabei die verschiedenen Szenen zu benutzen, müssen verschiedene JavaScript-Dateien in der Zeile 24 der index.html eingebunden werden (einfach eingebundene JavaScript-Datei in der index.html im "\Fresnel"-Ordner ändern):

1. app.js => Szene mit Skybox und einer voll reflektiven Kugel
2. appEmpiricialFresnel.js => Szene mit dem empirischen Fresnel-Effekt (alle Objekte)
3. appSchlickFresnel.js => Szene mit dem Fresnel-Effekt der Schlick-Approximation (alle Objekte)
4. appEnvMap.js => Szene mit einer voll reflektiven Kugen, welche eine Dynamic Environment Map benutzt (6x Rendering)
5. appEnvMapFresnel.js => Szene mit dem Fresnel-Effekt der Schlick-Approximation auf dem mittleren Cube, projiziert auf die Dynamic Environment Map (6x Rendering).

Das Repository enthält dabei Code von:

• gl-Matrix: https://github.com/toji/gl-matrix
• OBJ-Loader, welcher in dem Modul vorgegeben wurde

Das Repository enthält Shader-Ideen von:

• Beleuchtung, Schatten und Fresnel Logik: https://learnopengl.com/book/learnopengl_book_bw.pdf
• Fresnel Logik: https://www.ronja-tutorials.com/2018/05/26/fresnel.html
• Fresnel Logik: http://kylehalladay.com/blog/tutorial/2014/02/18/Fresnel-Shaders-From-The-Ground-Up.html
• Dynamic Environment Map: http://math.hws.edu/graphicsbook/
• Dynamic Environment Map und Fresnel Effekt: http://developer.download.nvidia.com/CgTutorial/cg_tutorial_chapter07.html

Weiterhin enthält das Repository Models von:

• Mobster: https://people.sc.fsu.edu/~jburkardt/data/obj/obj.html
• Capsule: http://paulbourke.net/dataformats/obj/minobj.html
• Skybox Textures: http://www.custommapmakers.org/skyboxes.php
• Metal Texture: https://freepbr.com/materials/rusted-iron-pbr-metal-material-alt/

Die Engine und verschiedenen Szenen wurde in den Browsern Firefox und Chrome getestet.