Exempel tenta

Question 1

Designmönster

Answer 1

Designmönster är grundläggande byggstenar för digital design. Genom att känna igen, förstå deras lämplighet och syften, samt veta deras namn, kan designern effektivt kommunicera sina idéer.

Question 2

Interaktionsartefakt

Answer 2

Input media
Exempel på inmatningsenheter inkluderar till exempel tangentbord, mus, mikrofon och kamera.

Output media
Exempel på utmatningsenhet kan vara bildskärm, högtalare och skrivare.

Question 3

Meny / Menu

Answer 3

Designmönstret finns alltid tillgängligt och måste ha meningsfull kategorisering för att skapa en tydlig överblick. Men, menyn får inte bli för omfattande/för många nivåer vilket kan leda till kognitiv överbelastning.

Problem: Användaren behöver veta var det går att hitta det hen letar efter.
Lösning: Placera en meny synlig jämt på ett och samma ställe på sidan. Erbjud även andra sätt att navigera på.
Använd när: Alla webbsidor behöver någon typ av huvudsaklig navigering

Fördelar
Navigationsförbättring: Menyer gör det enkelt för användare att navigera genom en webbplats eller applikation.
Organisering: En bra menystruktur hjälper till att organisera innehållet och gör det lättare för användare att hitta det de letar efter.
Konsistens: Menyer kan ge konsistent användargränssnitt över hela applikationen eller webbplatsen.

Nackdelar
Begränsad plats: På mindre skärmar kan det vara svårt att visa en omfattande meny utan att offra användarupplevelsen.
Komplexitet: Om menyn inte är ordentligt designad kan den vara för komplicerad och förvirrande för användare.

Question 4

Sökning / Search

Answer 4

Designmönstret lämpar sig när användaren besitter “kunskap i huvudet” Med det sagt måste användaren ordagrant veta vad hen söker på för att detta designmönster ska vara mer effektivt än menyn.

Problem: Användaren behöver hitta ett alternativ eller viss information.
Lösning: Erbjud en sökruta. Visa sökresultaten med en kort beskrivning.
Använd när: Det finns redan en huvudsaklig navigation. Användaren kan vilja söka efter ett alternativ i en kategori. Användaren kan vilja förfina en specifik sökning.

Fördelar
Snabb åtkomst: En sökfunktion möjliggör snabb åtkomst till specifikt innehåll.
Flexibilitet: Användare kan söka efter olika typer av innehåll och behöver inte navigera genom hierarkiska strukturer.

Nackdelar
Beroende av noggrannhet: För att vara effektiv måste sökfunktionen vara noggrann och förstå användarens avsikter.
Kräver implementering: Att skapa och underhålla en bra sökfunktion kan vara tekniskt komplex.

Question 5

Karusell / Carousel

Answer 5

Fungerar bra som inspiration men är inte alls passande som huvudsaklig navigering. Kan visa många alternativ men användaren måste även komma ihåg var något ligger i karusellen.

Problem: Användaren behöver välja ett alternativ bland många.
Lösning: Visa alternativen som bilder i en ring, eller en del av en ring.
Använd när: Det finns en unik bild för varje alternativ. Alternativen liknar varandra och är på samma nivå. Det finns plats att visa max tio bilder. Alternativens namn, och annan metadata, kan visas vid varje bild.

Fördelar
Visuell lockelse: Karuseller kan vara visuellt tilltalande och fånga användarens uppmärksamhet.
Utrymmeeffektivitet: Ger möjlighet att visa flera innehållsstycken på en begränsad yta.

Nackdelar
Användarinlärning: Användare kanske inte alltid märker eller klickar på karusellinnehåll, vilket kan leda till missad information.
Ökad laddningstid: Om varje bild eller innehåll i karusellen kräver separat laddning kan det öka sidans laddningstid.

Question 6

Formulär / Forms

Answer 6

Bra för att samla in den typ av data som krävs men, måste vara tydligt formulerad eller begränsad (tex endast siffror i personnummer etc). Det är viktigt att formuläret har ett tydligt och klart syfte och ska inte samla onödig information eller lura användaren till oönskade saker, tex nyhetsbrev e.dyl.

