Continued on uxdaily.com

grts, revi

Workshop worked out!

Just returned from the Hogeschool Rotterdam, where I gave a workshop on Location Aware Advertising with students on User Experience Design. After I presented some key thoughts on location based services and location aware advertising supported with business cases, the students gathered in teams and started thinking about location-aware advertising concepts for themselves.
A big thanks to all participated students – your concepts where awesome and very inspirational!

You can find the presentation, backgrounds, results and some footage (soon) on the workshop-page.

> Go to the workshop-page

Graduation competence profile defined

Voor het beoordelen van mijn scriptie heeft mijn afstudeerbegeleider gevraagd vier subcompetenties te kiezen die vallen onder de drie hoofdcompetenties ‘Interaction Designer’, ‘Visual Interface Designer’ en ‘Usability Researcher’. Voor elke subcompetentie geef ik aan hoe ik met een deliverable kan aantonen de vaardigheid te beheersen.

——-——-——-——-——-

Hoofdcompetentie
Interaction Designer

Subcompetentie 1
Inleven in gebruikers en gebruiksdomeinen

Gedragsindicator (3+):

Kan door middel van onderzoek naar een specifiek gebruiksdomein komen tot een gebruiksscenario van een vernieuwend interactieconcept

Deliverable:
Concept demo/prototype naar aanleiding van een gebruikersscenario dat is geschreven vanuit de bevindingen die in het onderzoek naar voren zijn gekomen.

——-——-——-——-——-

Hoofdcompetentie:
Visual Interface Designer

Subcompetentie 2:
Realisatie: Het uitwerken van de visuele detaillering van het interface op basis van de beoogde gebruiksscenario’s.

Gedragsindicator (3):

De student kent de kwaliteiten en eigenschappen van verschillende media, online of offline en kan binnen de restricties hiervan een visueel ontwerp realiseren.

Deliverable:
De visuele uitwerking van het crossmediaal campagne concept zal verschillende mediakanalen representeren, zoals mobile/outdoor/online advertising.

——-——-——-——-——-

Hoofdcompetentie:
Visual Interface Designer

Subcompetentie 3:
Waarde: Het creëren van een merkstijl voor interactieve producten met een visuele taal (waaronder typografie) die aansluit bij een bestaande merkstrategie en -implementatie van de opdrachtgever en bij de gebruiksdoelen van de gebruiker.

Gedragsindicator (3+):

De student kan een beeldconcept ontwikkelen in een originele visuele taal die geschikt is voor cross-mediaal gebruik.

Deliverable:
Het crossmediale concept zal visueel een constitente identiteit communiceren.

——-——-——-——-——-

Hoofdcompetentie:
Usability Researcher

Subcompetentie 4:
Het samenvatten en interpreteren van de onderzoeksresultaten en op basis daarvan conclusies kunnen trekken ten aanzien van het interfaceontwerp

Gedragsindicator (3+):

Is in staat uit creatieve sessies met gebruikers zijn concepten en ideeën te verrijken met de inzichten van respondenten, op een wijze die uiteindelijk een bruikbaarder product zullen opleveren.

Deliverable:
Demo/protoype zal in ontwikkelfase met respondenten getest worden, om de input te gebruiken voor conceptverrijking.

Thesis deadlines confirmed

wk 15 (07.04) – Literature research

wk 16 (14.04) – Workshop + thesis part 1

wk 17 (21.04) – Graduation competence profile

wk 19/20 (05.05) – Go / no-go presentation

wk 23 (02.06) – Final thesis

wk 29 (14.07) – Examns, round 1

wk 35 (25.08) – Examns, round 2

Being at the right time, place and context.

The success of a crossmedial campaign leans on the User Experience concept for being at the right place on the right moment in the right context.. looks like Canon understands:

Notice how Canon used my profile picture in its cameradisplay (right context) on the moment I posted a reaction on a personal picture (right moment) just where I receive a confirmation of success for posting the message (right place).

And there you go, an emotional branded perception is a fact..

Interactive windowshopping

In januari raakte ik in gesprek met een oud vwo klasgenootje, Nick Verveen, over de techniek van XAM dat touch screen interfaces projecteert op ramen. Hij werkt momenteel bij AdVier dat alleenrecht heeft op distibutie van dit product in Nederland.Bij Lost Boys zijn online campagnes aan de orde van de dag. Eerder schreef ik een artikel over onze rol als User Experience Designers en de kansen om onze kunsten niet alleen online maar ook op straat te vertonen.
Omdat technieken als XAM hier naadloos op aansluiten heb ik Nick Verveen uitgenodigd om bij Lost Boys een demonstratie te geven.

Three layers of Emotional Design

Download pdf (Dutch, 107 kb)

