Articles

hur man utformar en app: den ultimata guiden

visste du att den genomsnittliga personen i USA spenderar cirka 5 timmar limmade till sina smarta enheter? Oavsett om det är meddelanden, publicera fotografier eller spel—den nuvarande digitala tidsåldern vi lever i har människor ständigt använder appar.

med massiv popularitet kommer massiv konkurrens, och medan konkurrens är bra (det håller oss på tårna och gör allt lite bättre), kan det vara ett skrämmande men givande företag att komma in i en värld där appar växer på träd.

om du har bestämt dig för att bygga en app är det en integrerad del av din framgång att komma på något som skiljer dig från tävlingen och kan vara skillnaden mellan att sticka ut och helt enkelt göra upp siffrorna. Att något är en fantastisk appdesign.

vackra gränssnitt, slående enkelhet och enkel navigering är 3 av de mest framträdande egenskaperna i en bra app. Du vill att folk ska berätta för sina vänner om din app, förstå dess syfte, ha en enkel tid att navigera genom den och se till att det är något de fortsätter att komma tillbaka till.

men hur skapar du en bra appdesign?

vår ultimata guide till appdesign är här för att hjälpa, och vi går igenom processen för hur man utformar en app som säkert kommer att bli en vinnare:

  • komma igång
    • ange målet för din app
    • gör en plan
    • Forskning din nisch och konkurrenter
  • Design och utveckling
    • skapa en wireframe
    • få din app utformad
      • alternativ för att få din app utformad
      • app design tips: Vad du ska hålla utkik efter Under app designprocessen
    • samla feedback på din design
    • få din app utvecklad
  • testa och starta
    • testa din app med en fokusgrupp
    • starta en betaversion
    • starta din app

komma igång—

Set målet med din app

räkningar iOS ansökan
design av googa

innan du kör för att tangentbordet, penna och papper är ett bra ställe att börja. Försök att tänka på varför du utformar en app och vad du tänker åstadkomma.

sätt på ditt tänkande lock och skriv ner svaren på följande frågor:

  1. Vad är det underliggande målet för din app? Vad vill du att den ska göra?
  2. Hur kommer du att göra din app tilltala användare?
  3. Vad tänker du göra? Vad är problemet du vill hjälpa människor att lösa med din app?
  4. Varför skulle folk vilja använda din app istället för en av dina konkurrenter? Hur skiljer det sig?

det är inte bara appdesign där målsättning är viktigt, det är en livslektion! Att sätta tydliga mål för din app och skriva ner dem ger dig en referens att komma tillbaka till under hela processen. Om du någonsin glömmer svaret på en av dessa frågor, att ha dem antecknade kommer att vara en bra referens för att hålla dig på rätt spår och på kurs för app världsdominans.

gör en plan

vänta! Gå inte till datorn ännu, du är inte klar med penna och papper.

bilda en visuell representation av svaren på dina målställningsfrågor och få ner dem på papper. Bild via skillapp.it.

Tänk på svaren på dina frågor i det första steget. Ta nu den informationen och skissera en översikt över ditt projektomfång. Under det här steget kan du gräva lite djupare i hur din app ska tjäna pengar (annonser, köp i appen etc.), vad du behöver din app för att göra och skissera en väg för var du ska ta dina ideer och hur du får dem att fungera i din app.

Tänk på det här steget som att rita en synlig färdplan över din app, vad dess funktioner är, vem den är till för och en mini-steg-för-steg-guide om hur du kan få den dit.

undersök din nisch och konkurrenter

Ja, ja, du kan lägga ner din penna nu och vända dig till world wide web.

AccountFeed webbdesign
undersök din marknad för att bättre förstå de problem som människor möter och hur din app kan lösa dem. Design av FaTiH.

forskning är ett integrerat steg i processen med appdesign. Det är viktigt att förstå nischmarknaden i din app och få en uppfattning om vad du står emot. Appvärlden är en extremt mångsidig och konkurrenskraftig arena, så du kommer definitivt att vilja se till att din unika IDE är exakt det.

låt dig inte skrämmas av vad du ser där ute. Bara för att det finns många appar som liknar vad du går för betyder inte att din inte kommer att vara den som trumpar dem alla. Att undersöka dina konkurrenter visar dig vad som saknas i deras appar och ger dig bättre tankar om vad du ska integrera i din egen.

försök att uppmärksamma recensioner-Vad tycker användarna för närvarande om apparna som redan finns där ute? Vad tycker de inte om, och hur kan du lösa detta problem? Under det här steget kan du också hänvisa tillbaka till dina skrivna och skisserade anteckningar, ändra vad du har nere och ytterligare få en uppfattning om hur du går vidare.

designa och utveckla din app

