Servin
Servin werkt bij lvl30wizards en hij is mede-eigenaar. Hij gaat het hebben over 3D & Three.js. Hij komt van MBO MediaCollege en kwam op CMD. Hij is ook een eigen bedrijfje begonnen. Hij heeft gewerkt als freelancer en een soort "full-stack developer".
Hij doen meer front-end opdrachten, ze doen geen design, wel gevoel voor design. Ze houden van 3D en mooie animaties.
Je kan op een canvas dingen tekeningen en je kan er ook WebGL dingen mee doen. Je kan je grafische kaart ermee aanspreken (CPU, GPU - renders voor 3D - graphics card).
WebGL is gemaakt met OpenGL en is een andere API.
Stel je wilt iets met WebGL maken, dan moet je shaders schrijven en dit is een eigen taal (wiskundig). Je hebt tools om dit te doen, omdat het ingewikkeld is.
- Vertex shaders
- Fragment shaders (?)
Dit is een interessante API en kan je leuke 2D animaties mee maken.
Je kan er verschillende dingen mee doen, denk maar aan de 3D portfolio of aan 2021 eurovision website, waarbij Rotterdam "naar de mensen werd gehehaald". Hierbij accesibility wel een ding, want als je geen goed internet hebt, moet je er nog steeds mee kunnen interacteren en je moet er met je keyboard doorheen kunnen tabben of besturen. Dit is vooral een probleem met een canvas element, omdat een canvas element een afbeelding is en ze hebben er HTML achter geplaatst en op die manier accessible gemaakt. Denk ook aan https://cryptotower.com/
Omdat je met 3D werkt, werk je ineens met een 3e axis (Z axis). Je maakt uiteindelijk een render van je scene.
Alles wat je laat zien, laat je zien vanuit het oogpunt van de camera.
Binnen THREE.js, kan je dingen in je scene plaatsen, maar als je geen licht hebt, dan krijg je een zwarte scene terug. Je hebt verschillende lichtbronnen: sun, light direction, light bulb, spotlight etc.
Je hebt een mesh die bestaat uit een material en een geometry en als je deze 2 combineerd in een mesh en deze toevoegd in een scene dan heb je een box in een scene.
Je kan je animatie renderen. Hierbij is het belangrijk om te denken aan performance (30-60-120 FPS en hoeveel hz je scherm aan kan).
Future met asteriks omdat een hoop kan vandaag al.
De opvolger van WebGL (gemaakt op openGL). WEBGPU is een nieuwe API en deze kan veel makkelijker kiezen op wat jouw systeem supports. Voor THREE.js kan je als renderer, zowel WEBGPU en WEBGL gebruiken. WEBGPL gebruikt veel CPU, WEBGPU verbruikt minder GPU en probeert meer met je grafische kaart te praten.
Je kan websites in AR of VR maken hiermee. AR kan je met je telefoon doen of gebruiken.
- THREEJS-JOURNEY (betaald, voor beginners)
- SIMONDEV (nietv oor beginners, youtube vids)
- The book of shaders (puur alleen shaders schrijven over fragments shaders)
- Three.js examples (open source, je kan de code bekijken)
blender api voor google maps, waarop je kan inzoomen en dingetjes simplifyen.
Het onderwerp vond ik interessant en die dingen die werden besproken ook. De resources vond ik wel een heel interessant stukje, maar wel jammer dat ik dan meer op Three.js examples uit kom als ik niet wil betalen. Verder was het wel goed te volgen. Snelle presentatie, maar dat vond ik niet zo erg. Hierdoor kon ik goed mijn concentratie erbij houden.
- Vite ✔✔
- React ✔✔
- D3.js ✔✔
- LottieFiles ✔✔
- Lodash ✔✔
- Date fns ✔✔
- Javascript Cookie ✔✔
- Jwt Decode ✔✔
- Tailwind ✔✔
- GSAP✔✔
- Axios✔✔
- Animatie ✔
- Kleur ✔
- Gradients ✔
- Vormpjes maken ✔
- Filters ✔
- Application Optimization✔✔
- Compress Assets✔✔
- Sass ✔✔
- Gulp ✔✔
- Fonts-Optimization ✔✔
- Vercel ✔✔
- Campspace ✔✔
- Deanna Bosschert ✔✔
- Cyd Stumpel ✔✔
- Aaron Gustafson ✔✔
- Niels Leenheer ✔✔
- Hidde de Vries ✔✔
- Chanel Mepschen
- Servin ✔✔
- Brian Bawuah ✔✔
- Kilian Valkhof ✔✔
- Extra Notes
- NXT Museum | Foreign Nature
- dialogs & modals, three.js,
- Cas Obdamn ✔✔
- Wimer Hazenberg ✔✔
- Roos Verkade ✔✔
- Kilian Valkhof ✔✔