Interaction Design 202 Vragen of feedback? @ferrydendopper

Designing Labels

Interaction Design 202 Vragen of feedback? @ferrydendopper

Wat hebben we in de voorgaande lessen al besproken over labeling?

Interaction Design 202 Vragen of feedback? @ferrydendopper

Ambiguïteit

Trap1. Schop; iem een ~ geven

2. Trede; het kind kroop op de zesde ~

3. Samenstel van treden waarlangs men een hoger of lager gelegen plaats bereikt; de ~ oplopen

4. Trapladder; keuken~

5. Graad van moeilijkheid, opklimming, stadium; hij bereikte de hoogste ~; drie~sraket

6. Enz.

Interaction Design 202 Vragen of feedback? @ferrydendopper

Organisatieschema’s

Exacte schema’s:• Alfabetisch• Chronologisch• Geografisch

Ambiguë schema’s:• Onderwerp• Taak/doel• Doelgroep• Metafoor• Hybride

Interaction Design 202 Vragen of feedback? @ferrydendopper

Interaction Design 202 Vragen of feedback? @ferrydendopper

Interaction Design 202 Vragen of feedback? @ferrydendopper

Interaction Design 202 Vragen of feedback? @ferrydendopper

Don’t Panic!

“Your labels will never be perfect.”

“If it sounds to you like labeling is an art rather than a science, you’re absolutely correct.”

“There are no rules, only guidelines.”

Morville & Rosenfeld

Interaction Design 202 Vragen of feedback? @ferrydendopper

Hoe maak je labels meer representatief en minder ambigu?

Focus!Hoe specifieker je scope (doelgroep, doelen, inhoud), hoe meer je het aantal mogelijke perspectieven op wat een label betekent.

Interaction Design 202 Vragen of feedback? @ferrydendopper

Hoe maak je labels meer representatief en minder ambigu?

Ontwerp labelsystemen, geen losse labels

• Consistentie > Voorspelbaarheid > Gemakkelijker te leren

Stijl: bv. formeel / informeel Syntax: werkwoorden / z.nw, vragen / losse

woorden ‘Korreligheid’ (granularity): restaurants of

Burger Kings? Dekkingsgraad: ontstaat er geen gat in het

systeem? Publiek: wat als “buikpijn” en “lymfoom” naast

elkaar staan?

Interaction Design 202 Vragen of feedback? @ferrydendopper

Bronnen voor labels

Zoeklog analyse Card sorting Category Agreement Analysis

http://www.uie.com/articles/caa/

Item Hoofdcategorie SubcategorieUSB-sticks ………………… ………………

Bij vergelijkbare / concurrerende sites kijken

Interaction Design 202 Vragen of feedback? @ferrydendopper

Kijk eens bij de buren

Interaction Design 202 Vragen of feedback? @ferrydendopper

Kan jij het beter? www.boddefd.nl

Interaction Design 202 Vragen of feedback? @ferrydendopper

Is dit beter? Kan het nog beter?www.vvfd.nl

Interaction Design 202 Vragen of feedback? @ferrydendopper

www.vvfd.nl

Interaction Design 202 Vragen of feedback? @ferrydendopper

www.vvfd.nl

Interaction Design 202 Vragen of feedback? @ferrydendopper

www.vvfd.nl

Interaction Design 202 Vragen of feedback? @ferrydendopper

www.vvfd.nl

Interaction Design 202 Vragen of feedback? @ferrydendopper

www.vvfd.nl

Interaction Design 202 Vragen of feedback? @ferrydendopper

Oefening: Beoordeel en verbeter

• Analyseer de navigatie en labeling van Unilogic.nl;

• Ontwerp iets beters.

Tijd: 20 minutenWerk in tweetallen

• Presenteer je ontwerp aan een ander tweetal;• Creëer samen een definitief ontwerp.

Tijd: 20 minutenWerk in viertallen

Interaction Design 202 Vragen of feedback? @ferrydendopper

Interaction Design 202 Vragen of feedback? @ferrydendopper

Interaction Design 202 Vragen of feedback? @ferrydendopper

Interaction Design 202 Vragen of feedback? @ferrydendopper

Interaction Design 202 Vragen of feedback? @ferrydendopper

Interaction Design 202 Vragen of feedback? @ferrydendopper

Interaction Design 202 Vragen of feedback? @ferrydendopper

Interaction Design 202 Vragen of feedback? @ferrydendopper

Interaction Design 202 Vragen of feedback? @ferrydendopper

Interaction Design 202 Vragen of feedback? @ferrydendopper

Interaction Design 202 Vragen of feedback? @ferrydendopper

Vragen? Feedback?

f.den.dopper@hr.nl

@ferrydendopper