Problem: Användaren behöver ge uppgifter till den som erbjuder tjänsten.
Lösning: Erbjud ett formulär som samlar in de nödvändiga uppgifterna.
Använd när: Användaren behöver lämna uppgifter. Exempel: boka flyg, göra en avancerad sökning, registrera sig på en webbplats, eller logga in. Måste vara del av användarens uppgift eller åtminstone vara till fördel för användaren.

Fördelar
Datainsamling: Formulär gör det möjligt att samla in strukturerad information från användare.
Interaktivitet: Användare kan interagera aktivt genom att fylla i formulär och skicka in information.

Nackdelar
Tråkighet: Långa formulär kan vara tråkiga och minska användarens motivation att fylla i dem.
Misstag och överbelastning: Felaktig formulärdesign kan leda till användarmisstag och överbelastning.

Question 7

Wizard

Answer 7

Används när en komplicerad process kan brytas ner till mindre steg. Varje enskilt steg är enkelt och man kan tydligt se var i processen man är och tillåter använder att backa i stegen. Detta tar dock tid och är ineffektivt för den som redan “kan”.

Problem: Användaren vill nå ett bestämt mål, men flera beslut måste fattas på vägen (de kan vara okända för användaren).
Lösning: Led användaren genom uppgiften, ett steg i taget. Visa vilka steg som finns.
Använd när: En icke-expert behöver lösa en uppgift som är relativt ovanlig. Beslut behöver fattas i varje deluppgift. 3-10 deluppgifter. Deluppgifterna kan vara beroende eller oberoende av varandra.

Fördelar
Tydlig struktur: Wizards ger en tydlig struktur för användare genom att bryta ner en komplex uppgift i mindre steg.
Användarledning: Guidar användare genom en process och kan minska risken för misstag.

Nackdelar
Extra steg: Kan lägga till extra steg för användaren, vilket kan vara irriterande om processen kunde vara enklare.
Kan vara tidskrävande: Om det finns för många steg i en wizard kan det uppfattas som tidskrävande av användarna.

Question 8

Double Diamond (DD)

Answer 8

Double diamond-modellen är en designmetod med fyra faser som framhäver betydelsen av att börja med bred utforskning före fokusering på en lösning. Ursprungligen från designthinking främjar den kreativitet och användarcentrerad design.

(Hitta problem)
Discover, Define,

(Skapa rätt lösning)
Develop, Deliver

Question 9

Double Diamond
Discover (Upptäckande fas)

Answer 9

Problemdefinition: I detta steg undersöks och definieras problemet eller utmaningen. Teamet samlar information, identifierar behov och förstår användarnas perspektiv.

Forskningsfas: Här genomförs forskning och datainsamling för att få djupare insikt i problemet. Det kan inkludera användarintervjuer, observationer och andra metoder för att förstå målgruppen och deras behov.

Question 10

Double Diamond
Develop (Utvecklingsfas)

Answer 10

Idégenerering: Teamet genererar kreativa idéer och lösningar relaterade till den definierade problemformuleringen. Detta kan göras genom brainstorming, skissning och andra metoder för att främja kreativitet.

Prototyper: De bästa idéerna väljs ut för att skapa prototyper. Prototyper kan vara grova eller snabba representationer av möjliga lösningar för att testa och validera koncepten.

Question 11

Double Diamond
Define (Definierande fas)

Answer 11

Insikter och mönster: Baserat på Discover resultat, analyserar teamet insikter och mönster för att dra slutsatser och definiera designutmaningen tydligare.

Problemformulering: Designproblemet omformuleras och klargörs för att ge riktning åt den kommande designprocessen. Detta innebär att definiera vilka problem som ska prioriteras och lösas

Question 12

Double Diamond
Deliver (Leveransfas)

Answer 12

Testning och validering: Prototyperna testas med användare för att samla feedback och validera designkoncepten. Detta steg hjälper till att säkerställa att lösningarna uppfyller användarnas behov och fungerar som avsett.

Implementering: Baserat på feedbacken från testningen kan designen förfinas och förbättras. När designen är godkänd implementeras den för att lösa det ursprungliga problemet.

Question 13

WCAG (Web Content Accessibility Guidelines)

