{"id":114,"date":"2014-05-13T15:48:19","date_gmt":"2014-05-13T15:48:19","guid":{"rendered":"http:\/\/www.neovita.com\/thoughts\/?p=114"},"modified":"2016-01-17T07:55:26","modified_gmt":"2016-01-17T07:55:26","slug":"android-bryt-inte-gestaltningslagarna","status":"publish","type":"post","link":"https:\/\/www.oninteractions.com\/thoughts\/android-bryt-inte-gestaltningslagarna\/","title":{"rendered":"Android: Bryt inte gestaltningslagarna!"},"content":{"rendered":"

Jag ville bara byta spr\u00e5k p\u00e5 tangentbordet p\u00e5 min nya Android-telefon. Efter flera f\u00f6rs\u00f6k lyckades jag, men jag blev frustrerad. Min teori \u00e4r att problemet ligger i att Androids interaktionsdesigners inte f\u00f6ljer gestaltpsykologins gestaltningslagar.<\/strong><\/p>\n

F\u00f6r en vecka sedan skaffade jag min f\u00f6rsta mobil med Android som operativsystem (\u201dOS\u201d). Jag vill ha mina mobiler med engelska som systemspr\u00e5k men med svenskt tangentbord. N\u00e4r jag startade min nya telefon valde jag d\u00e4rf\u00f6r engelska om spr\u00e5k. Hur jag skulle g\u00f6ra f\u00f6r att byta till svenskt tangentbord var dock obegripligt. Efter diverse f\u00f6rs\u00f6k att f\u00f6rst\u00e5 inst\u00e4llningssystemet och frenetiskt googlande s\u00e5 r\u00e5kade jag hamna p\u00e5 r\u00e4tt st\u00e4lle och kunde byta till svenskt tangentbord.<\/p>\n

Nu, en vecka senare och efter att ha anv\u00e4nt telefonen dagligen har jag en teori om vilka problemen \u00e4r. Ett av dem handlar om visuell hierarki och gruppering. Vyerna f\u00f6r inst\u00e4llning av tangentbordsspr\u00e5k i Android har flera olika problem, s\u00e5 h\u00e4r kommer jag anv\u00e4nda inst\u00e4llningsvyerna f\u00f6r Ljud som exempel.<\/p>\n

Interaktionsdesign<\/h2>\n

Det finns hundratals inst\u00e4llningar i operativsystem f\u00f6r smartphones och de \u00e4r d\u00e4rf\u00f6r uppdelade p\u00e5 olika \u201dsidor\u201d och \u00e4ven grupperade p\u00e5 respektive sida. Alternativen m\u00e5ste kommunicera m\u00e5nga saker samtidigt f\u00f6r att jag ska f\u00f6rst\u00e5 vad jag kan st\u00e4ller in och vad som just nu \u00e4r inst\u00e4llt. Det \u00e4r en sv\u00e5r utmaning f\u00f6r informationsarkitekter som jobbar med vad alternativen ska heta och hur de ska grupperas.<\/p>\n

Det \u00e4r \u00e4ven en utmaning f\u00f6r interaktionsdesigners som arbetar med hur gruppering, klickbarhet och beteende representeras. Gestaltpsykologis lagar hj\u00e4lper oss interaktionsdesigners att f\u00f6rst\u00e5 hur personer tolkar v\u00e5rt inneh\u00e5ll.<\/p>\n

Gestaltningslagar<\/h2>\n

Inom gestaltpsykologin finns teorier om att objekt kan upplevas som en grupp om de \u00e4r placerade ihop, ser likadana ut, insluts av en ram, r\u00f6r sig i samma riktning och\/eller hastighet med mera.<\/p>\n

Ett enkelt exempel \u00e4r:<\/p>\n

^^^\u00a0 ***<\/p>\n

I denna lilla figur upplever m\u00e5nga att det finns tv\u00e5 grupper med tecken, en grupp med tre cirkumflex (^) och en annan grupp med tre stj\u00e4rnor. Tv\u00e5 gestaltlagar f\u00f6rklarar denna gruppering: Likhetslagen och N\u00e4rhetslagen. Gestaltpsykologi p\u00e5 Wikipedia.<\/a><\/p>\n

Alla inst\u00e4llningar<\/h2>\n

Inst\u00e4llningarna i iOS, Android och Windows Phone baseras p\u00e5 en vertikal lista med alternativ. Genom att klicka p\u00e5 alternativ \u00e4ndrar man antingen en inst\u00e4llning eller visar en ny lista med alternativ.<\/p>\n

\"F\u00f6rsta<\/a>
F\u00f6rsta listan med inst\u00e4llningar i Android, iOS och Windows Phone<\/figcaption><\/figure>\n

I f\u00f6rsta listan med inst\u00e4llningar i Android och iOS kan man g\u00f6ra vissa inst\u00e4llningar direkt (st\u00e4nga av Wi-Fi och Bluetooth respektive Airplane Mode) men de flesta alternativen leder till ny lista med inst\u00e4llningar.<\/p>\n

Inst\u00e4llningar f\u00f6r ljud<\/h2>\n
\"Ljudinst\u00e4llningar<\/a>
Ljudinst\u00e4llningar i Android, iOS och Windows Phone<\/figcaption><\/figure>\n

Det finns m\u00e5nga typer av inst\u00e4llningar som kan g\u00f6ras f\u00f6r ljud p\u00e5 en mobiltelefon. Ut\u00f6ver ringvolym handlar det om ringsignal, notifieringsljud, vibration, ljud n\u00e4r man skriver p\u00e5 tangentbord med mera. Ljudinst\u00e4llningarna i alla operativsystemen \u00e4r d\u00e4rf\u00f6r uppdelade i grupper.<\/p>\n

iOS<\/strong> har delat upp inst\u00e4llningarna i grupperna \u201dVibrate\u201d, \u201dRinger and Alerts\u201d, \u201dSounds and vibration patterns\u201d och en fj\u00e4rde grupp utan rubrik.<\/p>\n

Grupperna \u00e4r visuellt separerade genom att alternativ \u00e4r vita medan rubriker och tomrum mellan grupper visas med gr\u00e5 bakgrund. Kontrasten mellan grupp-rubriker och alternativ \u00e4r ocks\u00e5 stor tack vare att rubriker \u00e4r mindre, ligger p\u00e5 gr\u00e5 bakgrund och uppfattas som m\u00f6rkgr\u00e5 medan alternativ har stor text som \u00e4r svart p\u00e5 vit bakgrund.<\/p>\n

Vart alternativ visar sin status p\u00e5 ett av tre s\u00e4tt: p\u00e5\/av-knapp, ljudvolym-v\u00e4ljare eller genom namnet p\u00e5 det valda alternativet. Alternativ med en underlista visas med en > till h\u00f6ger.<\/p>\n

Windows Phone<\/strong> har fyra grupper med inst\u00e4llningar.<\/p>\n

OS:et anv\u00e4nder ej grupprubriker men alternativ \u00e4r separerade med tomrum. Jag tycker att l\u00e4nken \u201dH\u00e4mta fler\u201d \u00e4r placerad lite f\u00f6r l\u00e5ngt fr\u00e5n knappen f\u00f6r att v\u00e4lja ringsignal (\u201dNokia Tune\u201d \u00e4r vald just nu) men i \u00f6vrigt \u00e4r alternativen visuellt grupperade.<\/p>\n

Vart alternativ visar sin status p\u00e5 ett av tre s\u00e4tt: p\u00e5\/av-knapp, namnet p\u00e5 det valda alternativet eller kryssruta. Alternativ med underlista visas med den spartanska form som knappar ska ha i detta OS.<\/p>\n

Android<\/strong> anv\u00e4nder grupprubrikerna \u201dCall ringtone and vibrate\u201d och \u201dSystem\u201d men har \u00e4ven en tredje grupp med ett alternativ: \u201dVolumes\u201d.<\/p>\n

Vart alternativ i grupperna separeras med ett tunt streck medan det under grupprubrikerna finns ett tjockare streck. En liten aning tomrum anv\u00e4nds ocks\u00e5 ovanf\u00f6r grupprubrikerna f\u00f6r att separera dem fr\u00e5n f\u00f6reg\u00e5ende inst\u00e4llning.<\/p>\n

Vart alternativ visar sin status p\u00e5 ett av tv\u00e5 s\u00e4tt: namnet p\u00e5 det valda alternativet (\u201dTitania\u201d \u00e4r vald ringsignal just nu) och kryssruta.<\/p>\n

Inst\u00e4llning av ringsignal<\/h2>\n
\"Val<\/a>
Val av ringsignal i Android, iOS och Windows Phone<\/figcaption><\/figure>\n

Vid klick p\u00e5 ringsignal-alternativet visas en lista med ljud. Denna \u00e4r snarlik i de olika operativsystemen.<\/p>\n

Problemen \u2013 visuell hierarki och gruppering<\/h2>\n

Vyerna \u201dAlla inst\u00e4llningar\u201d och \u201dInst\u00e4llning av ringsignal\u201d \u00e4r tydliga och ganska lika i de tre OS:en. Problemen finns fr\u00e4mst i vyn \u201dInst\u00e4llningar f\u00f6r ljud\u201d p\u00e5 Android.<\/p>\n

F\u00f6rst och fr\u00e4mst saknar alternativet \u201dVolumes\u201d n\u00e5gon indikation p\u00e5 att det \u00e4r ett alternativ snarare \u00e4n n\u00e5gon form av rubrik eller ledtext. I alla tre OS \u00e4r alternativ som leder till listor ritade helt \u201dplatta\u201d \u2013 de \u00e4r inte ritade som \u201dknappar\u201d med 3D-k\u00e4nsla. Men p\u00e5 iOS finns > till h\u00f6ger och b\u00e5de Windows Phone och iOS visar det valda alternativet. Det g\u00f6r \u00e4ven Android ibland, men av n\u00e5gon anledning inte f\u00f6r just alternativet \u201dVolumes\u201d. N\u00e4r man trycker p\u00e5 \u201dVolumes\u201d kan man st\u00e4lla in ring-, musik- och alarmvolym separat. Jag misst\u00e4nker att formgivaren tyckte det var sv\u00e5rt att visa vald volym f\u00f6r dessa tre inst\u00e4llningar, men det \u00e4r helt klart m\u00f6jligt, om \u00e4n med lite anstr\u00e4ngning.<\/p>\n

Androids grupprubriker \u00e4r mindre distinkta \u00e4n grupprubrikerna p\u00e5 iOS och jag tycker att \u00e4ven tomrummet som \u00e4r grupp-avdelaren p\u00e5 Windows Phone \u00e4r effektivare \u00e4n Androids kombination av tomrum, rubrik och streck. B\u00e5de Windows Phone och iOS har mycket h\u00f6gre inst\u00e4llningsvy f\u00f6r Ljud. Kanske har Androids designers varit r\u00e4dda f\u00f6r att ge oss anv\u00e4ndare h\u00f6ga vyer, men jag skrollar hela dagarna s\u00e5 min tumme orkar! Jag tycker helt enkelt att Androids designers har varit mesiga \u2013 mer tomrum och tydligare streck skulle hj\u00e4lpa mig att se att grupperna finns.<\/p>\n

Alternativet Volumes utg\u00f6r en egen grupp (med bara ett alternativ) men saknar grupprubrik.<\/p>\n

I inst\u00e4llnings-vyerna f\u00f6r Ljud bryter Android mot N\u00e4rhetslagen genom att inte l\u00e5ta grupperna vara separerade nog. Android bryter \u00e4ven mot Likhetslagen genom att i samma vy bara ibland visa valt alternativ. Android skulle kunna anv\u00e4nda sig av Slutenhets- eller konturlagen f\u00f6r att \u00f6ka tydligheten kring grupperna ytterligare.<\/strong><\/p>\n","protected":false},"excerpt":{"rendered":"

Jag ville bara byta spr\u00e5k p\u00e5 tangentbordet p\u00e5 min nya Android-telefon. Efter flera f\u00f6rs\u00f6k lyckades jag, men jag blev frustrerad.<\/p>\n","protected":false},"author":1,"featured_media":115,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[8,10,5],"tags":[],"series":[],"class_list":["post-114","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-behavior","category-critique","category-information-architecture"],"acf":[],"jetpack_featured_media_url":"https:\/\/www.oninteractions.com\/thoughts\/wp\/wp-content\/uploads\/2014\/05\/settings.png","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.oninteractions.com\/thoughts\/wp-json\/wp\/v2\/posts\/114","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.oninteractions.com\/thoughts\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.oninteractions.com\/thoughts\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.oninteractions.com\/thoughts\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.oninteractions.com\/thoughts\/wp-json\/wp\/v2\/comments?post=114"}],"version-history":[{"count":6,"href":"https:\/\/www.oninteractions.com\/thoughts\/wp-json\/wp\/v2\/posts\/114\/revisions"}],"predecessor-version":[{"id":696,"href":"https:\/\/www.oninteractions.com\/thoughts\/wp-json\/wp\/v2\/posts\/114\/revisions\/696"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.oninteractions.com\/thoughts\/wp-json\/wp\/v2\/media\/115"}],"wp:attachment":[{"href":"https:\/\/www.oninteractions.com\/thoughts\/wp-json\/wp\/v2\/media?parent=114"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.oninteractions.com\/thoughts\/wp-json\/wp\/v2\/categories?post=114"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.oninteractions.com\/thoughts\/wp-json\/wp\/v2\/tags?post=114"},{"taxonomy":"series","embeddable":true,"href":"https:\/\/www.oninteractions.com\/thoughts\/wp-json\/wp\/v2\/series?post=114"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}