Användargränssnitt för appdesign

App Design UI: De 9 bästa tipsen för att ge en fantastisk användarupplevelse

Mobilappar ger företag och designers möjlighet att nå fler människor än någonsin tidigare. Företagsägare är inte längre begränsade till att nå ut till kunder via telefon, e-postkampanjer eller i butiken. Idag är ditt företag tillgängligt dygnet runt via en webbplats och mobilappar som går med användare överallt. Genom att utveckla en app kan du skicka push-meddelanden till användare och möta en viss uppsättning kundbehov.

Tyvärr fungerar inte alla appar som de ska. Vissa är direkt frustrerande och ger lite mening för användaren. Att skapa ett bra användargränssnitt för appdesign och upplevelse (UX) för mobil är inte så enkelt som det låter. Forskare förutspår att 2020, mobilappar kommer att generera cirka 188.9 miljarder dollar i intäkter. Det finns fortfarande gott om utrymme för tillväxt, men det finns också några designmetoder som inte fungerar bra. För varje bra app finns det tre som inte översätts bra i verkliga livet.

Användare har möjlighet att välja mellan tusentals appar. Om du vill att din ska fånga användarnas intresse för ett hav av andra val, måste det sticka ut. Ett sätt att uppnå en app som folk använder ofta är att fokusera på användarupplevelsen. Varje designer har olika sätt att skapa appar, men de har alla gemensamma element. Här är nio sätt att leverera bästa möjliga upplevelse till dina mobilanvändare.

1. Spendera tidsplanering

Innan du skapar ett enda element i app design UI, spendera tid på att planera vilket problem det löser och dess övergripande struktur. Gräva i personas av de personer som troligen laddar ner appen, så att du känner till publiken du försöker nå. Att förstå din publik korsar alla aspekter av utvecklingen, från layouten för din navigering till hur du marknadsför din programvara.

Vissa designers använder wireframing för att skapa en slags ritning för sin design. Detta gör det möjligt för appskaparen att testa olika element och se hur de fungerar i programmets arkitektur. Det sparar tid eftersom du kan bestämma vad som kan skapa problem innan du spenderar timmar på att koda något som inte fungerar i appen. Tänk på användarens ålder och till och med hur stora deras händer kan vara - större knappar fungerar bättre för män som till exempel har större händer än kvinnor.

2. Utveckla för typ av enhet

Även om iOS är populärt finns det en procentandel av människor som alltid kommer att ha en Android. Du kan välja att utveckla endast för en eller båda. Om tiden tillåter, fortsätt och skapa appar för båda systemen. Medan du kanske slutar få fler nedladdningar på Apple än Google Play, kommer du att möta behoven hos alla dina användare - oavsett vilket operativsystem de använder. Tänk också på att beteendet hos Android jämfört med iPhone varierar, så du måste ta hänsyn till hur varje segment använder sina smartphones och surfplattor.

Undersök dina nuvarande kunder och fråga om de äger iOS eller Android. Om 90 procent av dina kunder använder iOS kan det vara det bästa valet för din budget och tidsöverväganden att släppa din iOS-kompatibla app först. Även om det är smart att erbjuda båda alternativen bör du alltid fokusera på var du kan få mest valuta för pengarna först och sedan lägga till på andra plattformar när du har råd.

app design UI

Mindmeister är ett mind-mapping-verktyg som fungerar bra för brainstorming och projektsamarbete. MindMeister är tillgängligt online och för mobila enheter och kan användas för både iOS och Android. En av fördelarna med denna speciella app är att den integreras över flera enhetstyper. Om du äger en Android-surfplatta och en iPhone kan du sömlöst använda de olika versionerna av appen från båda artiklarna utan att förlora ett tak.

3. Dela stora uppgifter i deluppgifter

Tänk på hur människor använder sina smartphones. Den typiska användaren tar tag i sin telefon i ett väntrum eller kör i en tunnelbana till och från jobbet. De har kanske inte en timme på sig att slutföra en stor del av en uppgift, men om du delar upp stora funktioner i mindre kan personen göra saker som tiden tillåter. Användare kanske inte gillar oändlig rullning, så att bryta ner åtgärder för att passa på en enda skärm åt gången är en förbättring av den totala UX.

Ett sätt att se till att dina stora uppgifter är genomförbara för upptagna människor är att testa systemet. Ställ in en timer i 30 sekunder och se om du kan slutföra jobbet på den tiden. Om inte, hur kan du bryta ner det ytterligare, så en del av det är klart på 30 sekunder? Du vill också skapa din app, så om en användare måste lämna processen lite och återvända, kommer den att fortsätta där användaren slutade.

4. Skapa en rik upplevelse