Answer 13

WCAG är ett standardiseringsorgan för internetdesign och kodutveckling, där målet är att göra innehållet på nätet tillgängligt för alla, oavsett funktionsvariation.

WCAG har satt upp fyra tillgänglighetsprinciper:

Perceivable, Operable, Understandable, Robust

Question 14

WCAG
Perceivable (Uppfattbarhet)

Answer 14

Webbinnehållet bör vara lätt att uppfatta för användare, inklusive de med synnedsättningar eller andra funktionsnedsättningar. Detta innebär till exempel att använda tydlig text och kontrast, samt att erbjuda alternativa sätt att förmedla information, som ljud eller textalternativ för bilder.

• Använd tillräcklig kontrast mellan text och bakgrund för att underlätta läsbarheten.
• Erbjud textalternativ för icke-textinnehåll, som bilder och grafik.
• Tillhandahåll tydliga och distinkta länktexter och rubriker.
• Undvik att använda endast färg som den enda informationsbäraren.

Exempel: En person med synnedsättning använder en skärmläsare för att navigera på webben. För att göra webbsidan varseblivbar för denne, bör du inkludera alternativ text för alla bilder och grafik. Till exempel, om det finns en bild av en hund, bör du inkludera beskrivande text så att skärmläsaren kan läsa upp “En bild av en glad hund”.

Question 15

WCAG
Operable (Användbarhet)

Answer 15

Användare bör kunna använda och navigera webbsidan med olika hjälpmedel. Detta inkluderar att använda tangentbordet istället för musen och att se till att navigationsfunktioner är logiska och konsistenta.

• Se till att webbsidan kan navigeras med tangentbordet.
• Ge tydliga och konsistenta navigationsmekanismer.
• Undvik innehåll som kan utlösa epileptiska anfall eller överdriven blinkning.
• Tillhandahåll tillräckligt med tid för användare att läsa och utföra uppgifter.

Exempel: En person med motoriska funktionsnedsättningar kan ha svårt att använda en mus. För att göra webbsidan användbar för denna person, se till att alla interaktiva element, som länkar och knappar, är stora nog för att tryckas på med en pekpinne eller tangentbord. Detta underlättar användningen för personer med olika motoriska förmågor.

Question 16

WCAG
Understandable (Förståelighet)

Answer 16

Innehållet och dess användning bör vara tydligt och begripligt. Detta inkluderar att undvika komplicerad jargong, erbjuda användarinstruktioner och undvika innehåll som kan förvirra användarna.

• Erbjud tydliga och förståeliga instruktioner.
• Håll textinnehåll läsbart och förståeligt, undvik komplicerad jargong.
• Ge feedback om användarinteraktioner och formulärinmatning.
• Organisera och presentera information på ett logiskt sätt.

Exempel: En person med motoriska funktionsnedsättningar kan ha svårt att använda en mus. För att göra webbsidan användbar för denna person, se till att alla interaktiva element, som länkar och knappar, är stora nog för att tryckas på med en pekpinne eller tangentbord. Detta underlättar användningen för personer med olika motoriska förmågor.

Question 17

WCAG
Robust (Robusthet)

Answer 17

Webbinnehållet bör vara robust och kompatibelt med olika webbläsare och teknologier, inklusive hjälpmedel för funktionsnedsatta. Detta bidrar till att säkerställa att webbsidor förblir tillgängliga över tid och inte förlorar funktionalitet när tekniken utvecklas.

• Se till att webbinnehållet är kompatibelt med olika webbläsare och teknologier.
• Använd standardkodning för att förbättra interoperabilitet.
• Tillhandahåll alternativa sätt att nå innehåll om den primära tekniken inte stöds.
• Uppdatera och underhåll webbsidor för att säkerställa långsiktig tillgänglighet.

Exempel: En användare med en äldre webbläsare eller en alternativ webbläsare kan stöta på problem om webbsidan inte är robust nog. Använd standardiserade HTML- och CSS-kodningstekniker för att säkerställa kompatibilitet över olika plattformar och teknologier. Detta gynnar användare med olika tekniska behov.

Question 18

Utvärdering
Metoder

Answer 18