skapa en wireframe för din app

din wireframe är ett utkast till appens visuella arkitektur. Du tar dina mål och visuella skisser ett steg längre och skapar en grundläggande ”ritning” av hur din app ska se ut och hur den ska fungera. Du kan göra detta helt enkelt på papper först, men digitala wireframes gör det enklare, särskilt när dina wireframes blir mer komplexa och detaljerade.

hur gör du det här? Din wireframe är chansen att ta din vision och sätta den i gränserna för en mobil skärm. Oroa dig inte, du behöver inte göra några specifika designval ännu. Det här steget handlar om att komma med arbetsflöden och den övergripande strukturen i din app.

Axure iOS Flat Wireframe Template
din wireframe tar dina skissade ideer och ger dem en digital makeover—ett steg närmare att få en uppfattning om hur din app kommer att se ut i dina användares händer. Bild via UX / UI Land.

de tidigare stegen hjälpte till att ge dig en uppfattning om vad du vill att din app ska göra. Din wireframe är en mer detaljerad och specifik översikt över hur saker och ting ska fungera och vilka sidor och funktioner som behövs.

det finns en uppsjö av lättanvända wireframing verktyg där ute som du kan använda för att skapa dina wireframes. Se vilken som fungerar bäst för dig och börja få din appdesign till liv.

Här är några wireframing verktyg du kan använda:

  • Axure
  • Pidoco
  • iPlotz
Uber app wireframe
ett exempel på en wireframe för Uber app. Bild via Sketch App källor.

När du har lagt ut din wireframe har du en bra översikt över vilka sidor du behöver och hur din app ska fungera.

för att testa om dina wireframes är solida kan du skapa en klickmodell med ett verktyg som Invision. Detta gör att du kan klicka igenom skärmarna du har planerat och hjälper dig att testa om navigeringen du har ställt in är meningsfull.

visa dina wireframes till dina kollegor och vänner och samla in deras feedback om strukturen och navigeringen av din app. Se om dina testare tycker att det är intuitivt och om alla skärmar och element är vettiga för dem.

om du hittar några hakar i din navigering eller vill ordna om skärmar och layout kan du helt enkelt justera dina wireframes och testa igen. Fortsätt fram och tillbaka tills du är nöjd med dina wireframes.

få din app designad

färgrik minimal appdesign
appdesign av Nashrulmalik

Nu är det dags att tänka på den faktiska designen skapa snygga, realistiska mockups. Detta är ett super viktigt steg eftersom det är vad som kommer att lämna ett permanent intryck på dina användare, så skynda inte eller skimp när det gäller din appdesign. En snygg, professionell, vacker design är det som kan göra din app till en rasande framgång.

vilka färger, teckensnitt och designelement du ska använda är ett stort beslut, så vi pratar mer om detta i avsnittet designtips nedan.

När det gäller att bestämma hur du får din app utformad har du flera olika alternativ. Du kan överväga att designa din app själv, men om du inte är en grafisk formgivare skulle vi inte rekommendera det. Bättre att lita på en professionell för att vara säker på att du får ett bra resultat.

arbeta direkt med en designer

om du redan har en vision om hur din app ska se ut och du vet vad du vill och behöver, är det enklaste sättet att arbeta med en designer 1-till-1. Du kan antingen hyra en lokal frilansare eller—om du inte har några anslutningar till designers ännu-titta på olika designerportföljer online.

99designs designer sökverktyg
bläddrar designers med 99designs’ Designer sökverktyg

se till att titta på en designer tidigare arbete med din vision i åtanke för att hitta den perfekta matchningen i villkor för skicklighet och stil.

kör en app design contest

99designs app design brief
starta en tävling genom att fylla i en kort och låt designers veta vad du behöver.

Om du är osäker på vilket utseende du vill ha för din app och du letar efter förslag är ett bra alternativ att köra en appdesigntävling.

Du skriver en kort och designers från hela världen läser den och skickar sina ideer till din app. Du kan ge feedback för att förfina designen och i slutändan välja din favorit som vinnare.

använd en appbyggare

en annan designmetod är att använda en appbyggare. Precis som en webbbyggare kan appbyggare spara lite pengar jämfört med att anställa en full designer, men du måste vara mer praktisk och det kommer att finnas begränsningar för vad du kan göra. Tänk på om du vill ha komplex design och har specifika behov, det kan vara djupt för en byggare.

hyr en byrå

ditt slutliga val är det kompletta paketet, där du kan luta dig tillbaka och låta någon annan ta hand om allt: hyr en byrå för att bygga din app från grunden—inklusive designen. Detta är ett utmärkt val om ditt projekt är riktigt komplext och behöver mycket expertis inom olika områden. Ansträng dig för att nå ut till några av dem och få citat och ideer för att se om de passar bra för vad du vill ha gjort. Detta kommer utan tvekan att vara ditt dyraste alternativ, men om du vill att saker ska göras på ett visst sätt och ha resurser för att få det att hända är det ett tufft alternativ att slå.