Du har hört rådet att hålla saker enkelt, men det betyder inte att din app ska vara tråkig. De senaste smartphonesna har höga skärmupplösningar och erbjuder bilder och videor i HD. Det är viktigt att hitta en balans mellan rich media inom dina appar och hastighet. Grafiken måste optimeras för att laddas snabbt, men ändå vara djärv och skarp, så att användarna är visuellt nöjda.

Kom ihåg att dina användare har andra val, och de har beslutat att använda din app istället. Om du inte håller dem underhållna och engagerade riskerar du att förlora dem till en konkurrents app. Din måste vara både visuellt tilltalande och mycket användbar.

app design UI: bästa 9 tips Bästa användarupplevelse för din mobilapp

Hotell ikväll använder levande bilder som gör att användare vill resa till olika platser där de kan boka ett rum via sin app. Fokus för dess funktioner är funktionalitet, men appen ignorerar inte designens estetik och skapar en fin blandning av bilder och element. Handlingsuppmaningarna sitter ofta ovanpå bakgrundsbilden.

Att skapa en app kan verkligen hjälpa ditt varumärke att växa snabbare. Google Sök apputveckling nära mig om du letar efter någon lokal.

Kontakta oss för att lära dig mer om våra apputvecklingstjänster.

5. Skapa ett tydligt steg i steg

När du flyttar användare genom de olika delarna av deras resa, gör det klart vad nästa steg blir. Om användaren klickar på en åtgärdsknapp, skjut omedelbart skärmen till nästa steg. Du kan också använda element som att nummerera saker: Steg 1, Steg 2 och så vidare.

En annan idé är att använda ikoner, till exempel pilar, för att visa användaren vart han ska gå vidare. Enkla ord, som "Rulla ned" eller "Svep åt vänster", ger människor en tydlig riktning och gör din app enkel nog för även nybörjare.

6. Markera samtal till handling med färg

Leverera en fantastisk användarupplevelse för din mobilappEn serie kontrasterande färger uppmärksammar uppmaningar till handling (CTA) och visar tydligt användarna vad de behöver göra för att använda appen. När du väl vet vem dina användare är får du en bättre uppfattning om vilka färgknappar som fungerar bäst för att fånga deras uppmärksamhet och driva dem framåt genom appens funktioner. Du kan också genomföra delade tester för att se vilka färger och knappstorlekar som fungerar bäst för din specifika publik.

Det finns olika studier om färgen på CTA som vissa experter tycker fungerar bäst, men andra studier strider mot resultaten. Avhämtningen är att olika färger, former och placering fungerar bäst för olika typer av publik, så du måste hitta den bästa kombinationen för de resultat du söker.

Mobilapp UX: Markera samtal till handling med färg

Hwy 55 hamburgare, shakes och pommes frites appen använder röda och rosa knappar som dyker upp mot pastellbakgrunden. Användarens ögon spårar efter knapparna, och de vet att de ska utföra en av de åtgärder som anges, till exempel att skanna ett kvitto eller se deras belöningar. Färgerna matchar paletten på företagets hemsida och i dess restauranger, medan de använder favorit nyanser från 1950-talet och sätter en ton av en rolig tid i historien.

7. Skapa en stilguide

När ditt användargränssnitt för din app är ute ett tag vill du erbjuda uppdateringar och ytterligare funktioner. När du har släppt din app och testat för användbarhet, skapa en detaljerad stilguide. Du förstår vad dina användare tycker om din app och kan lägga till detaljer i handboken, som du bör följa för alla framtida uppdateringar.

Om dina användare älskar större knappar eftersom de är babyboomers och har problem med att se liten text på små knappar, bör din stilguide ange det. Å andra sidan, om din publik är årtusenden och de föredrar skimmbart material, lägger du till detaljer i din guide om hur förklaringarna är korta eller bildbaserade.

Din stilguide bör innehålla information om färgpalett, knappstilar, språkinställningar - första person, andra person, tredje person - och till och med andra funktioner du vet fungerar särskilt bra. Ange föredragna metoder och element att undvika för att förbli konsekventa.

8. Skär röran

Med tiden lägger du till funktioner i din app. De kan dock också skapa röran på skärmen. Ingenting är lika förvirrande för användaren som 20 olika alternativ och osäkerhet om var man ska börja. För att skapa en verkligt användarvänlig app måste du skära röran och finjustera bara de vitala elementen. Eventuella ytterligare funktioner är prickiga och bör läggas till efter att ha behärskat grunderna.

Börja med att tänka på det primära syftet med din app. Vill du att användare ska kunna se vilka nya artiklar som har kommit till din butik den här veckan? Är din app avsedd att spåra hälsosam mat? Användaren ska kunna lägga till vad de åt genom att klicka på en enda knapp och skriva in objektet i sökfältet. Håll sakerna enkla och till sak, så kommer din UX automatiskt att förbättras.

