Träff #7 • Inkluderande design tors 2 mars • UX Writing vt 23 • Nackademin

Jonas Söderström • 2023
Inkluderande design
 
som skapar tillgänglighet
Trä
ff
#7 • Onsdag 22 mars
Jonas Söderström • Vt 23 • UX Writing • Nackademin

View Slide

Idag
• Lite repetition

• Story!

• Inkluderande design

• WCAG …

View Slide

Lite repetition

View Slide

Informationsdesign är strängt taget två saker:
Utforma så
 
det viktiga
framhävs, och
helheten blir tydlig
och lättolkad.
2
”Chunka”
, ordna, märka
1
Empatisera, tänka.
Rensa bort trivialt
 
och överflödigt.
Förstå vad som
 
är viktigt för
mottagaren.

View Slide

att dela upp informationen
 
i lagom stora och meningsfulla bitar,
”Chunka”
informationen med vettiga etiketter
(rubriker) eller utmärkande drag
(bilder, färg, symboler),
 
så vi förstår vad de betyder för oss
Märka
dem i en vettig följd,
 
med en tydlig hierarki
Ordna

View Slide

Innehållet
 
är viktigare än
etiketterna!

View Slide

Ikoner kan ha
 
nyttiga budskap

View Slide


View Slide

Inkluderande design

View Slide

Tryck på skärmen!
’’ ’’

View Slide


View Slide

Tryck på skärmen!
🤷

View Slide

🤷
👵

View Slide

Röd signalfärg

Synliga lappar

Gul signalfärg

Sträcker sig mot användaren

”Ta mig!”

View Slide

”Signifiers”
(”A
ff
ordances”)
Håll här
Lägg något
här

View Slide

”Signifiers??”
???
Huh?
Va?

View Slide

Inga visuella ledtrådar
till att det
fi
nns lappar

Inget ”ta mig!”

Ingen text ”tryck här
 
för nummerlapp” …
Ingen bild…
Tryck på den blåa randen!

View Slide

Inga visuella ledtrådar
till att det
fi
nns lappar

Inget ”ta mig!”

Ingen text ”tryck här för
nummerlapp” … ingen
bild…
Ärrvävnad!

View Slide

Apotek

View Slide

Optiker

View Slide

Postkontoret

View Slide

”Men så svårt är det väl inte…”

View Slide

• … den som inte kan
svenska perfekt

• … den som har immiga
glasögon på grund av
regn ute

• … den som är stressad

• … den som är på
vårdcentralen för första
gången

• … den som har torr hud
🤷
👵
De mest sårbara – svårt med
språket, svårt att gå –
 
var de som drabbades!

View Slide

"….jag personligen hade inte
tänkt att det faktiskt kan vara
fysiskt omöjligt att använda en
pekskärm på grund av till
exempel torra
fi
ngertoppar"

View Slide

Funktionsnedsättning
https://termbank.socialstyrelsen.se/?TermId=812&SrcLang=sv
nedsättning av fysisk, psykisk
eller intellektuell
funktionsförmåga”
”

View Slide

Funktionsvariation

View Slide