oavsett vilket alternativ du väljer, var noga med att ge feedback och håll ett öga på om designen verkligen passar ditt varumärke och kommunicerar stilen och ser dig vart du går från början. Tappa inte bort de mål du satte i början och reflektera över om den slutliga designen verkligen säger vad du vill att den ska säga.

App Design tips: Vad man ska hålla utkik efter Under app designprocessen

Här är några viktiga tips att tänka på när det gäller att designa din app:

gör det enkelt att navigera:

en fantastisk app är ingenting utan enkel navigering, så design med detta i åtanke för att säkerställa en sömlös och trevlig upplevelse för dina användare.

Android app designs
när du utformar för Android, gör navigeringslådan lätt att hitta för att ge en sömlös upplevelse för dina användare. Bild via Viztek.

se till att navigeringslådan eller flikfältet är tydligt synligt för användaren. En användare kommer inte att kunna navigera i din app om de inte har någon aning om hur man gör det, så håll saker synliga för att se till att de vet vart de ska gå. Kom ihåg att hålla fast vid en layout som är bekant för dina användare, så att de vet intuitivt hur man navigerar genom din app.

ett annat viktigt tips: gör det fingervänligt. Om knappar och länkar är för små för att folk ska klicka på med fingrarna kommer de att ha svårt att navigera genom din app.

design för enkelhet:

Håll saker minimala för ett modernt utseende och använd generöst whitespace. Det gör att dina användare kan fokusera på det som är viktigast. Återigen kan du använda bekanta symboler och fraser för att hålla det enkelt och enkelt att använda.

design för enkelhet innebär att designa med målet att göra användarupplevelsen så trevlig och enkel som möjligt. För mycket information som presenteras på skärmen på en gång eller helt enkelt för mycket händer, och din användare kommer sannolikt att bli överväldigad och överge appen.

Suncorp Bank App design
Design av Sasha Radojevic.

Välj färger och teckensnitt medvetet:

färgpsykologi har en enorm inverkan, så underskatta inte deras effekt. På samma sätt kommer ditt val av teckensnitt att påverka utseendet på din app. Se till att tänka på de dolda betydelser som dessa designelement kommunicerar och välj dem noggrant. Kom också ihåg: du vill inte blanda för många olika färger och teckensnitt för ett konsekvent och professionellt utseende.

Om du har varumärkesriktlinjer med specifik färg och teckensnitt, var noga med att hålla fast vid dem i din appdesign så att din app blir en sömlös förlängning av ditt varumärke.

Tänk på visuell hierarki och vikt:

visuell vikt är storleken och effekten av olika element på skärmen jämfört med andra. Använd visuell vikt för att säkerställa att de viktigaste aspekterna av din design sticker ut.

en tydlig visuell hierarki hjälper användarna med orientering, så se till att hierarkin du skapar för sidor och undersidor samt rubriker och underrubriker alltid är konsekvent.

var konsekvent:

Silicon Valley banking startup app design
design för konsistens i din app gör det lätt att känna igen och håller det snyggt. Design av ozonestyle.

här är saken med färger och teckensnitt och alla de andra designelementen: de kan bara vara effektiva och lämna en positiv varumärkeseffekt om du är konsekvent. Detta gäller även annan grafik, navigering och ditt innehåll.

din app ska ha visuell konsistens (designelement som färger, knappar och etiketter), funktionell konsistens (din app ska fungera på samma sätt genom alla element) och extern konsistens (alla andra försäljningsställen som webbplats, systerappar ska likna din nya app).att vara konsekvent i hela din app får dig att se professionell ut och du kommer bättre att låta dina användare utveckla en relation med din app och ditt varumärke.

samla feedback på din design

Nu när du har bild-perfekta mockups är det dags att ringa in dina vänner, familj och till och med fiender (om du har några) och testa designen på din app. En renderad klickmodell gör det enkelt och ger dina testare en verklig känsla av hur appen kommer att se ut.

det är viktigt att notera att detta inte är din färdiga app, och det kommer att bli fler tester senare. Detta är i huvudsak ett test av layout, navigering, utseende och känsla, medan funktionalitet kommer senare.

Reseplandetaljer app
var inte rädd för att toppa över axlarna på dina provtagare medan de navigerar i din app. Detta låter dig se hur lätt de navigerar i din app eller var de hålls tillbaka. Design av subzero_.

