Interaktion
Not
Den här designguiden skapades för Windows 7 och har inte uppdaterats för nyare versioner av Windows. Mycket av vägledningen gäller fortfarande i princip, men presentationen och exemplen återspeglar inte vår nuvarande designvägledning.
Interaktion är de olika sätt som användare interagerar med din app på, inklusive pekfunktioner, tangentbord, mus och så vidare. Använd dessa riktlinjer för att skapa intuitiva och distinkta upplevelser som är optimerade för beröring men som fungerar konsekvent mellan indataenheter.
Designa för en touch-first-upplevelse
Först och främst utformar du din app med förväntan att touch kommer att vara den primära indatametoden för dina användare. Om du använder plattformskontrollerna kräver stöd för pekplatta, mus och penna/penna ingen ytterligare programmering, eftersom Windows tillhandahåller detta kostnadsfritt.
Tänk dock på att ett användargränssnitt som är optimerat för touch inte alltid är överlägset ett traditionellt användargränssnitt. Både ger fördelar och nackdelar som är unika för tekniken och programmet. I övergången till ett touch-first-användargränssnitt är det viktigt att förstå de viktigaste skillnaderna mellan touch (inklusive pekplatta), penna, mus och tangentbordsinmatning. Använd inte välbekanta egenskaper och beteenden för indataenheter för givna, eftersom touch i Windows 8 inte bara emulerar den funktionen.
Som du snart kommer att upptäcka kräver touch-indata en annan metod för användargränssnittsdesign.
Jämför krav för pekinteraktion
Den här tabellen visar några av skillnaderna mellan indataenheter som du bör tänka på när du utformar pekoptimerade Windows Store-appar.
Faktor | Touch-interaktioner | Interaktioner med mus, tangentbord, penna/penna | Pekplatta |
---|---|---|---|
Precision |
Kontaktområdet för en fingertopp är större än en enda x-y-koordinat, vilket ökar risken för oavsiktliga kommandoaktiveringar. |
Musen och pennan/pennan tillhandahåller en exakt x-y-koordinat. |
Samma som musen. |
Formen på kontaktområdet ändras under hela rörelsen. |
Musrörelser och pennstreck ger exakta x-y-koordinater. Tangentbordsfokus är explicit. |
Samma som musen. |
|
Det finns ingen musmarkör som hjälper till med mål. |
Musmarkören, penn-/pennamarkören och tangentbordsfokuset hjälper alla till med inriktning. |
Samma som musen. |
|
Människans anatomi |
Fingertoppsrörelser är oprecisa, eftersom en rak linjerörelse med en eller flera fingrar är svår. Detta beror på krökningen av handleder och antalet leder som är involverade i rörelsen. |
Det är lättare att utföra en rät linjerörelse med musen eller pennan/pennan eftersom handen som styr dem färdas ett kortare fysiskt avstånd än markören på skärmen. |
Samma som musen. |
Vissa områden på pekytan på en bildskärm kan vara svåra att nå på grund av fingerstatus och användarens grepp om enheten. |
Musen och pennan kan nå vilken del av skärmen som helst, medan alla kontroller ska vara tillgängliga via tangentbordet via flikordning. |
Fingerhållning och grepp kan vara ett problem. |
|
Objekt kan döljas av en eller flera fingertoppar eller användarens hand. Detta kallas ocklusion. |
Indirekta indataenheter orsakar inte ocklusion. |
Samma som musen. |
|
objekttillstånd |
Touch använder en tvåtillståndsmodell: pekytan på en visningsenhet är antingen vidrörd (på) eller inte (av). Det finns inget hovringstillstånd som kan utlösa ytterligare visuell feedback. |
En mus, penna och tangentbord exponerar alla en modell med tre tillstånd: upp (av), nedåt (på) och hovring (fokus). Med hovring kan användarna utforska och lära sig via knappbeskrivningar som är associerade med gränssnittselement. Hovrings- och fokuseffekter kan vidarebefordra vilka objekt som är interaktiva och även hjälpa till med inriktning. |
Samma som musen. |
Omfattande interaktion |
Stöder multi-touch: flera indatapunkter (fingertoppar) på en pekyta. |
Stöder en enda indatapunkt. |
Samma som touch. |
Stöder direkt manipulering av objekt genom gester som att trycka, dra, glida, nypa och rotera. |
Inget stöd för direkt manipulering eftersom mus, penna/penna och tangentbord är indirekta indataenheter. |
Samma som musen. |
Anmärkning
Indirekta bidrag har gynnats av mer än 25 års förfining. Funktioner som hovringsutlösta knappbeskrivningar har utformats för att lösa UI-utforskning specifikt för pekplatta, mus, penna och tangentbordsinmatning. Gränssnittsfunktioner som denna har utformats på nytt för den omfattande upplevelsen som tillhandahålls av touch-indata, utan att äventyra användarupplevelsen för dessa andra enheter.
Vi tillhandahåller några allmänna riktlinjer för användarinteraktion här och beskriver enhetsspecifika riktlinjer i dessa ämnen.
Visuella objekt för feedback
Lämplig visuell feedback under interaktioner med din app hjälper användarna att känna igen, lära sig och anpassa sig till hur deras interaktioner tolkas av både appen och Feedback om visuellt Windows-objekt kan indikera lyckade interaktioner, reläsystemstatus, förbättra känslan av kontroll, minska fel, hjälpa användare att förstå systemet och indataenheten och uppmuntra interaktion.
Visuell feedback är viktig när användaren förlitar sig på pekindata för aktiviteter som kräver noggrannhet och precision baserat på plats. Visa feedback när och var pekindata identifieras, för att hjälpa användaren att förstå eventuella anpassade målregler som definieras av din app och dess kontroller.
Optimera för noggrannhet
Touch-indata omfattar hela kontaktytan i fingret. Den här kontaktgeometrin används för att fastställa det mest sannolika målobjektet. Ändra storlek på kontrollerna för att säkerställa ett bekvämt användargränssnitt med objekt och kontroller som är enkla och säkra att rikta in sig på.
Storlek, utrymme och placera kontrollerna för att eliminera finger- och handocklusion, där användargränssnittet skyms av själva användarinteraktionen.
Placera menyer, popup-fönster och knappbeskrivningar ovanför kontaktytan när det är möjligt.
Begränsa för konfidens
Undvik eller minimera slarviga interaktioner med hjälp av användargränssnittsbegränsningar.
- Fästpunkter kan göra det enklare att stoppa på önskade platser. Fästpunkter anger logiska stopp i appens innehåll. Kognitivt fungerar snappunkter som en växlingsmekanism för användaren och minimerar trötthet från överdriven glidning, svepning eller rotation. Med dem kan du hantera oprecisa användarindata och se till att en specifik delmängd av innehåll eller nyckelinformation visas.
- Riktade "skenor" som betonar rörelseaxeln (lodrät eller vågrät).
Undvik tidsberoende interaktioner
Interaktioner bör inte särskiljas efter tid. Samma interaktion bör ha samma resultat oavsett hur mycket tid det tar att utföra den. Tidsbaserade aktiveringar medför obligatoriska fördröjningar för användare och förringar både den uppslukande karaktären av direkt manipulering och uppfattningen om systemets svarstider.
Tidsinställd interaktion beror vanligtvis på osynliga tröskelvärden som tid, avstånd eller hastighet för att avgöra vilket kommando som ska utföras. Tidsberoende interaktioner har ingen visuell feedback förrän systemet utför åtgärden och användarna måste nå godtyckliga och osynliga tröskelvärden för att uppnå ett resultat. Direkt visuell feedback under interaktioner gör att användarna känner sig mer engagerade, trygga och har kontroll.
Interaktioner som direkt påverkar objekt och efterliknar verkliga interaktioner är mer intuitiva, upptäckbara och minnesvärda. De förlitar sig inte på obskyra eller abstrakta interaktioner.
Obs! Ett undantag till detta är att du använder specifika tidsspecifika interaktioner för att hjälpa till med inlärning och utforskning (till exempel tryck och håll). Att använda lämpliga beskrivningar och visuella tips har en stor effekt på användningen av avancerade interaktioner.