bästa ux-mobilapptips

Hitta Mina Vänner är Apples app som gör det möjligt för människor att hitta familj och vänner i sitt område och se hur långt de är från att komma till ett besök. Det håller också koll på familjemedlemmar, som tonåringbarn. När du först loggar in på appen får du välja att se vem du redan är ansluten till eller lägga till vänner. Alternativen är enkla och till sak.

De enda elementen på den första sidan är knappar som låter dig titta eller lägga till. Du måste navigera till ett specifikt namn eller plats på kartan för att få mer detaljerad information. Appen fungerar perfekt för någon som anordnar en fest och vill se hur långt borta gästerna är från att anlända.

9. Tänk på fingerplacering

Att skapa mönster som fungerar bra med specifika enheter kräver kännedom om produkttypen. Tänk på hur de flesta människor navigerar på sina telefoner: Tummen är nära botten av skärmen. Lägg till navigeringselement så att de inte behöver nå dem och se till att göra dem så naturliga som möjligt.

Det enda sättet att skapa rätt placering är att testa det själv som designer. Lägg till exempel en knapp där du tror att det skulle vara lättast att komma åt, och betatesta sedan platsen och se om den är mer tillgänglig där eller behöver justeras. Det är också en bra idé att dra in ytterligare betatestare, eftersom vissa människor håller sina telefoner annorlunda än andra. Alla navigeringselement och knappar som ska användas måste vara så enkla att använda som möjligt.

Vi intervjuade flera UX-proffs om detta ämne. Här är deras svar på våra frågor;

Michael Prestonise på Global apptestning säger;

Hur planerar du din UX-strategi?

Vår UX-strategi planeras noggrant i syfte att leverera värde till kunden på ett sätt som är tekniskt genomförbart och hjälper verksamheten att uppnå sina mål. Att utforma den strategin innebär att aggregera resultaten från en mängd olika forskningsmetoder, inklusive kundintervjuer, kvantitativa dataanalyser, marknadsanalyser, kundsegmentering. Dessa aggregerade resultat utvärderas och prioriteras sedan för att identifiera viktiga möjlighetsområden.

Vilka verktyg använder du för UI / UX-design och varför?

För UI-design använder vi Figma. Detta är en helt webbaserad plattform som effektiviserar samarbete, eftersom det är lätt att dela arbete och design med alla som kan behöva bidra. På samma sätt som Google Docs kan allt som våra utvecklare behöver delas på distans och enkelt. När det gäller UX-design inkluderar de verktyg vi använder en anteckningsbok och penna (!), Whiteboard och samarbetsverktyg som Miro och Whimsical. Miro är ett utmärkt verktyg för fjärranslutna utvecklare, eftersom du kan genomföra retrospektiva workshops för att fråga vad som gick bra och vad som inte gick och rösta om ämnen att diskutera inom teamet.

Skapar du stilguider? I så fall vilka verktyg använder du och varför?

Vi har ett designsystem som hjälper oss att skapa konsekventa visuella upplevelser över en mängd olika plattformar (marknadsföringswebbplatsen, den kundinriktade applikationen, den testande applikationen osv.) UI-komponenter som hämtar deras stilar från designsystemet har finfördelats i Figma och tillåta designers att använda dem under hela processen.

JD Jordan vid MaxMedia nämner;

Hur planerar du din UX-strategi?

Vi börjar alltid med en upptäckt och rekommendationer - även för okonventionella UX-projekt, som mer traditionella varumärkes- och grafiska designprojekt. En av våra UX-kunder kommer att delta i intervjuer med användare och intressenter, konkurrens- och jämförande analyser och nuvarande lägesgranskningar när det är möjligt. Från denna forskning kommer vi att identifiera det gap som en lösning kan ha den bästa effekten. Ofta är detta en kombination av att utforma en förbättrad lösning och skapa en mer effektfull uppfattning. Denna process föreslår också en färdplan - vare sig det gäller ett eller flera projekt - som ofta kombinerar, UX, UI, front-end, innehåll och marknadsföring.

Våra lösningar är alltid unika eftersom våra kunder är det. Vi tänker mycket på empati. För det första, för att veta hur våra användare känner och vad de behöver gör oss till bättre designers. Det är grundläggande användarcentrerad design. Men att ha empati för det som är viktigt för våra kunder gör oss också till bättre partners. Vi utformar inte lösningar för oss själva, och det kan vara viktigast att komma ihåg med mobil design eftersom vi har så nära relationer med dessa enheter. Empati är det mest mänskliga som någon kan göra och vi har turen att få betalt för att göra det.

Vilka verktyg använder du för Ui / UX-design och varför?