ju fler människor du får prova din appdesign, desto mer feedback får du och därmed en bättre uppfattning om vad som fungerar bra och vad som behöver förbättras. Konstruktiv kritik kommer att vara din vän här, så var inte rädd för att gräva lite djupare med dina provtagare och ta reda på exakt vad de tycker. Är det för trångt? För intetsägande? Notera eventuella kommentarer som dina testare kan ha.

Om du har en renderad klickmodell, ta en titt över axeln på dina provtagare (men se till att andan är fin och fräsch först). Detta hjälper dig att visa hur de navigerar i din app och ger dig en synvinkel konsumentupplevelse.

När du har fått all feedback du behöver och har en god förståelse för vad som fungerar för dig och vad som kräver förbättring, kan du gå tillbaka och be din designer att göra nödvändiga justeringar.

få din app utvecklad

Nu är det dags att överlämna din design till din utvecklare eller utvecklingsteam. De kommer att koda den funktionella sidan av din app och se till att den faktiskt gör vad den ska göra. Troligtvis kommer de att gå fram och tillbaka med dig och din designer för att anpassa designen så att allt fungerar smidigt och för att ta reda på eventuella problem de stöter på under utvecklingsprocessen.

och voil kub, du har nu en funktionell app! Ta en titt tillbaka på målet för din app du bestämde dig för när allt började. Har du löst ett vanligt problem, medfört njutning för människor med en rolig skapelse eller förenklat människors liv på något sätt? Chansen är stor att du förmodligen har, och du har verkligen spikat den med din stjärndesign.

testa och starta

testa din app med en fokusgrupp

dagar tills app design
Ring in samplarna igen! Var öppen för konstruktiv kritik så att du kan göra de slutliga justeringarna av din app. Design av Deniel Lalla

nu har vi en fullt fungerande app att testa, så du vill se till att det är exakt det innan du ställer in det för release. Vid denna tidpunkt måste varje aspekt av appen fungera korrekt och visuellt tilltalande.

Kom ihåg de glada hjälparna som hjälpte dig att testa dina mockups tidigare? Ring killarna igen. Gör dem till din fokusgrupp och låt dem ha total frihet med din app.

försök att få all slutlig feedback du kan innan du bestämmer dig för ditt slutliga resultat. Om du arbetar med en designer och utvecklare, ta den konstruktiva kritiken du har och sätt dem på jobbet för att göra de slutliga justeringarna mot den färdiga produkten.

starta en betaversion

betatestning innebär att starta en betaversion av din app och göra den tillgänglig för tidiga användare i liten skala. På så sätt kan du se hur din app körs i en levande miljö och kontrollera hur användarna svarar på den.

TestFlight webbdesign
TestFlight är ett IOS-specifikt program för att styra betatestning av appar. Den slutliga feedbacken du samlar här gör att du kan tillämpa sista handen på din app. Bild via Sensor Tower.

låt dina användare veta att du skulle uppskatta deras feedback och använda den för att justera saker baserat på vad du ser och de kommentarer du får.när du har fått den feedback du behöver och en tydlig analys av hur din app ser ut och fungerar i en levande miljö kommer mållinjen att visas och du är redo att avslöja ditt mästerverk för världen.

starta din app

äntligen ljuset i slutet av tunneln! Du har planerat, testat, designat och testat lite mer och din app är redo att träffa hyllorna.

Pilly app design
app design av Ljuba97

Android kräver inte granskning innan du startar din app. Det betyder att du helt enkelt måste ladda upp din appfil till Google Play store (som med din beta) och människor kan börja ladda ner din app direkt. IOS är något annorlunda eftersom de kommer att granska din app innan den kan gå live. Oroa dig dock inte, om du har följt vår ultimata guide och har gjort allt korrekt, borde du inte ha några problem att få grönt ljus.

nu när din app är tillgänglig för massorna, sluta inte där. Fortsätt förbättra och uppdatera din app regelbundet för att ge dina användare den bästa upplevelsen.

underskatta inte heller vikten av nästa steg—marknadsföring. Att marknadsföra din app effektivt hjälper dig att få din app där ute och på dina användares telefoner. För att ta en titt på några intuitiva ideer om hur du marknadsför din nya mobilapp, kolla in den här användbara artikeln.

är du redo att ta appvärlden med storm?-

appar är en så dominerande aspekt av dagens affärsvärld och nu är du redo att skapa och designa en app som verkligen kan vända huvudet.

appdesignprocessen kan verka komplex, men om du följer den här guiden och delar upp den i små hanterbara steg blir det mycket lättare.

Så, vad väntar du på? Sätt på din designhatt och gör den fantastiska appens uppfattning om din verklighet.

letar du efter en fantastisk app design?
Här hittar du appdesigners som är perfekta för ditt projekt.