Mooie dingen, daar houden we van. Want mooie dingen zijn leuk om te gebruiken. Donald Norman vindt dat veel te makkelijk gezegd: ‘Usable designs are not necessarily enjoyable to use’.^[1]Een produkt waar over zowel vormgeving als gebruiksvriendelijkheid is nagedacht bieden lang niet altijd een plezierige gebruikerservaring. Een écht goed ontwerp legt vanaf de eerste kennismaking de basis voor een emotionele connectie tussen produkt en gebruiker.In ‘emotional design’ ontwerp je dus niet voor het zicht maar voor emotie: een ontastbaar zelftstandig naamwoord dat eigenlijk weinig vorm te geven over laat. Toch zijn ontwerpers onmisbaar daar zij ‘de tijd, ruimte en context creëren waarin de interactie tussen produkt en gebruiker plaats vindt,’^[2].Een beleving kan dus gecreëerd worden door alles te ontwerpen dat het moment van interactie omsluit.Wat we ons nu af vragen: hoe kunnen ontwerpers de invulling van dat moment vormgeven; de aanleiding voor de emotionele verstandhouding tussen produkt en gebruiker? Om daar een antwoord op te vinden neem ik een paar stappen terug om te beginnen bij de manier waarop wij in ons dagelijks leven een verstandhouding vormen.

1. Attitude and behavior (houding en gedrag)

Wanneer we in aanraking komen met een entiteit (bijv. situatie, persoon, voorwerp, gebeurtenis, produkt of merk) zijn we in staat een positieve, neutrale of negatieve houding aan te nemen ten opzichte ervan.Dit hebben we te danken aan ons beoordelingsvermogen waarmee we een entiteit volgens het zogenaamde ABC-Model^[3] evalueren. ‘Affect’, ‘Behavioral change’ en ‘Cognition’: drie evalatielagen die samen de aard van onze houding bepalen.

ABC Model of attitude

• Affective response: mate waarin de entiteit aanspraak maakt op persoonlijk voorkeur
• Behavioral intention: mate waarin de entiteit gewenst of bruikbaar is in huidige situatie.
• Cognitive response: evaluatie van de entiteit aan de hand van geheugen, perceptie, kennis, inzicht en persoonlijke ervaring BehaviorJe houding ten opzichte van een entiteit beïnvloed je gedrag bij interactie. Als voorbeeld nemen we de confrontatie met een beer tijdens een wandeling door het bos.

	Persoon A	Persoon B
Affective:	Je hebt niks met grote beren, en dit beest kijkt niet bepaald met puppy ogen.	Je bent gek op beren en bestudeert ze al jaren, dit is een pracht exemeplaar!
Behavioral change:	Je zat er niet op te wachten een grote beer tegen het lijf te lopen, de confrontatie komt in geen enkel opzicht van pas.	Met je telelens bij de hand had je geen beter moment kunnen wensen om een beer tegen het lijf te lopen!
Cognition:	Persoonlijke ervaring vertelt je dat beren gevaarlijk zijn voor de gezondheid.	De beer heeft net gegeten, als je rustig blijft is er niks aan de hand.
Emotion and attitude:	De emotie angst breekt los en een negatieve verstandshouding met de entiteit ‘beer’ is een feit.	De emotie enthausiasme komt los: ze zijn zo mooi van dichtbij. De positieve verstandshouding is gevoed.
Behavior:	Je zet het op een lopen en hoopt dat je nooit weer een beer tegen het lijf loopt, wat een monster!	Beetje bij beetje probeer je dichterbij te komen om de mooiste plaatjes te schieten, wat een schat van een beer!

Omdat de emotionele houding van Persoon A nu op angst is gebaseerd zal hij in de toekomst met een grote boog om beren lopen.

Voor Persoon B daarentegen was de confrontatie een extra impuls die de emotionele verstandhouding heeft doen versterken. De positieve ervaring biedt perspectief voor de toekomst, misschien zal hij de confronatie zelfs opzoeken.

Volgens dit ABC-model kunnen we dus op basis van persoonlijke achtergrond het gedrag van een individu voorspellen bij de interactie met een entiteit. Laten we eens kijken hoe we daar op in kunnen spelen als ontwerper van produkten.

2. Produkt analyse

Donald Norman vertaalt in zijn boek ‘Emotional Design’ de drie bovengenoemde lagen van het ABC-model naar een toepasbaar model voor de manier waarop wij produkten analyseren: ‘Visceral, Behavioral and Reflective level’, aantrekkelijkheid, gebruiksgedrag, en imago voor gebruiker/eigenaar.Omdat een produkt de drie lagen afzonderlijk kan aanspreken kunnen we drie designprincipes van elkaar onderscheiden.

• Visceral design (intuïtief niveau)
  Concentreert zich op die vertrouwde eerste indruk en verschijning bij de gebruiker. Visuele voldoening krijgt hier prioriteit.

• Behavioral design (gebruikersniveau)
  Concentreert zich op het gedrag en gevoel van het produkt bij gebruik. Usability, look and feel zijn hier sleutelwoorden voor succes.
• Reflective design (beschouwelijk niveau)
  Streeft naar een positieve gebruikersbeleving op de lange termijn. Maakt aanspraak op het imago van de gebruiker/eigenaar door een verhaal te vertellen over zijn smaak, status of identiteit.

3. Afwegen van design principes

