Grupp 1
Bra exempel – Responsive Disclosure
Blocket.se – https://www.blocket.se/annonser/hela_sverige
Dåligt exempel – Responsive Disclosure
Bra exempel – Responsive Enabling
Zalando.se – https://www.zalando.se/welcomenoaccount/true
Dåligt exempel – Responsive Enabling
Bra exempel – Responsive Enabling
Dramaten
Dramatens webbsida visar ett bra exempel på hur Responsive Enabling kan underlätta användarens val och navigering. När man valt en pjäs och vill gå vidare och köpa biljett framgår det tydligt vilka platser som finns kvar att köpa och vilka som redan är sålda. Användaren kan alltså se alla platser som finns men kan endast välja de som inte redan är sålda.
Dåligt exempel – Responsive Disclosure
Compricer – https://www.compricer.se/bolan/nyttlan/#steg1-bolan-nyttlan
Compricer är ett jämförelsebolag för diverse försäkringar. I exemplet ser vi deras sida för låneansökan för en bostad, där varje svar visar upp en ny del av ”blanketten” som ska fyllas i. För just detta fall kan man dock argumentera för att detta är ett dåligt val. Då stegen innehåller frågor som hör samman, men ej egentligen behöver besvaras efter varandra. Dessa frågor är saker som, för att kunna besvaras korrekt, mest troligt behöver kollas upp av användaren. Om då frågorna ej syns i förhand kan detta betyda att användaren behöver leta upp platsen för informationen flera gånger för att utföra ”blanketten”, istället för att leta upp all information på en gång. För övrigt anser vi det ej finnas någon mening med att leda användaren genom dessa frågor.
Till sist kan detta göra användaren onödigt orolig över den information som de behöver ge ut. Då jämförelsetjänster ibland frågar efter telefonnummer, email eller personnummer som obligatoriska delar för en jämförelse. Att man då ej får se vilka frågor som behöver besvaras kan indikera på att det kommer att komma frågor som användaren ej tycker om och kan därför eventuellt avskräcka hen från att påbörja ”blanketten” till att börja med.
Dåligt exempel
Användaren är tvungen att se för mycket info från början och varje gång man klickar på en kategori byter till en hel ny sida med ny information.
Dåligt exempel
I paint, när man ska öppna en bild och inte har markerat en bildfil så är “öppna” knappen visuellt aktiverad, fast den inte fungerar. “Avbryt” knappen är också visuellt aktiverad, och den fungerar. Så knapparna fungerar olika.
Grupp 6 – distans
Bra exempel
https://www.svea.com/se/sv/start/
Dåligt exempel
När användaren har valt en blomma och trycker på “skicka som gåva” kommer en ruta upp där responsive disclosure används. Det står i rutan att användaren kan fylla i adress, postnummer eller ort men om användaren enbart skriver orten så måste denna ändå fylla i postnummer, så beskrivningen är fel helt enkelt. Dessutom visas adresserna lite skumt – exempelvis så visas två olika förslag som ser ungefär likadana ut då användaren skriver in sitt postnummer. Även märkligt att användaren först ska klicka i önskat leveransdatum och först därefter får veta om datumet är möjligt. Det hade varit bättre om det enbart möjliga datum hade gått att bocka i.
Dåligt exempel:
BMW – bygg din egna bil
BMW använder en så kallad responsive Disclosure i kombination med responsive enabling som låter användaren efter valt item, i detta fall bilmodell i en center panel få tillgång till olika valbara alternativ i en lista på funktionalitet och utseende för den valda modellen. Alternativen i listan finns att tillgå från hela processen, och karakteriseras såldes en Responsiv enableing. Samtidigt baserat på användarens interaktion och agerande i gränssnittet dyker nya alternativ upp eller tas bort, vilket karektariserar Responsive disclosure. Denna struktur av responsiv disclosure är av ett sämre exempel då användaren aldrig kan få en tydlig översikt över vilka val som försvunnit eller kan jämföra modellernas alternativ mot varandra. Så relationen mellan vad hon agerar på och vilken feedback och utfall det skapar är ytterst låg. Direkt när användaren valt en modell slussas hon ut till nästa steg i processen och samtidigt ser man att vissa val lagts till eller tagits bort i sidomenyn, något som dock sker så snabbt att man som användaren inte får någon uppfattning över vas som skett och det blir såldes svårt för användaren att koppla hennes handling till förändringen och exakt vad förändringen var då sidan inte heller ger någon ledtråd till varför ett visst item försvann.
Fig. 3. Responsive disclosure: Some Alternatives are automatically removed from list.
Fig 3.2. Responsive Enabling: some alternatives are added after selecting another car model.
Interface Patterns – Designmönster för användargränssnitt | På svenska 