Med användare
Användningstest
Kontrollerat experiment

Utan användare
Heuristisk utvärdering (inspektions/expertmetod)
Kognitiv genomgång (inspektions/expertmetod)

Data-analys

Question 19

Utvärdering
Metoder
Med användare

Answer 19

Användningstest:
- Hela systemet
- Användaren är inkluderad, de som ska använda systemet sen. Kan mäta tillfredsställelse hos användare
- Dyrare
- Tar längre tid
- Riskerar att användaren beter sig annorlunda om dem vet att den testas

Kontrollerat experiment:
- En del av systemet
- Användaren är inkluderad, de som ska använda systemet sen. Kan mäta tillfredsställelse hos användare
- En testperson som sitter i ett labb och sitter bakom glass, miljön gör att störande moment rensas bort
- Dyrare
- Tar längre tid
- Riskerar att användaren beter sig annorlunda om dem vet att den testas

Question 20

Utvärdering
Metoder
Utan användare

Answer 20

Heuristisk utvärdering (inspektions/expertmetod):
- Använda när användare ej är tillgängliga samt vill behålla testet hemligt
- Går snabbt
- Billigt
- Funkar på stora system
- Användare har inget inflytande och därefter svårt att mäta tillfredställelse

Kognitiv genomgång (inspektions/expertmetod):
- Testar en del av systemet, en funktion
- Avända när användare ej är tillgängliga samt vill behålla testet hemligt
- Billigt
- När bara en del av systemet skall testas
- Mer detaljerad än heuristisk
- Inte lika snabb

Question 21

Heuristisk

Answer 21

Visibility of system status
Match between system and real world
User control and freedom
Consistency and standards
Error prevention
Recognition rather than recall
Flexibility and efficiency of use
Aesthetic and minimalist design
Help users recognize, diagnose, recover from errors
Help and documentation

Question 22

Fråga 1: Koncept och begrepp

Denna fråga handlar om begreppen Begränsningar och Signifiers.

1.
Begränsningar (constraints) är restriktioner eller hinder som är avsiktligt inbyggda i
designen av en artefakt, gränssnitt eller ett system för att påverka och styra hur
användare interagerar med dem. Dessa begränsningar används för att förhindra
felaktiga eller oönskade handlingar och för att göra användningen av produkten eller
systemet mer intuitiv och användbart.
Ett exempel är Fysiska begränsningar som innebär att fysiska egenskaper hos en
artefakt begränsar hur användaren kan interagera med den.

2.
Begränsningar (constraints) är restriktioner eller hinder som är avsiktligt inbyggda i
designen av en artefakt, gränssnitt eller ett system för att påverka och styra hur
användare interagerar med dem. Dessa begränsningar används för att förhindra
felaktiga eller oönskade handlingar och för att göra användningen av produkten eller
systemet mer intuitiv och användbart.
Ett exempel är Fysiska begränsningar som innebär att stora användargrupper har
samma uppfattning om hur saker ska genomföras. Trafikljus är ett exempel på fysisk
begränsning.

3.
Väl utformade begränsningar i ett gränssnitt leder till att användaren kan utnyttja
kunskap i världen för att förstå hur systemet ska användas.

4.
Otydligt utformade begränsningar i ett gränssnitt kan leda till att användaren
missförstår gränssnittet. Utvärderingsgapet blir därmed smalt.

5.
Signifiers ger användaren omedelbar återkoppling efter att en handling utförts.

6.
Signifiers utgör de attribut på en design som signalerar hur man använder eller
interagerar med ett objekt.

7.
Signifiers utgör de attribut på en design som signalerar hur man använder eller
interagerar med ett objekt.
Exempel på detta kan vara att en knapp inbjuder till att tryckas på, en spak inbjuder till
att bli dragen osv, utan att användaren direkt förstår vad effekten blir

8.
En design som utnyttjar signifiers resulterar ofta i krångliga och otydliga gränssnitt, där
användarens kunskap i världen ofta sammanfaller med utförandegapets omfång.

Answer 22

3
5
6

Question 23

Fråga 2: Designmönster och Interaktionsartefakter

