1. 3D

Deze module gaat over 3D. Over beter gezegd 2D en 3D: hoe krijg je via een plat (2D) beeldscherm toch het idee dat er sprake is van 3D? En hoe maak je eigenlijk een 3D figuur?

We zullen ons bezig gaan houden met onderwerpen over 3D in een plat beeldscherm. Ook zullen wel leren tekenen met SVG, een taal om afbeeldingen te maken.

Deze curus is ook tevens bedoeld voor geavanceerder webontwerp. Door het toepassen van meerdere technieken ga je een website maken die te maken heeft met 3D en waarin deze technieken terugkomen. De cursus is tevens bedoeld als herhaling van de cursus HTML.

2. Diepte waarnemen

Wat maakt nou eigenlijk dat wij diepte zien? Er zijn twee manieren om diepte te suggereren.

1. Met de term monoculaire diepteaanwijzingen gaat het om aanwijzingen die ook met één oog waargenomen kunnen worden. Als je met twee ogen kijkt, krijgen beide ogen dus hetzelfde beeld te zien.
2. Met de term binoculaire diepteaanwijzingen worden aanwijzingen bedoeld om diepte waar te nemen met beide ogen. Ieder oog krijgt een ander beeld voorgeschoteld en op basis daarvan ervaren wij diepte.

 

3. Monoculaire diepteaanwijzingen

Bij het maken van bijvoorbeeld een 3D computerspel, waarbij geen 3D bril nodig is, wordt gebruik gemaakt van monoculaire diepteaanwijzingen. Een voorbeeld van zo'n monoculaire diepteaanwijzingen is een getekende kubus. Bij de onderstaande kubus zijn alle parallelle lijnen ook parallel getekend. We noemen dat perspectiefprojectie.

Het is ook mogelijk om parallelle lijnen die de diepte in gaan, naar een bepaald punt op de horizon samen te laten komen.

Hier zie je het resultaat van een kubus waarbij de lijnen naar één punt lopen. Merk op dat de horizon nu wat lager ligt. 

 

4. Schaduwwerking en andere effecten

Door de werking van schaduwen zien wij objecten als ruimtelijke objecten en niet als platte objecten. De ballen hieronder staan in beide afbeeldingen op precies dezelfde locatie, door de schaduw krijgen we er toch een ander beeld bij.

Er zijn nog meer effecten die de 3D illusie versterken zoals bijvoorbeeld interpositie van objecten en scherpte en onscherpte. Om kennis te maken met deze effecten maak je de onderstaande opdrachten.

 

5. Binoculaire diepteaanwijzingen

Alhoewel je met één oog diepte kunt waarnemen is het gebruik van twee ogen voor echte dieptewaarneming onontbeerlijk. Door het verschil in positie van onze ogen geven ze een verschillend beeld. Dat verschil in het beeld van onze beide ogen is een van de belangrijkste manieren om diepte waar te nemen. Dat is vooral het geval bij het zien van diepte op korte afstanden. Binoculaire diepteaanwijzingen zijn dus gebaseerd op het verschil in waarneming tussen beiden ogen.

Daarbij is binoculaire dispariteit het verschil tussen het beeld in het linker en het rechter oog. Overigens wordt ook de stand van de ogen gebruikt om te bepalen waar een object zich bevindt. Bij het zien van een voorwerp dichtbij zijn onze ogen immers verder naar binnen gedraaid.

De afstand tussen onze ogen wordt parallax genoemd en bedraagt ongeveer 65 mm. Bij 3D camera’s en andere toepassingen -zoals de legorobot- bedraagt de parallax vaak minder.

6. Anaglyph

Een bekende techniek om het beeld voor het linker en rechter oog te scheiden is anaglyph. Het beeld voor het ene oog wordt rood gekleurd,  terwijl het beeld voor het andere oog groen wordt gekleurd. Met een bril waarvan het ene glas groen is en het andere rood worden de beelden voor beide ogen gescheiden. Hieronder zie je een voorbeeld van zo’n anaglyph beeld. Om het diepte-effect te kunnen zien heb je een 3D-bril nodig.

 Een flat anaglyph

Een flat anaglyph is een foto waarbij je met een 3D-bril diepte ziet maar waarbij je nog niet zoveel verschil ziet tussen de voor- en achtergrond. Dit is het geval met de bovenstaande cactusfoto. We gaan zo'n afbeelding zelf maken met behulp van het programma Gimp.

Open dit programma en zoek tergelijketijd in je browser een geschikte afbeelding om te bewerken. Je mag ook een foto maken met je telefoon. De foto moet echter voldoen aan bepaalde eisen zoals:

• Minimaal 1000 pixels hoog en 800 breed of andersom. Een grotere afbeelding geeft een nog beter effect.
• Een foto waarbij iets duidelijk op de voorgrond staat zoals in onderstaande afbeelding.

Plak de foto met Ctrl-C en Ctrl-V in Gimp zoals hierboven is gedaan. Als de foto niet groot genoeg is kun je deze schalen. Pas ook de resolutie aan van zowel X als Y.

Open nu het lagenmenu met Ctrl-L en kopiëer de laag zoals wordt getoond in onderstaande afbeelding.

Geef de twee lagen de naam red en cyan.

Selecteer de laag Red door erop te klikken.

Open hierna het kleurenmenu en ga naar niveaus. In het niveausmenu gaan we de kleurnivaus aanpassen.

 De kleur groen wordt op 0 gezet.

Evenals de kleur blauw zodat je alleen rood overhoudt.

 Hierna wordt ook de kleur rood in de laag cyan op 0 gezet.

Selecteer nu de laag red en zet de modus op scherm.

Door nu de red enigzins te verschuiven met de move-tool krijg je het 3D effect. Je kunt dat het beste doen met een 3D-bril op.

 

7. Meer diepte in het anaglyph

Voor een verdere uitleg kun je het volgende filmpje bekijken. Je doet dit deel facultatief, alleen als je voldoende tijd hebt. Anders sla je dit deel over.

8. Dubbelzinnig 3D

Er zijn ook tekeningen, gebaseerd op monoculaire aanwijzingen, die dubbelzinnige informatie geven. Bekijk de onderstaande afbeeldingen.