VWO 4 CKV — PO1 Kunstautobiografie (2026-2027)

Interactieve Digitale Kunstwerken

De website zélf is het kunstwerk. Drie unieke frontend-prototypes die allemaal synchroon worden aangedreven door één centrale bron: data.js.

Data Source: data.js Maker: Matthijs van der Elst 8 CKV Domeinen M.K. Industries Portfolio The Process Origin Story
🧠
DEFINITIEF CKV KUNSTWERK
HOOFDWERK // VWO 4 CKV

The Neural Mind of the Maker

"Kijk in mijn hoofd": Een beeldend kunstwerk waarin Matthijs centraal staat. Klikken op het portret opent een organisch neuraal netwerk met synapsen en dendrieten, waarlangs de 8 CKV-domeinen als levende polaroid-herinneringen zweven met échte foto's. Bevat een directe 1-klik PDF Poster Export met QR-code voor inlevering op It's Learning!

  • Matthijs centraal portret + "Kijk in mijn hoofd" zoom-transformatie
  • Echte foto's voor alle 8 domeinen (De Kuip, Brussel street art, Suits, etc.)
  • Organisch HTML5 Canvas synapsen- en actiepotentialensimulatie
  • Exporteerbare A3/A4 Posterweergave met QR-code voor It's Learning PDF
🚀 Open Het Definitieve Kunstwerk (The Neural Mind) →

Eerdere Verkennende Prototypes (Ontwerpproces)

🕸️
PROTOTYPE 01

01_Network

Interactieve constellatie van zwevende deeltjes die vloeiend naar de cursor toe trekken. Klikbare knooppunten openen een geanimeerde glassmorphic modal met diepgaande reflecties.

  • HTML5 Canvas zwaartekracht physics
  • Zwevende interactieve domein-nodes
  • Glassmorphism popups & snelmenu
  • Tab-navigatie (CKV, Portfolio, Process)
Open 01_Network →
🔦
PROTOTYPE 02

02_Canvas

Donkere sferische overlay met een interactieve zaklamp (flashlight) cursor over een abstract kunstwerk. Ontdek verborgen pulserende hotspots en open dynamische ontdekkingskaarten.

  • Dynamisch spotlight / zaklamp masker
  • Generatief abstract digitaal kunstcanvas
  • Verborgen oplichtende bakens & HUD panels
  • Reveal-all modus & touch ondersteuning
Open 02_Canvas →
⚡
PROTOTYPE 03

03_Glitch

Minimalistische dark page met cyberpunk chromatische glitch typografie bij hover. Klikken schuift elementen vloeiend uit naar gecreëerde vrije witruimte (accordeon UX).

  • Authentiek CSS ::before/::after clip-path glitch
  • Vloeiende vrije-ruimte expansie (B-keuze UX)
  • Web Audio API cyber synth audio feedback
  • High-contrast minimalistische dark aesthetic
Open 03_Glitch →

💡 Single Source of Truth Architectuur

Bestand: CKV_Prototypes/data.js

Alle drie de prototypes laden hun data dynamisch in via data.js. Wanneer je jouw document later aanvult met definitieve teksten of foto's, hoef je alleen data.js aan te passen. Alle prototypes werken zich automatisch bij zonder dat er ook maar één regel HTML gewijzigd hoeft te worden.