Kollektivtrafiken i staden Göteholm består av busstrafik och pedeltågstrafik med många
olika linjesträckningar. På huvudkontert arbetar schemaläggare med att
schemalägga chaufförer och lokförare. De måste ta hänsyn till vem som har semester,
om någon är sjukskriven, antal timmar arbetade per vecka för att undvika övertid i
onödan osv.
Chaufförer och lokförare arbetar ofta på olika linjer olika delar av dagarna och måste
kunna se var de ska byta med nästa chaufför respektive lokförare. De ska också kunna
meddela huvudkontroret om de upptäcker problem av något slag medan de arbetar,
antigen någon typ av problem med bussen eller tåget, eller vid hållplatser och perronger,
eller orsaker till eventuella förseningar.
Du har fått i uppdrag att välja designmönster och interaktionsartefakt/er
för schemaläggare och för chaufförer och lokförare.

Answer 23

För schemaläggare (på huvudkontoret):
Meny:
En menystruktur kan användas för att organisera olika funktioner för schemaläggning, som att hantera semester, sjukskrivningar, och övertid. Det kan finnas separata menyer för olika arbetsuppgifter.

Sökning:
En sökfunktion kan vara användbar för att snabbt hitta tillgängliga chaufförer eller lokförare för specifika tider eller linjer. Det underlättar också att söka efter tillgängliga resurser vid behov.

Formulär:
Schemaläggare kan använda formulär för att ange och ändra arbetstider, hantera semesteransökningar och rapportera sjukfrånvaro. Detta ger en strukturerad och användarvänlig metod för att mata in och uppdatera information.