Vi försöker vara agnostiska med verktyg men har förfinat en föredragen UI / UX-designprocess. Vi börjar alltid med penna och papper (eller penna och markörtavla) - även om det bara är mycket kort - innan vi flyttar i IA och trådramar. Flera av vårt team använder Axure för att trådrama eftersom dess verktygsuppsättning gör att nedladdningsarbetet arbetar tidigare med att komponera och prototypa. Alternativt flyttar det mesta av teamet rakt in i Sketch där arbetet kan övergå från låg till hög kvalitet i en enda fil. Skiss är också värdefullt eftersom den integreras bra med InVision och mästerligt med Zeplin, som vi använder för tillgångssamling, förberedelse och överlämnande till front-end-utveckling.

En av våra kunder föredrar Adobe XD men det här är inte vår normala process. Och vi använder aldrig Balsamic. Om du vill att något ska se ut handritat, rita det för hand.

Skapar du stilguider? I så fall vilka verktyg använder du och varför?

Alltid - även om det bara är för internt bruk. Dessa har olika former:

Meddelanden och varumärkesstandarder kan skapas med presentations- eller dokumentverktyg som Keynote eller Word. Vi försöker hålla dessa dokument levande så mycket som möjligt och föredrar starkt onlineformat som grundläggande WordPress-webbplatser så att stilhandledningsmaterialet kan utvecklas över tiden. En enkel PDF dateras den andra den skickas ut och länkar sällan till nödvändigt material.

UI-mönster och guider för stilstil är typiskt byggda med en kombination av Sketch och Zeplin. Den förstnämnda användningen av symboler översätts särskilt väl till den senare kodcentrerade publiken. Och igen, denna kombination lever och utvecklas över tid (t.ex. över sprintar och successiva projekt) för att minimera design- och utvecklingsskulden som skapas av statiska stilguider.

UX / UI-teamet på AiCure skriver;

Hur planerar du din UX-strategi?

Det finns ingen strategi som kan tillämpas på allt UX-designarbete, men en känslighet för följande faktorer är ett måste:
- Känn din målgrupp och förstå deras behov och smärtpunkter.
- Vilket problem löses.
- Vad är värdet av din designlösning.

Feedback är viktig: prototyp, test och lär dig mer om din produkt genom testning av användbarhet och tillgänglighet.

Vilka verktyg använder du för Ui / UX-design och varför?

Vi använder huvudsakligen Sketch, eftersom det gör att vi kan itera snabbt, är lätta, är väl integrerade med prototyp- och handoff-verktyg. Det har också många inbyggda plugins eller tredjeparts plugins som underlättar hela designprocessen.

Skapar du stilguider? I så fall vilka verktyg använder du och varför?

Ja, vi skapar stilguider som oftast är integrerade som en del av designsystemet. Design-systemet gör att vi kan vara 100% konsekventa och tillämpa modulär design som ger oss möjlighet att skala upp eller ner samt ta itu med flera formfaktorer i responsiv design.

Vilka verktyg använder du för Ui / UX-design och varför?

Illustrator och skiss, vektorbaserad programvara, bra färghantering antingen RGB eller CMYK.

 

Användargränssnitt för appdesign: UX är allt

När det gäller att skapa en app som folk laddar ner och öppnar regelbundet är användbarhet av yttersta vikt. Har du någonsin laddat ner en app som lät bra men som var svår att använda i verkliga applikationer? Du har sannolikt tagit bort den från din telefon och glömt allt om det. Din app måste uppfylla användarnas förväntningar så bra att de känner att de inte kan leva utan den.

Din app ska tillgodose ett behov som användaren har och sedan skapa något som gör deras liv enklare eller bättre. Ju mer du sätter dig i konsumenternas skor och möter dessa behov, desto mer framgångsrika blir dina mönster. Dessa nio tips bör göra det lättare att komma i kontakt med användare och förbättra deras upplevelse, så din app ses som en viktig del av deras liv.

 

Författare Bio

Lexie är grafisk formgivare och UX-strateg. Hennes arbete visas på Manta, Marketo, Website Magazine, Creative Bloq och Sunlight Media.

Kolla in hennes designblogg, Design Roast, och följ henne på Twitter @lexieludesigner.

2 Kommentarer

  • Niharika Kapoor November 15, 2019 vid 2: 12 pm

    Trevligt inlägg. Online matleveransapp hjälper restaurangverksamheten att växa och gör det enkelt för kunderna att beställa mat online.

    • Angelo Frisina November 16, 2019 vid 2: 14 am

      Tack Niharika. Ja verkligen. Apputveckling är en viktig komponent för företagsmarknadsföring i allmänhet.

Posta en kommentar

Kommentarer modereras. Din e-post hålls privat. Behövliga fält är markerade *