Funktionshinder
Individens förmågor
Omvärldens krav
{
Funktions-

hinder

View Slide

Inkluderande design –
 
att minska trösklar
 
i omvärlden
Individens förmågor Omvärldens krav

View Slide

Tillgänglighet är ett
 
mått på slutresultatet:
 
bättre eller sämre
Individens förmågor Omvärldens krav

View Slide

Programvara och system skall
vara lämpligt utformade med
hänsyn till arbetsuppgiftens
krav och användarens
förutsättningar och behov.
Arbete vid bildskärm (AFS 1998:5), § 10

View Slide

• Webbdirektivet –
 
den europeiska standarden EN 301 549.

• Lagen om tillgänglighet till digital
o
ff
entlig service
https://webbriktlinjer.se/lagkrav/webbdirektivet/

View Slide

“Visst, men vi behöver
inte tänka på tillgänglighet.

Vår målgrupp för den här appen
har inga handikapp.”

View Slide

Det vet du inte, grabben
Starr

View Slide

” ’My speech is slow, and I slur some words’,
 
said Dagmar Munn, a retired wellness
instructor who has amyotrophic lateral
sclerosis.

’Although I am careful to enunciate
 
and carefully pronounce a command,
 
the device stops listening by my second word.
 
I just can’t speak fast enough to satisfy
 
the preset listening time,’ Ms. Munn said.”
NY Times 22 sep 2021

View Slide

Companies have usually engineered voice
technology to cater to uninterrupted speech
from “the average North American English
voice,” said Frank Rudzicz, associate professor
at the University of Toronto who studies
speech, language and arti
fi
cial intelligence. As
a result, diverse speech patterns sometimes
sound foreign to voice-enabled devices.

In other words, companies have rarely
prioritized those of us whose speech doesn’t
match what engineers assume to be the norm.
https://www.nytimes.com/2021/09/22/opinion/voice-assistants-accessibility-disability.html

View Slide

Funktionsnedsättningar är olika
Rörelse
Armlös Skada Nybliven förälder
Touch / tap!

View Slide


View Slide

Kognitiva funktionsvariationer
Permanent

• Autism / ADHD-spektrum

• Dyslexi

• Utvecklingsstörning

• Hjärntrötthet (permanent?)

Tillfällig

• ”Pollenhjärna”

Situation

• Utvakad på grund av kolikbarn

• Kognitiv överbelastning (stress)

View Slide

“Visst, men vår målgrupp är
genomsnittsanvändarna.”

View Slide


View Slide

Källa: Per Axbom

View Slide

Exkludering på
fl
er sätt

View Slide

Inkludering är mer än anpassning
till funktionsvariationer …
… det kan också gälla innehåll.

View Slide

Förutsätt inte att alla vill
fi
ra Mors dag

View Slide

Förutsätt inte
att alla vill
fi
ra
Fars dag …
 
… ge
möjlighet
 
att avstå
 
(opt-out)

View Slide

Användbarhet
”Tillgänglighet”

View Slide

Användbarhet
”Tillgänglighet” Användbarhet
”Användbarhet”
 
är illusionen
 
av att det
fi
nns
 
en bred normalitet.

View Slide

…inte bara
unga vita
män
Design för alla Användbarhet

View Slide

…inte bara
unga vita
män
Inkluderande
design
Användbarhet

View Slide

Rekommenderad läsning:

Katrine Marçal:
 
Att upp
fi
nna världen

View Slide

Paus till
16.05!

View Slide

Inkludering för text

View Slide

Att tolka och förstå:

View Slide

Minska kognitiv belastning
Läsning är ingen naturlig aktivitet!

View Slide

25 % har svårt att läsa
• På en vecka ökar befolkningen ökar med 1 340
personer. Största delen av ökningen – 1 000
personer – beror på invandring (minus utvandring).
42 % av vuxna
svenskar når
 
inte upp till nivån
”goda läsare”

De
fi
nition: Klara av att
söka efter information i en
lång, komplex text, tolka
innehållet och dra
slutsatser (nivå 3 av 5).
Källa: PIAAC-studien, 2013, SCB (stort antal OECD-länder)

View Slide

25 % har svårt att läsa
• På en vecka ökar befolkningen ökar med 1 340
personer. Största delen av ökningen – 1 000
personer – beror på invandring (minus utvandring).
100 % har ont om tid

View Slide

Verktyg , riktlinjer, resurser
Utformning: Riktlinjer i Web Content Accessibility Guidelines (WCAG)

Innehåll: Kommande klarspråksstandard (ISO)

Språkrådet ( isof.se )

Begriplig text ( begripligtext.se )

View Slide

isof.se

begripligtext.se
Några Klarspråks-resurser:

View Slide

Riktlinjer för tillgänglighet:

WCAG 2.1 (2.2, 3.0)

(”vee-kagg”)
A AA AAA

View Slide

• https://www.w3.org/WAI/standards-guidelines/wcag/

View Slide


View Slide

”Gör så här”
Sex posters från gov.uk

View Slide

Men länkar
Det regnar småspik
Regnet känns
 
som kalla spikar

View Slide


View Slide

contrastchecker.online

accessible-colors.com

contrastchecker.com
Dålig kontrast,
svårläst text

View Slide

WCAG om kontrast
• Textens kontrast mot bakgrund
 
ska vara minst 4,5:1.

• Stor stil,

• större än 18 p, eller

• fetstil större än 14 p

ska ha en kontrast på minimum 3:1.

View Slide


View Slide

Undantag
• Ren dekoration eller inaktiva

• Incidental: Text or images of text that are part of an inactive user interface
component, that are pure decoration, that are not visible to anyone, or that
are part of a picture that contains signi
fi
cant other visual content, have no
contrast requirement.

• Logotyper

• Logotypes: Text that is part of a logo or brand name has no minimum
contrast requirement.

View Slide

Var försiktig med
text i bild eller på
rörig bakgrund
unionen.se

View Slide


View Slide

Bilden mörktonad
under texten

View Slide

Nyplings gårdsbutik, Lokrume

View Slide

Det som är bra
för personer
med funktions-
nedsättningar
 
är oftast också
bra för alla.
Nyplings gårdsbutik, Lokrume

View Slide

WCAG om textstorlek
• Minst 16 punkter för huvudsaklig text (brödtext)

• 16 punkter ≈ 21 pixlar

• Ingen de
fi
nitiv riktlinje,
 
men en genomgående rekommendation

View Slide

WCAG om övriga textattribut
• Radavstånd minst 1,5 gånger textens storlek (grad).

• Avstånd mellan stycken minst 2 gånger
 
textens storlek.

• Bokstavsmellanrum minst 0,12 gånger
 
textens storlek.

• Ordmellanrum minst 0,16 gånger textens storlek.

View Slide

Fyra nödvändiga pusselbitar för ”tillgänglighet”
Rätt
inklusion
Rätt
innehåll
Rätt
design
Rätt
kod

View Slide


View Slide

Blivande klarspråksstandard (?)
• Relevant: läsarna ska få den information de behöver.

• Lätt att hitta i: Läsarna ska lätt kunna hitta
informationen de behöver.

• Begriplig: Läsarna ska lätt kunna förstå informationen.

• Användbar: Läsarna ska lätt kunna använda
informationen.

View Slide


View Slide

• Patricia Moore: Design for all –
 
The Lifespan Design Challenge (YouTube)

• 25 min

• https://www.youtube.com/watch?v=AzjEfozVWj0

View Slide

Måndag

April
3
Inifrån-
perspektiv,
mer klarspråk
Genomgång
uppgift 1
Klarspråk
 
och krångligt
språk
Rubriker,
ingresser
Onsdag

Mars
29
Vecka 13
Onsdag

April
5
Vecka 14
14.00–16.00
Mars
27
Måndag

View Slide

Träff #7 • Inkluderande design tors 2 mars • UX Writing vt 23 • Nackademin

Träff #7 • Inkluderande design tors 2 mars • UX Writing vt 23 • Nackademin

Jonas Söderström
PRO

More Decks by Jonas Söderström

Other Decks in Design

Featured

Transcript

Träff #7 • Inkluderande design tors 2 mars • UX Writing vt 23 • Nackademin

Träff #7 • Inkluderande design tors 2 mars • UX Writing vt 23 • Nackademin

Jonas Söderström PRO

More Decks by Jonas Söderström

Other Decks in Design

Featured

Transcript

Jonas Söderström
PRO