Interaktionsartefakter:
Skärm med tangetbord och mus, gör arbetet snabbar och mer effektivare. De kan bekvämt fylla i all information samt smidigare gå runt alla flickar och kan manipulera data/(informationen på ett mer effektivare sätt.

För chaufförer och lokförare:

Meny:
En meny kan användas för att ge chaufförer och lokförare snabb åtkomst till information om deras scheman, byten och eventuella meddelanden från huvudkontoret. Menyn kan också innehålla funktioner för att rapportera problem.

Karusell:
En karusell eller tidslinje kan vara användbar för att visa chaufförer och lokförare deras scheman och byten över tid. Det gör det enkelt att se kommande arbetspass och eventuella byten.

Formulär:
Chaufförer och lokförare kan använda formulär för att rapportera problem eller avvikelser under sitt arbete. Det kan inkludera möjligheten att ange specifika detaljer om eventuella problem med fordonet eller förseningar.

Interaktionsartefakter:
Touchscreen vore lämligast eftersom de kan snabbt se över sina schema, ändra, meddela m.m. Med hjälp av en touch screen kan detta göras vart och närsom, med endast Interaktionsartefakter.

Question 24

Fråga 3. Designprocessen

Du jobbar som designer på en byrå. Du och dina kollegor håller på att utveckla en ny app
åt ett företag som har en stor kundkrets.
Ni jobbar enligt double diamond processen. Just nu vet ni i stort sett ingenting om de
tänkta användarna och behöver åtgärda detta på något sätt.

Besvara nedanstående frågor

1. Förklara Double Diamond processen i grova drag och förklara vilken fas som bäst
   beskriver ovanstående scenario.
2. Din nya kollega har redan börjat skapa snygga prototyper i figma, och visar stolt
   upp dem på ett projektmöte. Är detta ett bra sätt att arbeta i detta skede? Förklara hur
   du resonerar.
3. Ge exempel på hur ni kan utvärdera eventuella data ni samlar om användarna

Answer 24

1. Double Diamond är en designprocess som innefattar fyra faser, indelade i två diamantformer. De två första faserna är “Discover” och “Define”, där man undersöker och definierar problemområdet. De två sista faserna är “Develop” och “Deliver”, där man skapar och implementerar lösningar. Processen betonar divergent och konvergent tänkande för att generera och sedan välja de bästa lösningarna.
   I detta scenario skulle “Discover”-fasen bäst beskriva situationen, eftersom ni i stort sett vet ingenting om de tänkta användarna. I denna fas samlar ni information, utforskar användarnas behov och definierar problemet.
2. I detta fall skulle det vara mer förståndigt att börja med forskning, användarintervjuer och andra metoder för att få en djupare förståelse för användarna innan ni går vidare till prototypskapande.
   Det är viktigt att först genomföra forskning och förstå användarna och deras behov innan man börjar utforma lösningar. Prototyper är vanligtvis ett verktyg för att visualisera och testa idéer, men om de skapas utan en solid förståelse för användarna kan det leda till att man fokuserar på fel problem eller lösningar.
3. Användartestning: Genomför tester med potentiella användare för att se hur de interagerar med prototyper eller befintliga system.
   Användarintervjuer: Fortsätt att intervjua användare för att fördjupa er förståelse för deras behov och preferenser.
   Dataanalys: Analysera kvantitativa data, om tillgängligt, för att identifiera mönster och trender.

Question 25

Fråga 4, Tillgänglighet
I denna fråga tänker vi oss ett system där användaren måste interagera
med röststyrning, och formulär, och karusell för att uppnå sitt mål med användandet.
Hur pass lämpliga är dessa designval om en användare har följande förutsättningar:
okontrollerbara och kraftiga skakningar i händerna?
Använd metoden WCAG

Answer 25

Röststyrning:
WCAG-principer: Operable, Perceivable
Lämplighet för användare med skakningar i händerna: Bra
Röststyrning kan vara en bra alternativ interaktionsmetod för personer med okontrollerbara skakningar i händerna. Det minskar behovet av exakt finmotorisk kontroll och ger användaren möjlighet att utföra uppgifter genom röstkommandon. Se till att röstkommandona är tydliga och enkla att förstå och att systemet har stöd för olika röstvariationer.

Formulär:
WCAG-principer: Operable, Understandable
Lämplighet för användare med skakningar i händerna: Begränsad
Traditionella formulär kan vara svåra för personer med kraftiga skakningar. Användarvänliga designval inkluderar stora knappar, tydlig beskrivning och möjlighet till validering av input. Alternativa interaktionsmetoder, som röststyrning eller alternativa inmatningsenheter, bör övervägas för att underlätta för dessa användare.

Karusell:
WCAG-principer: Operable, Perceivable
Lämplighet för användare med skakningar i händerna: Begränsad
Karuseller kan vara utmanande för personer med kraftiga skakningar eftersom de kräver noggrann navigering och pekfingermotorik. Det är viktigt att erbjuda alternativa navigationsmetoder, som till exempel stora knappar eller en listvy, för att underlätta för dessa användare.

Question 26

Fråga 5: Testmetoder

På säljsajten Trocket har man utvecklat en ny funktion för att kunderna ska kunna
betygsätta varan de just köpt. Funktionen innebär några få interaktionssteg, men man vill
utvärdera dessa steg noga. Det råder stor konkurrens med andra köp och säljsajter, så
man vill inte avslöja hur funktionen ser ut innan lansering, och det är viss tidsbrist.
Du skall se till att interaktionen med det nya systemet utvärderas enligt den lämpligaste
metoden

Answer 26

Eftersom de inte vill avslöja eller visa funktionen till allmänheten innan lansering, är det ej lämpligt att använda metoder som involverar anvädare. Eftersom funktionen inte är lanserad finns det ingen data att annalyseraras, därför går data analys även bort.

Vi får vända oss till de metoder utan användare, både heuristika och kognitiv genomgpng passar när ett tast skall hållas hemligt från almmänheten. Heuristiks skulle fungara i denna situation, eftersom den är billg, snabb samt fungarar över stora system, dock skulle jag föreslå kognitiv genomgång därför att, den är också billig och snabb, men den focuserar sig på en del av ett system, den ger även en mer detaljerad beskrivning än heurisktikt utvärdering.

En nackdel med kognitiv genomgång är bristen på användarfeedbaack, eftersom testen inte testas av en användare och kan därefter inte få feedbak på hur en verklig användare skulle anväda system samt vilka problem den skulle uppleva.
En annan nackdel, eftersom kognitv genom gångn återigen inte har någon kommuntikation med användarna, experterna kan identifiera de tekniskte problemen eller brister som finns i gränssnittet, men de kan ha svårt att förstå användanas verkliga behov och önskemål utan dirket kommunikation med målgruppen.