Profielmodule 4 IA

Interactieve Vormgeving en Productie

Eindopdracht Klas 3 | Opdracht Klas 4

Pro Skill 1 | Pro Skill 2 | Pro Skill 3

Introductie

Overige skills voor IA ontwerpen: InDesign, XD, Website en Figma

Skill 1: Interactief

Leerdoelen

Werkwijze

Voorbeelden van Interactieve ontwerpen.

Overheid

Reclame

Kunst

Meer...

WigglePixel/Maarten de Haas: WigglePixel.nl en webfolie.nl, BooomBassTic

Skill 2: Doelgroep

Leerdoelen

Werkwijze

Skill 3: Layout met behulp van Stramien

Een stramien (ook wel grid of sjabloon of master page) is een vaste indeling die bepaalt waar elementen op een pagina mogen staan.

Het bestaat meestal uit kolommen, marges en hulplijnen. Een stramien helpt om een ontwerp overzichtelijk te houden en maakt het eenvoudiger om meerdere pagina’s dezelfde structuur te geven.

De lay-out is de manier waarop alle onderdelen – tekst, afbeeldingen, knoppen en witte ruimte – daadwerkelijk worden vormgegeven binnen het stramien.

Femke Klein: A Stramien

Bring your own laptop: InDesign: Masterpage (stramien in NL) en XD: Create a 12 Column Grid in Adobe XD
Raoul Postel: Layout voorbeelden

Skill 4: Typografie en Kleur

Zie 2D3D Beeldelementen Kleur en Typografie

Skill 5: Wireframe

Een wireframe is een schematische tekening van een digitale toepassing – meestal een website, app of interactief product. Het toont de structuur, functies en plaatsing van onderdelen, zonder dat er al vormgeving, kleurgebruik of typografie is uitgewerkt.

Uxcel course: Wireframe Best Practice

Skill 6: Prototype/mock-up

Wat is het verschil tussen een high- en een low fidelity prototype?

Skill 7:

Skill 8: User Experience (UX) en User Interface (UI)

UX staat voor User Experience, wat letterlijk gebruikers ervaring betekent.
Het draait dan ook om het ontwerpen van een optimale gebruikerservaring.

Bij het ontwerpen maak je bijvoorbeeld wireframes en animaties. Het kan ook zijn dat je twee verschillende knoppen ontwerpt en dat je vervolgens gaat testen welke type knop eerder gedrukt wordt zodat een klant beter/sneller doet wat jij wil dat hij doet.

UI staat voor User Interface, dat gebruikersomgeving betekent. Dit kan bijvoorbeeld de gebruikersomgeving van een website of een applicatie zijn.

Daar waar UX zich richt op de totale gebruikerservaring, ligt bij UI de focus specifiek op de interface.

UX staat voor User Experience, wat letterlijk gebruikers ervaring betekent.
Het draait dan ook om het ontwerpen van een optimale gebruikerservaring.

UI staat voor User Interface, dat gebruikersomgeving betekent. Dit kan bijvoorbeeld de gebruikersomgeving van een website of een applicatie zijn.

Daar waar UX zich richt op de totale gebruikerservaring, ligt bij UI de focus specifiek op de interface.

Check Figma for UX-UI design

style card UXDesign

Verdieping

interaction-design.org: What is UX design? | Designkit.org: Methods

Eindopdracht Klas 3

IA toets Klas 3

Cito toets 2025 rood Onderdeel D

Tijdens het gaming event Pixel Game Fest kunnen bezoekers een quiz spelen. De antwoorden op de quizvragen kunnen ze vinden op het event. Jij gaat deze quiz maken.

De quiz heeft een startscherm en drie vragen. Als je een vraag fout hebt, krijg je dat te zien. Daarna kun je opnieuw beginnen. Als je een vraag goed hebt, ga je door naar de volgende vraag. Heb je alle vragen goed, dan word je gefeliciteerd en kun je gegevens achterlaten om kans te maken op een prijs.

Bestanden downloaden leerlingen: BB / KB / GL en voor de docent Correctievoorschriften.