Een goed ontwerp heeft van alles wat. Afhankelijk van het moment van interactie en de mind-set van de gebruiker moet een zorgvuldige afweging gemaakt worden tussen de drie principes. Zo is bijvoorbeeld de emotionele gesteldheid van de gebruiker erg bepalend voor het probleem oplossend vermogen. Iemand die onstpannen en blij is creatief in het bedenken van alternatieven, terwijl iemand onder een situatie van stress alleen maar oog heeft voor efficiëntie. Als we 10 waardepunten zouden moeten verdelen over de drie designprincipes per emotionele gesteldheid zou dat er als volgt uit kunnen zien:

	Ontspannen	Stress
Visceral design	5	0
Behavioral design	1	10
Reflective design	4	0

Wanneer we dus informatie hebben over de persoonlijke achtergrond en de emotionele gesteldheid op het moment van interactie, kunnen we in het ontwerpproces dus bepalen hoe we de drie principes moeten uitlijnen om de gewenste beleving voor de gebruiker te creëren. In volgend schema probeer ik dit verhaal te illustreren.

4. Emotional management?

Het is inmiddels wel duidelijk dat het ontwerp van een goed product anticipeert op de emotionele gesteldheid van de gebruiker. Aangezien je in het ontwerpproces niet vroeg genoeg kunt beginnen met het nastreven van dat resultaat zouden we dit al toe kunnen passen op het management: ‘het management van een vruchtbaar ontwerptraject anticipeert op de emotionele gesteldheid van de ontwerper.’

In de brainstorm-fase bijvoorbeeld moeten er veel alternatieven op tafel komen. Een open, ontspannen sfeer waarin iedereen zich op zijn gemakt voelt is dan bepalend voor het resultaat.

Wanneer de puntjes op de i moeten worden gezet kunnen de deadlines iets aangetrokken worden, aangezien ontwerpers onder druk vaak beter presteren met een hoger concentratievermogen.

Al met al zouden we emotional design als volgt kunnen omschrijven:
Wanneer we de persoonlijke achtergrond, moment van interactie en emotionele gesteldheid van de gebruiker hebben vastgesteld kunnen we een product ontwerpen dat een sterke eerste indruk geeft, efficient en plezierig in gebruik is en een verhaal vertelt over de status of smaak van de gebruiker, welke perspectief biedt voor toekomstige interactie.

Literatuurlijst

1. ‘Emotional Design: Why We Love (Or Hate) Everyday Things’
   Donald Norman beschrijft de manier waarop mensen produkten analyseren en hoe je daar als ontwerper op in kan spelen.
2. ‘Een moment van Reflectie’
   Mijn vorig schrijfsel over de rol van ontwerpers in het creëren van een gebruikersbeleving.
3. Attitude (psychology)
   Wikipedia artikel

Boost your day with Bridge

Ever got lost in your mail, blog or communities in the morning and waited to long to search the local network for your project folder to get things started? Here is – next to the cup of coffee – the second best way to boost your day.

What you need:
- Mac OS X
- Adobe Bridge
- (Remote) folder you’re working in lately

What to do:
1. Add Adobe Bridge to your Dock
2. Put an Alias from your latest (remote) design folder on your Desktop
3. Wake up the next morning
4. Go to work
5. Drag the Alias to the Bridge icon in your Dock
6. Bridge jumps to the folder previewing all contained files

Another tip:
- Drag a file or folder from finder to the Bridge icon in your Dock to enjoy the Bridge-view

Note:
- In Bridge you can also create shortcuts to folders in the shortcuts panel, but they disappear on mouse-click when the actual location has been changed, or when there is no network connection to get the remote files. So using above method will enable you to skip the shortcuts panel in Bridge, and expand your thumbnail-view.

Save time; save workspace.

Ever curious about the total amount of time searching for certain tools/properties when designing anything in heavily armed interfaces like Photoshop or InDesign?

Perhaps you’re on a single screen at home, and working less intensive as you do at the office. It would be nice to have less tools and panels filling your screen and bring focus to the stage.
Try a different workspace when you’re at the office, for example when you’re using an extra screen to extend your desktop. Think about expanding all your popular panels and totally fill your extra screen with panels from top to toe.

1. Experiment on different sets of workspaces, for different situations.
Switch, expand and collapse the panels untill you found the workspace best suited for your set up.

2. Save all workspaces.
Start using names like ExtendedDesktop_01, SingleScreen_01, Prototyping_01, Webdesign_01. Hell you can even combine them to ExtendedDesktop_Webdesign_01 just knock yourself out..

3. Customize your panels.
Figure out as much ‘librarish’ functionalities as you can (like templates, components, themes, color swatches, object styles, type styles etc. etc.). Now you can also save workspaces by project-name or style-guide. Did you know you can save some presets – like your color swatches – as independent files? Save them to your design folders in the project directory!

4. Make your favourite workspaces your own
Now is the the time to be consistent and cool down on the workspace boogie. Just keep it the way you like and train yourself to be an armed and dangerous action hero.

Shazam!