Chapter 21 Design details: controls and dialogs Flashcards

1
Q

Which selection carols are there—and how do they work, respectively?

A
  • Checkboxes: får checka in flera objekt ur en lista
  • Dropdowns: trycker på pil och får lista av saker att välja
  • Switches: kan välja mellan olika states (t.ex. on/off på notiser)
  • Radio buttons: får checka in ett val ur en lista, runda buttons
  • Toggle buttons: växlar mellan två tillstånd (t.ex. mörk/ljust läge)
  • Combo-icon buttons: kombination mellan dropdown och ikoner
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

Which imperative controls are there—and how do they work, respectively?

A
  • Knappar: för action (t.ex. klickar på knappen skicka och de initierar en sändningsåtgärd omedelbart)
  • Ikon-knappar: för action (t.ex. klicka på ikonen ‘klistra in’ och det klistra in något omedelbart)
  • Hyperlänkar: för att navigera genom innehåll (t.ex. du läser om choklad på Wikipedia och nämner ‘kakaobönan’—vilket är en hyperlänk—du trycker på den och komma till en ny sida om kakaobönan)
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

Which entry controls are there—and how do they work, respectively?

A
  • Sliders: till för att mata in en styrka (t.ex. hur högt ljudet ska vara på Spotify)
  • Range slider: ofta till för filtrering (t.ex. intervall av pris på Zalando)
  • Spinner: kombination med textruta och pilar för att mata in värde eller trycka på pilarna (t.ex. när du skriver in antal av en produkt på en köpessida)
  • Dial: kan skruvas, likt sliders, visar ett numeriskt värde baserat på hur användaren drar i det
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
4
Q

What is the difference between bounded and unbounded entry?

A

Bonded entry: controls som begränsar användarinmatning till de tillgängliga fördefinierade alternativen (fast intervall)

Unbounded entry: controls som tillåter användaren att mata in data i fritt format utan begränsningar, inmatning kan bli avvisad (lös intervall)

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

How can we validate data entry?

A
  1. Active and passive validation
    * Active: visa ogiltiga inmatningar direkt
    * Passive: validering sker först när användaren slutfört sin inmatning
  2. Hints: små pop-up meddelanden som dyker upp när en ogiltig inmatning upptäcks
  3. Units and measurements: kan tolka om olika inmatningsformat (t.ex. 5c, 5in, 5centimeter)
  4. Avoid text edit for output: undvik redigerbara textfält för visning av statisk information, om en användare ser ett textfält kan de tro att de kan ändra värdet
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

Which display controls are there—and how do they work, respectively?

A
  • Text controls: beskrivande texter om objekt på skärmen
  • Drawers and levers: fäller ut och öppnar text (t.ex. det finns ikoner men du kan fälla ut ikonerna för att se text kopplad till ikonen, verktyg i Illustrator)
  • Splitter: delar en vy i sektioner som kan justeras i storlek (t.ex. en sidopanel som kan dras ut eller in)
  • Scrollbars: gör det möjligt att rulla genom innehåll som inte får plats på skärmen, antingen vertikalt eller horisontellt
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

When is it appropriate to use dialogs?

A
  1. Vid ovanliga, riskfyllda eller betydande åtgärder för att förhindra misstag.
  2. För att samla information och samla relevanta kontroller på ett ställe.
  3. För att guida vana användare pedagogiskt (t.ex. instruktioner).
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

How should we name dialogs?

A

Tydligt och beskrivande, relaterat till funktion eller objekt så att användaren direkt förstår syftet. Håll det kort och konkret, gärna med ett verb vid åtgärder, t.ex. “Spara fil” eller “Bekräfta radering”.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

What is the difference between a modal and a modeless dialog—and when are they used, respectively?

A

Modal dialogs: när denna dialogruta väl är uppe kan inte användaren fortsätta förens dialogrutan stängs t.ex. vid bekräftelse av radering av fil

Modeless dialogs: tillåter användaren att interagera med både dialogen och huvudapplikationen samtidigt, utan avbrott. t.ex. systemuppdateringar.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

What is the difference between tabbed dialogs, expanding dialogs and cascading dialogs?

A
  • Tabbed dialogs: olika egenskaper inom en dialogruta. Undvik att använda för många tabbar.
  • Expanding dialogs: gör en inmatning och det kommer fler alternativ eller du får tillåtelse till fler funktioner.
  • Cascading dialogs: dialogrutor som öppnar dialogrutor och som öppnar dialogrutor—för hög kognitiv belastning.
How well did you know this?
1
Not at all
2
3
4
5
Perfectly