// data.jsx — content data for the portfolio. // HONEST SKELETON RULES: // · Only verified facts (from Merijn's FBP report or his own notes) appear as copy. // · Anything still to be written carries a `todo` prompt, rendered as a marked slot. // · No invented projects, dates, quotes, or persona language. window.SECTIONS = [ { id: 'past', title: 'The Past', side: 'A', type: 'C-60', accent: '#93CE8F', accentInk: '#3B7A3E', accentName: 'sage', catalog: 'MV·001', eyebrow: 'SIDE A · PAST', sublabel: 'Before the FBP', tagline: 'Where I came from, and the courses that shaped me before the final project.', duration: '32:48', }, { id: 'present', title: 'The Present', side: 'B', type: 'C-60', accent: '#F2876B', accentInk: '#C24E33', accentName: 'coral', catalog: 'MV·002', eyebrow: 'SIDE B · PRESENT', sublabel: 'The FBP · Elenchus', tagline: 'The Final Bachelor Project, the five expertise areas, and growth.', duration: '47:12', }, { id: 'future', title: 'The Future', side: 'C', type: 'C-90', accent: '#7FB5E8', accentInk: '#2F6FAE', accentName: 'sky', catalog: 'MV·003', eyebrow: 'SIDE C · FUTURE', sublabel: 'After the bachelor', tagline: 'Plans after the bachelor: master choice and direction.', duration: '28:04', }, ]; // ── Projects ── // Real names only. Elenchus and CROW carry verified facts; course entries // are skeletons awaiting Merijn's own write-ups. window.PROJECTS = [ { id: 'elenchus', number: '01', kind: 'fbp', year: '2025 — 26', venue: 'TU/e — Final Bachelor Project', role: 'Designer & researcher', duration: 'Squad Artifice · Coach: Aaqib Saeed', title: 'Elenchus', subtitle: 'A physical Socratic AI tutor for PI&V vision writing', desc: 'A clip-on device for a notebook that lets 1st-year ID students work on their vision through Socratic dialogue — the tutor replies only in questions, the student reflects on paper, no screens involved.', tags: [ { variant: 'red', label: 'FBP' }, { variant: 'orange', label: 'Physical interaction' }, { variant: 'muted', label: 'AI in education' }, ], cover: 'grid', sections: [ { kind: 'intro', eyebrow: 'WHAT IT IS', body: 'First-year students often struggle to write a vision because the question — who do you want to be? — is so vague. Elenchus helps them draft it through Socratic dialogue with an AI tutor that only replies in questions, forcing a think-articulate-reflect loop. The conversation happens through voice; the writing happens on paper; the device (an M5Stack AtomS3R clipped to the notebook) controls recording and shows the response state, keeping screens out of the reflective moment.', }, { kind: 'todo', eyebrow: 'PROCESS & REFLECTION', prompt: 'Tell the project in your own words — the RTDP process, the RAM-limit pivot, the expert interviews, the untested hypothesis, and what it taught you. The report has all of it; this is the place for the portfolio-voice version.', }, { kind: 'evidence', eyebrow: 'EVIDENCE', slots: [ { id: 'elenchus-ev-1', caption: '' }, { id: 'elenchus-ev-2', caption: '' }, { id: 'elenchus-ev-3', caption: '' }, ], }, ], }, { id: 'crow', number: '02', kind: 'internship', year: '[year]', venue: 'CROW — internship', role: '[role]', duration: '[duration]', title: 'CROW Internship', subtitle: 'Guidelines for temporary road signage', desc: 'Internship at CROW working on revisions to temporary road-sign guidelines — stakeholder visits, interviews, and the STOMP prioritisation framework.', tags: [ { variant: 'blue', label: 'Internship' }, { variant: 'muted', label: 'Stakeholders' }, ], cover: 'grid', sections: [ { kind: 'todo', eyebrow: 'WRITE-UP', prompt: 'Describe the internship: what CROW does, your work on the temporary road-sign guidelines, the stakeholder visits, and the step of going on location to interview a stakeholder by yourself.', }, { kind: 'evidence', eyebrow: 'EVIDENCE', slots: [ { id: 'crow-ev-1', caption: '' }, { id: 'crow-ev-2', caption: '' }, ], }, ], }, { id: 'creative-programming', number: '03', kind: 'course', year: '[year]', venue: 'TU/e — course', role: '', duration: '', title: 'Creative Programming', subtitle: '[one-line description]', desc: '[To write — why this course was formative.]', tags: [{ variant: 'muted', label: 'Course' }], cover: 'grid', sections: [ { kind: 'todo', eyebrow: 'WRITE-UP', prompt: 'What you made, what you learned, why it stuck.' }, { kind: 'evidence', eyebrow: 'EVIDENCE', slots: [{ id: 'cp-ev-1', caption: '' }] }, ], }, { id: 'aesthetics-of-interaction', number: '04', kind: 'course', year: '[year]', venue: 'TU/e — course', role: '', duration: '', title: 'Aesthetics of Interaction', subtitle: '[one-line description]', desc: '[To write — why this course was formative.]', tags: [{ variant: 'muted', label: 'Course' }], cover: 'grid', sections: [ { kind: 'todo', eyebrow: 'WRITE-UP', prompt: 'What you made, what you learned, why it stuck.' }, { kind: 'evidence', eyebrow: 'EVIDENCE', slots: [{ id: 'aoi-ev-1', caption: '' }] }, ], }, { id: 'gondry', number: '05', kind: 'course', year: '[year]', venue: '[venue]', role: '', duration: '', title: 'Gondry', subtitle: '[one-line description]', desc: '[To write — what Gondry was and why it mattered.]', tags: [{ variant: 'muted', label: 'Project' }], cover: 'grid', sections: [ { kind: 'todo', eyebrow: 'WRITE-UP', prompt: 'What Gondry was, your part in it, what it taught you.' }, { kind: 'evidence', eyebrow: 'EVIDENCE', slots: [{ id: 'gondry-ev-1', caption: '' }] }, ], }, { id: 'connected-experiences', number: '06', kind: 'course', year: '[year]', venue: 'TU/e — course', role: '', duration: '', title: 'Designing Connected Experiences', subtitle: '[one-line description]', desc: '[To write — why this course was formative.]', tags: [{ variant: 'muted', label: 'Course' }], cover: 'grid', sections: [ { kind: 'todo', eyebrow: 'WRITE-UP', prompt: 'What you made, what you learned, why it stuck.' }, { kind: 'evidence', eyebrow: 'EVIDENCE', slots: [{ id: 'dce-ev-1', caption: '' }] }, ], }, { id: 'actuated-systems', number: '07', kind: 'course', year: '[year]', venue: 'TU/e — course', role: '', duration: '', title: 'Designing Actuated Systems', subtitle: '[one-line description]', desc: '[To write — why this course was formative.]', tags: [{ variant: 'muted', label: 'Course' }], cover: 'grid', sections: [ { kind: 'todo', eyebrow: 'WRITE-UP', prompt: 'What you made, what you learned, why it stuck.' }, { kind: 'evidence', eyebrow: 'EVIDENCE', slots: [{ id: 'das-ev-1', caption: '' }] }, ], }, ]; // ── Expertise areas (TU/e Industrial Design) ── // Levels are a self-assessment Merijn still has to make — null renders as a // visibly empty meter, not a made-up number. window.EXPERTISE = [ { id: 'ca', label: 'Creativity & Aesthetics', level: 40, note: 'My weakest EA, strongest through interaction design. Next: rendering, ideation, motivating why.' }, { id: 'tr', label: 'Technology & Realization', level: 80, note: 'Advanced. Shifting from specializing toward using T&R/MDC as a framing.' }, { id: 'us', label: 'User & Society', level: 60, note: 'Grown a lot, still room. Improving through projects rather than courses.' }, { id: 'mc', label: 'Math, Data & Computing', level: 80, note: 'Advanced; my best work is the FBP. A home base, but not where I want to stay.' }, { id: 'be', label: 'Business & Entrepreneurship', level: 40, note: 'Early developmental phase, discovered via my internship; wants more academic grounding.' }, ]; // ── Long-form per-expertise write-ups ── // Final portfolio text (cutdown), copied verbatim. Order follows the // document: C&A, B&E, T&R, MDC, U&S. Figure references to be added. window.EXPERTISE_LONG = [ { id: 'ca', label: 'Creativity & Aesthetics', paragraphs: [ `I came into ID wanting to design cars. CBL P1 taught a lot of sketching, and during it I realized drawing cars isn't my passion. I have strayed from sketching since; it feels unnatural to my process for visual communication. In Designing Actuated Systems I learned to make good CAD models, and I am comfortable communicating ideas through a model instead of a sketch. CAD also lets me think about shape in three dimensions, which fits how my brain thinks.`, `My understanding of aesthetics started narrow. In my first year I drew inspiration from past art movements, as in Creative Programming. I am still a fan of Bauhaus and Dieter Rams, but pure minimalism isn't that interesting to me; I prefer teenage engineering's busier adaptation of Rams. Aesthetics of Interaction showed me how broad aesthetics are and led me to interaction design, which is how I integrate aesthetics the most. A recent example is Intelligent Interactive Products, where I combined gesture-based interactions and ML into a music mixing instrument. I prefer small ML models over raw sensor values for their consistency and adaptability. This is where my interest lies: physical interaction design.`, `C&A is my weakest EA. To make it a strength I want to improve my modelling with rendering, bring ideation techniques more naturally into my process and be able to motivate why. I also want to get better at integrating interaction. I plan to develop this through master courses; there is one in aesthetics of intelligence that fits me, continuing aesthetics of interaction onto the new frontier of AI. My FBP fits this through system prompt engineering for interaction.`, ], figures: [ { id: 'ca-fig-1', caption: 'Sketches made during CBL P1' }, { id: 'ca-video', kind: 'video', caption: 'Video of interactive impressionism sketch for Creative Programming', src: 'assets/ca-video.mp4' }, { id: 'ca-fig-2', caption: 'Physical instrument of music mixing device for Intelligent Interactive Products' }, { id: 'ca-fig-3', caption: 'Digital side of interaction for Intelligent Interactive Products' }, { id: 'ca-fig-4', caption: 'Bauhaus inspired poster made during Creative Programming' }, ], }, { id: 'be', label: 'Business & Entrepreneurship', paragraphs: [ `B&E is still an early developmental phase for me. I feel less academically educated here than the real-world experience of my internship gave me. I could be better prepared for another challenge like that by understanding more of the concepts behind the models I applied in Design Innovation Methods.`, `This is an interest I discovered unexpectedly during my bachelor, because of the concrete realism it adds to the design process and how it relates to U&S in solving bigger societal problems. Effective policy as a design problem is interesting to me.`, `For my internship I worked at CROW, which writes the Netherlands' infrastructure guidelines through a multi-perspective process where stakeholders reach consensus on the next publication. I set up a document defining innovation as a standard while staying safe. Working across those perspectives shaped what I wrote: the proposals were adjusted once stakeholders gave their opinions. This was also a lesson on understanding biases. It will form the basis of one of these guidelines, an official publication with my contribution in it.`, `To reach the next level I need more academic grounding, reading more on policy, and bringing external stakeholders into the process, which overlaps with U&S. That is why in my master's I want to take Design Entrepreneurship, Design for Social Innovation, and Value Based Leadership in Business Innovation.`, ], figures: [ { id: 'be-fig-1', caption: 'Stakeholder Onion Map made during Design Innovation Methods' }, { id: 'be-fig-2', caption: 'Stakeholder Onion Map made during internship' }, ], }, { id: 'tr', label: 'Technology & Realization', paragraphs: [ `Immediately at the start of the bachelor, I knew that this was an EA that I wanted to develop in. This was because of me almost choosing mechanical engineering over ID, and me wanting to learn how to code, how to make things, etc.`, `As of now, I feel at an advanced stage with T&R where I understand the topics quite well and I integrated T&R in quite a lot of my courses, I did complex modelling to create mechanisms, I did implement motors and different actuators in my physical prototype. All of this was done in Designing Actuated Systems, and I view it as the cap off for T&R. Physical digital interfaces is usually my go-to approach to problems considering my vision. During the process I also discovered that traditional ID, which I define as the execution of concepts and products, isn't for me. I like the creation of the ideas which happen earlier in the process.`, `So, I have started the shift of moving away from being heavily aligned with T&R to a more balanced perspective and using T&R as the framing, since the topic is still something I am passionate about. I just don't see myself specializing in T&R. I want to move towards a way that I can represent this perspective of T&R/MDC which I understand quite well and can apply problems on a societal scale.`, ], figures: [ { id: 'tr-fig-1', caption: 'Internals of motorized actuators for Designing Actuated Systems' }, { id: 'tr-fig-2', caption: 'Physical Components of Designing Connected Experiences' }, ], }, { id: 'mc', label: 'Math, Data & Computing', paragraphs: [ `In year 1 the curriculum covers the necessary courses for basic technical understanding and data analysis. In later years it opened up for me, into creating software, the coding side, and backend. I am at an advanced stage with MDC: I can read most system diagrams and the logic behind the code, because my way of thinking in blocks fits system design. AI falls under this too, and I am honest that I don't write the lines of code anymore, but I am glad I learned the basics first by doing it myself. This activity shaped how I design these systems. I still want the design decisions to be my own, which is why I write the spec sheets and have the model explain what it is doing during iteration so I keep expanding my understanding.`, `My best MDC work is my FBP, the integration of everything I described in the course section. I considered ML for a more embodied interaction but it was excessive and didn't fit the vision, though it is something I can reliably integrate when needed.`, `Where I can improve is UI work, though the FBP vision was the smallest footprint without a real UI. I am comfortable with MDC and have side projects in my spare time, and my struggle is finding ways to challenge myself in it.`, `During my FBP I made a small AI-coded leaderboard that scrapes and tracks a website. I don't claim the logic, but it required a real database and backend for once instead of front-end code, and it was my first time deploying a React webapp, which made me more comfortable using one in my FBP. It has 100+ users, and even as AI-generated code it taught me a lot: environment variables, password hashing, and the process of making things. This summer I am updating the UI to look less AI, since I have grown to dislike the common patterns it uses.`, ], figures: [ { id: 'mc-fig-1', caption: 'System Diagram for FBP' }, { id: 'mc-fig-2', caption: 'Leaderboard website made as a side project' }, ], }, { id: 'us', label: 'User & Society', paragraphs: [ `U&S is the most interesting EA of my bachelor, because I started out not enjoying it. That changed in CBL P3, where my group members suggested framing our project around mental health and a societal problem (see Figure 18). It was far better defined than anything I had done before, and rewarding, and ever since I have placed much more importance on properly defining projects around a societal problem. I did this well in my FBP, and I am proud of the effort I put into understanding the space and the literature (see Figure 19).`, `The user testing could have gone better, but it shows where I can still challenge myself, which is what I want to move toward in my master's. I notice the difference between my project and a great one: involving users and testing throughout the process. I want to improve U&S through projects rather than courses next year, since my problems are more practical than theoretical.`, ], figures: [ { id: 'us-fig-1', caption: 'CBL P3 project framing poster' }, { id: 'us-fig-2', caption: 'Miro board during literature review' }, ], }, ]; // ── Courses & electives integrated into the FBP / bachelor ── // Real names; integration write-ups still to come. window.COURSES = [ { title: 'Creative Programming', todo: 'How it fed the FBP / your practice.' }, { title: 'Aesthetics of Interaction', todo: 'How it fed the FBP / your practice.' }, { title: 'Gondry', todo: 'How it fed the FBP / your practice.' }, { title: 'Designing Connected Experiences', todo: 'How it fed the FBP / your practice.' }, { title: 'Designing Actuated Systems', todo: 'How it fed the FBP / your practice.' }, { title: 'CROW Internship', todo: 'How it fed the FBP / your practice.' }, ];