Oavsett vilken typ av app du skapar, skapat eller planerar att skapa, kan designfel vara dödliga när det gäller antagande och användning. Användare vill ladda ner appar som är roliga, funktionella och erbjuda värde under flera användningsområden. Användare vill också ha apps som är estetiskt tilltalande och kräver inte mycket ansträngning att interagera med.
Problemet för designers är att vi ibland är så nära ett projekt att vi saknar skarpa misstag i design och användbarhet eftersom vi vet hur det fungerar. Idag ska vi hjälpa dig att göra en mental checklista över misstag att leta efter och undvika i appdesign.
(Obs! Alla inkluderade mönster är från appar som gör det rätt, så du får en bra dos av visuell inspiration.)
1. Dålig första visning
En bra app börjar med ett bra första intryck. Det borde vara självklart, men om användarna är avstängda av din nedladdningssida eller första intryck när de öppnar appen är chansen att de inte kommer att interagera med det igen. Det är viktigt att göra ett bra första intryck.
Hemskärmen bör laddas snabbt och ge en lättförståelig och tydlig åtgärd för användarna. Berätta för dem vad de är här att göra. Påminn dem om orsaken till att de hämtade appen i första hand.
De nödvändiga åtgärderna ska vara lätta att hitta och utföra och bor alla bor i en snygg och organiserad behållare som speglar den visuella stilen hos ditt varumärke och resten av appens innehåll.
2. Inga handlingsbara signaler
Vad har din app gjorts för att göra? Hur kommunicerar du det med användarna?
Designen bör innehålla många visuella signaler som hjälper användarna att förstå exakt vilka åtgärder som ska vidtas, vart ska man röra skärmen och vad som ska hända. När det gäller att visualisera denna information, gå tillbaka till designteori för grunderna:
- Färg: Ljusa färger drar ögat och är ett bra alternativ för tappable elements.
- Utrymme: Lämna gott om utrymme runt nyckelelement så att de är lätta att hitta och röra.
- Typografi: Använd enkla, rena teckensnitt - ofta med enhetliga slagbredd - i en storlek som passar för skärmen. Varje instruktion bör vara klart läsbar.
- Berätta för användare där de är eller visa deras nuvarande tillstånd. (Exempel: Färgändringar för Hover State-färg.)
- Reagera när en åtgärd utförs (detta inkluderar framgång och misslyckande). (Exempel: Succesmeddelande när en blankett skickas in.)
- Berätta för användarna vad som händer eller vad som ska hända nästa. (Exempel: Navigationspilar eller ett svänghjul för lastning).
3. Rörlig design
Den största fel i många appar är röran. Det är som om designern försöker få varje enskild del av appdesignen, oavsett om det är ett spel eller verktyg eller nyhetsflöde, på en enda skärm.
Glöm det!
Appar är utformade för att fungera på små skärmar. Att försöka göra för många saker på en gång är överväldigande för användarna.
Tänk på varje skärm? som en enda behållare för ett enda element. När du flyttar till nästa skärm kan en ny information visas. Användare kommer att svepa och bläddra om innehållet är engagerande. Och de är ännu mer benägna att göra om designen är ren och lättillgänglig.
4. Touch-elementen är för små (eller för nära)
Akta dig för feta fingrar. Element som är för nära varandra eller för små för att knacka utan att zooma är ett problem för användarna.
Se till att det finns gott om plats runt varje element för att eliminera oavsiktliga klick. Det finns ingen magisk formel för detta utrymme, men när det är fel vet du det. (Bara kika på dina analyser.)
Så här skapade jag min skala. Jag lånade en vän med stora händer. Drog en cirkel runt pekfingret och det är min riktlinje. Knappen behöver inte vara så stor, men det tappbara området ska vara. Och ingenting borde vara närmare.
På grund av detta är kort och behållarelement att klicka för åtgärder trevliga. Det betyder att det som du vill knacka på i ett område som är relaterat till innehållet tar alla användare till samma plats. (Det är designvänligt och användarvänligt.)
5. Icke-standardiserade ikoner eller åtgärder
Det finns ingen anledning att återskapa ikonografi för dina projekt. Facebook-länken ska vara en? F? inuti en knapp; Twitter bör representeras av en fågel. Varför? Eftersom varje användare vet exakt vad dessa element är och vad de gör. Så varför skulle du ändra det?
Inkorporera standardikonografi och handlingsbara signaler i designen. Det sparar tid och kommer att bidra till att förhindra användarfrustration.
6. Design inkonsekvenser
Allt inom en enda app ska se och arbeta på samma sätt. Eftersom en användare navigerar djupare i gränssnittet bör han eller hon börja ha förväntningar på vad som ska komma och hur det fungerar.
När de lär sig appen måste de uppfylla dessa förväntningar estetiskt och operativt. Detta inkluderar allt från färg och typ val till användarverktyg och hur de fungerar.
7. Ofullständiga Feedback Loops
Varje interaktion ska mötas med en lika och motsatt reaktion. (Det är en av lagarna i digital fysik, eller hur?)
Feedback ger användaren en känsla av kontroll med att engagera sig i en app och det ger dig värdefull information om hur användarna engagerar sig. Feedback hjälper också användarna att fatta beslut och gör gränssnittet enkelt.
Återkopplingsslingan ska
8. Inte synkroniserad med plattformen
Är du en iPhone eller Android-användare? Ställ den här frågan i ett trångt rum och du kommer att få massor av oskyddade svar. Kom ihåg detta när du designar och släpper en app.
Det ska vara synkroniserat med plattformens estetik där den laddas ner. Det kan till och med innehålla två lite olika versioner av appen.
Android och iOS-riktlinjer hjälper dig att göra det här ganska enkelt. Men du måste ta hänsyn till hela gränssnittet. Tänk bara på den ensamma skeuomorfiska appikonen på din iPhone-startskärm som ber om att bli raderad.Säg vad du vill om den nya Instagram-logotypen, till exempel, men det matchar faktiskt gränssnittet nu.
9. Gränssnittet är för komplicerat
Det är ett vanligt problem med spelapps - de är alldeles för komplicerade. När du räknar ut det, vill du inte spela längre.
Gränssnittet ska vara enkelt. Det ska vara skannbart. Det ska vara lätt att förstå och använda utan en bruksanvisning.
Allt annat är bara för komplicerat.
För de flesta användare, och appen hämtas för att lösa ett problem. Varje app är en lösning. (Du använder inte samma app som ett larm och spelar ett spel, eller hur?) Kom ihåg att när du befinner dig i designfasen. Vad är problemet du försöker lösa? Lös det och fortsätt.
10. Glömmer att ställa in standardvärden
Standardvärden i formulär och interaktiva element kan vara en stor hjälp för användare. Betrakta dem för att vara ett litet visuellt genombrott. Standardvärden kan innehålla allt från en förkodad preferens (mest vanligt val eller ett nollalternativ) i listor och kryssrutor, instruktionstext i inmatningsfält eller något annat exempel som illustrerar vad som ska hända.
Standardinställningar är användbara eftersom de kan göra det lättare för användaren genom att visa dem hur man använder appen, vilket ger ett alternativ för användare som är osäkra (som i fallet med nullstandard) och genom att påskynda hela interaktionen.
Standardvärden är också en bra bit av feedback för dig också, särskilt för formulär, eftersom de bidrar till att minska antalet fel och med en? Null? alternativ vet du omedelbart att användaren inte gjorde ett val.
Slutsats
Nu är det dags att sätta din stora appidé i aktion. Du kan använda det här inlägget som en checklista eller påminnelse för att hjälpa dig genom kvalitetsstyrningsprocessen för att säkerställa att din app är lika bra som den kan vara visuellt och vad gäller användbarhet. Lycka till!
Vilka mördare misstag märker du i appar eller webbplatser? Jag skulle gärna höra från dig om saker som bara driver dig galen. Låt oss prata på Twitter.