Design V
Multi-device tijdperk
“When faced with a totally new situation, we tend always to attach ourselves to the objects, to the
flavour of the most recent past. We look at the present through a rear-view mirror.”
We kijken naar nieuwe omgevingen door deze te vergelijken met wat voordien het normaal
was. Dit geldt ook zo bij design.
“The medium is the message” / “When invented/introduced for the first time, the medium itself
impacts society significantly more than the content it carries.” Marshall McLuhan
Wijst ons op het feit dat (de keuze van) het medium belangrijker is dan de boodschap. Zo
stelt hij dat 'Om de huidige wereld te begrijpen dient men de media te begrijpen'.
“remediation” (Jay David Bolter en Richard Grusin)
Staat voor het fenomeen dat elk nieuw medium de inhoud van oudere media in zich
opneemt en vertrekt vanuit deze voorlopers. Zo is fotografie gebaseerd op schilderkunst.
Daarbij komt dat de oude media ook nieuwe rollen kan krijgen. Zo zorgde de fotografie voor
een bevrijding in de schilderkunst en maakte de stap naar abstracte beelden mogelijk. Bij de
geboorte van een nieuw medium hebben we tijd nodig om de nieuwe mogelijkheden en taal
te ontdekken voordat het volle potentieel gebruikt kan worden, bv. cinema is gebaseerd op
toneel, maar ontwikkelde zijn eigen cinematografische taal.
Multi-device tijdperk: Combinatie van verschillende technologieën leidde tot dit. In vergelijking met
ervoor ‘single-device’-model. Door de standaardisering van smartphones, opkomst van apps en
succes van tablets zijn we beland in een ecosysteem waar meerdere technologieën met elkaar
interageren. Hoe deze wisselwerking gebeurd tussen verschillende toestellen is afhankelijk van de
context.
Hypermediacy: Een visuele stijl dat het doel representeert om het medium uit te lichten.
Immediacy: Als doel interactie van de gebruiker uit te lokken. Gevoel van betrokkenheid.
Singulariteit: door exponentiele disruptieve ontwikkelingen een ‘te’ verbonden wereld.
, 3C’s
Consistent
Bij het consistent ontwerpen houden we ons aan 2 basis principes
Het steeds aanbieden van dezelfde ervaring over verschillende toestellen. Waarbij we de
zelfde inhouden en dezelfde mogelijkheden bieden op dezelfde wijze.
Door middel van bewuste visuele wijzigingen en subtiele functionele aanpassingen er voor
zorgen dat de visuele vormgeving hetzelfde blijft ongeacht de schermgrootte, verschillende
vormen van interactie of vormfactor van het toestel.
Use case: Netflix zowel op desktop als tablet en smartphone krijg je dezelfde mogelijkheden en is ook
alles op dezelfde manier visueel gerepresenteerd.
Visuele zaken om mee rekening te houden bij verschillende toestellen
Lay-out
UI elementen / knoppen
Grid en Uitlijning
Schaalbare beelden
Grootte types
Hiërarchie van informatie kan ook anders zijn over verschillende media: ‘flat hierachy’ (alles op 1
pagina) of ‘deep hierachy’ (traditionele verschillende pagina’s).
Goede manier van consistent design optimalisatie is ‘Mobile First’ te werken.
Een smartphone legt ons de meeste beperkingen op
Het focust ons op de hoofd noden en doelen van de eindgebruiker
Geeft een creatievere kijk op het werken binnen de beperkingen
Naast ‘Mobile First’ kunnen we ons ook voorbereiden op verschillende vormfactoren door
‘Responsive Web Design’ toe te passen.
Vloeiende grids met % | flexibele beelden | mediaqueries | breakpoints
Bij optimalisatie ook rekening houden met factoren buiten het scherm zelf.
Is het touch screen? Dan is er geen ‘hover’ van muis maar heb je wel ‘gestures’ om mee te
werken. Verder zijn er ook grotere knoppen nodig en kan er met hardheid van drukken
gewerkt worden.
Welke grootte is het mobiele apparaat? Bij groot apparaat zijn beide handen nodig en zodus
ook wordt ‘landscape’ oriëntatie meer gebruikt. Het omgekeerde gebeurd bij kleine
apparaten.
Alternatieve inputs Stembediening, camerabeelden, lokalisatie, context
Multi-device tijdperk
“When faced with a totally new situation, we tend always to attach ourselves to the objects, to the
flavour of the most recent past. We look at the present through a rear-view mirror.”
We kijken naar nieuwe omgevingen door deze te vergelijken met wat voordien het normaal
was. Dit geldt ook zo bij design.
“The medium is the message” / “When invented/introduced for the first time, the medium itself
impacts society significantly more than the content it carries.” Marshall McLuhan
Wijst ons op het feit dat (de keuze van) het medium belangrijker is dan de boodschap. Zo
stelt hij dat 'Om de huidige wereld te begrijpen dient men de media te begrijpen'.
“remediation” (Jay David Bolter en Richard Grusin)
Staat voor het fenomeen dat elk nieuw medium de inhoud van oudere media in zich
opneemt en vertrekt vanuit deze voorlopers. Zo is fotografie gebaseerd op schilderkunst.
Daarbij komt dat de oude media ook nieuwe rollen kan krijgen. Zo zorgde de fotografie voor
een bevrijding in de schilderkunst en maakte de stap naar abstracte beelden mogelijk. Bij de
geboorte van een nieuw medium hebben we tijd nodig om de nieuwe mogelijkheden en taal
te ontdekken voordat het volle potentieel gebruikt kan worden, bv. cinema is gebaseerd op
toneel, maar ontwikkelde zijn eigen cinematografische taal.
Multi-device tijdperk: Combinatie van verschillende technologieën leidde tot dit. In vergelijking met
ervoor ‘single-device’-model. Door de standaardisering van smartphones, opkomst van apps en
succes van tablets zijn we beland in een ecosysteem waar meerdere technologieën met elkaar
interageren. Hoe deze wisselwerking gebeurd tussen verschillende toestellen is afhankelijk van de
context.
Hypermediacy: Een visuele stijl dat het doel representeert om het medium uit te lichten.
Immediacy: Als doel interactie van de gebruiker uit te lokken. Gevoel van betrokkenheid.
Singulariteit: door exponentiele disruptieve ontwikkelingen een ‘te’ verbonden wereld.
, 3C’s
Consistent
Bij het consistent ontwerpen houden we ons aan 2 basis principes
Het steeds aanbieden van dezelfde ervaring over verschillende toestellen. Waarbij we de
zelfde inhouden en dezelfde mogelijkheden bieden op dezelfde wijze.
Door middel van bewuste visuele wijzigingen en subtiele functionele aanpassingen er voor
zorgen dat de visuele vormgeving hetzelfde blijft ongeacht de schermgrootte, verschillende
vormen van interactie of vormfactor van het toestel.
Use case: Netflix zowel op desktop als tablet en smartphone krijg je dezelfde mogelijkheden en is ook
alles op dezelfde manier visueel gerepresenteerd.
Visuele zaken om mee rekening te houden bij verschillende toestellen
Lay-out
UI elementen / knoppen
Grid en Uitlijning
Schaalbare beelden
Grootte types
Hiërarchie van informatie kan ook anders zijn over verschillende media: ‘flat hierachy’ (alles op 1
pagina) of ‘deep hierachy’ (traditionele verschillende pagina’s).
Goede manier van consistent design optimalisatie is ‘Mobile First’ te werken.
Een smartphone legt ons de meeste beperkingen op
Het focust ons op de hoofd noden en doelen van de eindgebruiker
Geeft een creatievere kijk op het werken binnen de beperkingen
Naast ‘Mobile First’ kunnen we ons ook voorbereiden op verschillende vormfactoren door
‘Responsive Web Design’ toe te passen.
Vloeiende grids met % | flexibele beelden | mediaqueries | breakpoints
Bij optimalisatie ook rekening houden met factoren buiten het scherm zelf.
Is het touch screen? Dan is er geen ‘hover’ van muis maar heb je wel ‘gestures’ om mee te
werken. Verder zijn er ook grotere knoppen nodig en kan er met hardheid van drukken
gewerkt worden.
Welke grootte is het mobiele apparaat? Bij groot apparaat zijn beide handen nodig en zodus
ook wordt ‘landscape’ oriëntatie meer gebruikt. Het omgekeerde gebeurd bij kleine
apparaten.
Alternatieve inputs Stembediening, camerabeelden, lokalisatie, context
