Taxijakt. - En attraktiv applikation

Transkript

1 - En attraktiv applikation

2

3 Innehåll Uppdraget Bakgrund Uppdrag Avgränsningar 2 03 Arbetsprocessen 3 04 Analys Marknadsundersökning Gränssnittsanalys Nulägesanalys Problemanalys 7 05 Konceptförslag Funktionskoncept Designkoncept Vidareutveckling Slutligt koncept Navigering Applicerbarhet Rekommendationer Sammanfattning English summary Projektteam 26 3

4

5 01 Företag som arbetar strategiskt med design är mer innovativa, exporterar mer och behöver inte konkurrera lika mycket på pris. I norra Sverige finns ingen stark tradition att anlita designers vilket innebär att det bland företag i Norrbotten alltså finns en stor potential att växa och bli mer lönsamma - om fler skulle använda design som konkurrensmedel. Som ett led i detta behöver förståelsen för vad design kan åstadkomma öka och designtjänster göras mer lättillgängliga i länet. sammanför sex teknisk designstudenter vid Luleå tekniska universitet med åtta norrbottniska företag för att under sju sommarveckor utveckla konceptlösningar för produkter och tjänster samtidigt som studenterna utvecklar sitt eget företagande under handledning av affärsutvecklare. För de deltagande företagen innebär att ett dedikerat team av kreativa designstudenter arbetar för att öka deras konkurrenskraft och möjlighet att nå nya marknader genom att ta fram nya, innovativa konceptlösningar för produkter eller tjänster. För studenterna innebär ett sommarjobb med unika möjligheter att arbeta i skarpa designprojekt tillsammans med företag och bygga ett kontaktnät av potentiella uppdragsgivare samtidigt som de får coachning för att utveckla sitt eget företagande som designkonsulter. Dokumentet i din hand beskriver kortfattat utgångspunkt och resultat av sommarens arbete. 1

6 02 Uppdraget 02.1 Bakgrund är ett företag som jobbar med mobila tjänster för privatmarknaden..se är en webbapplikation som gör att man slipper vänta i telefonköer och det underlättar därmed för kunden att beställa en taxi. Det är främst privatpersoner som använder tjänsten vid nöjesresor men även affärsresande är en stor målgrupp Uppdrag Designteams uppdrag har varit att undersöka vad kunderna tycker om applikationen och se hur de interagerar med den. Utifrån detta togs förslag fram på förbättringar till hur användarvänligheten i applikationen kan förenklas, samt hur estetiken kan förbättras för att underlätta flödet. Dessa lösningsförslag bör sedan, i den mån det är möjligt, kunna implementeras på andra applikationer inom samma företag exempelvis eparkera.se och clubline.se Avgränsningar Tjänsten begränsades till att testas på Iphone, Android och dator. 2

7 03 Arbetsprocessen Projektet inleddes med ett möte med Fredrik Öhrn på där uppdraget och upplägget diskuterades. Han visade även appen och förklarade vad de ville ha hjälp med. En nulägesanays genomfördes för att få insikt i hur andra appar ser ut idag och vad som lockar användare när det kommer till design. En undersökning av gränssnitt och vad som bör finnas på en app eller hemsida utfördes också, för att få applikationen så användarvänlig som möjligt. En problemanalys gjordes genom att gruppen först själva testade applikationen och noterade de problem som stöttes på och även önskemål för förbättringar noterades. Därefter genomfördes en kundundersökning genom att låta andra testa applikationen och ställa frågor till dem. Problemen och önskemålen sammanställdes sedan som underlag vid konceptgenereringen. Applikationen delades in i olika problemområden, vilka låg till grund för konceptgenereringen. Varje problemområde diskuterades och olika lösningsförslag lades fram till varje del. Koncepten visualiserades genom bilder uppritade i Photoshop, där koncepten även kunde jämföras. För att ta reda på vilka kombinationer av knappar, menyer och övrig layout som fungerade bäst ihop tillfrågades potentiella kunder om deras åsikter. Utifrån deras svar sammanställdes tre alternativa lösningar varav gruppen valde ut en att arbeta vidare med till ett slutligt koncept. Konceptet visualiserades genom fotomonterade bilder på varje steg, insatta i en Samsung Galaxy Ace mobiltelefon. 3

8 04 Analys 04.1 Marknadsundersökning För att få en inblick hur andra liknande applikationer fungerar gjordes en konkurrentanalys där utseende och funktioner jämfördes mot den nuvarande designen på taxijakt.se. Den största konkurrenten, Taxikurir, har en heltäckande blå, ganska stilren applikation där menysystemet fungerar på så sätt att när användaren trycker i ett inmatningsfält hamnar man automatiskt i ett nytt fönster med fler inställningar. Det som fungerar sämre är att den har svårt att hitta adresser och därmed kan man inte komma vidare i applikationen. En annan konkurrent, Taxi Taxi, har vit bakgrund med tunna streck till inmatningsfält. Även här hamnar man i ett nytt fönster vid inmatning. Startsidan har ungefär samma information som taxijakt.se. Något som de båda konkurrerande apparna saknar, men som har, är en markering om i vilket skede av bokningen man befinner sig i. Konkurrenten Taxikurir Konkurrenten TaxiTaxi 4

9 04.2 Gränssnittsanalys Vid utformande av applikationer bör man fokusera på funktionaliteten och försöka att inte ha för mycket och avancerad information framme. Den ska vara enkel, intuitiv och responsiv, gärna genom visuell feedback. För att göra den så användarvänlig som möjligt bör man bland annat ha en avbryt-knapp där det finns en bekräfta-knapp. När applikationen laddar inför nästkommande sida bör en text förklara vad som händer och skriver man fel någonstans bör ett varningsmeddelande i rött komma upp. Hjälpmeddelanden kan hjälpa användaren att förstå vad som ska göras, men bör kunna stängas av, så att det inte blir ett störande moment för en van användare. För att användaren verkligen ska förstå hur appen fungerar kan man ha ett getting started -test första gången den används, där man går igenom steg för steg vad som ska göras. Hos enklare applikationer kan detta dock vara ett störande moment och borde därför också kunna stängas av. Designmässigt bör knappar och pop-up fönster ha någon form av skugga. Det gör att knapparna får en tredimensionell känsla och man uppfattar det som att pop-up fönstrena ligger separat. Någonting som kan locka användare är att kunna personifiera sin app, till exempel genom färger och fonter. Att ha olika färger på knappar är också något som gör att man lägger märke till dem och man kan förknippa färgerna med en viss funktion. För att ställa in ett nummer kan en slide där man ser spannet av nummer som går att välja vara att föredra, men då ska det gärna gå att även ställa in numret manuellt. 5

10 04.3 Nulägesanalys Som tjänsten fungerar idag kan den användas via olika enheter. Applikationen kan hämtas hem från appstore (Iphone) och googleplay.se (Android) som då länkar till taxijakt.se eftersom att det är en webbapplikation, det vill säga ingen nativeapp som även kommer åt telefonens egna menysystem. Servern känner av vilken enhet som kontaktar den och laddar appen för respektive enhet. Detta gör att applikationen skiljer sig åt på olika enheter. Så här ser applikationen ut på mobilen Samsung Galaxy Ace (Android). 1. Sök taxi 2. Välj bolag 3. Bekräfta 4. Tack för din bokning 5. Tidigare bokningar 6

11 04.4 Problemanalys Vid genomförandet av tester och kundundersökningar märkte gruppen en del problem och funktioner som saknades. En del saker som upptäcktes var problem som borde åtgärdas medan andra endast var önskemål från användarna. Nedan finns en lista över de mest relevanta problem och önskemål som dök upp i undersökningarna. Problem Bakåtknappen på Android-mobiler gör att man kommer ur applikationen. Det saknas en FAQ, köpvillkor och kontakta oss i applikationen. Varningstexter dyker inte upp om man skriver fel. Till exempel om man skrivit in ett ogiltigt telefonnummer. Man kan inte avboka en taxi genom applikationen. I slutsteget har man bara att välja på att bekräfta eller välja ett annat bolag. Man kan inte välja att avbryta. Info/hjälp knapp saknas. Information om att man inte måste betala i appliktionen saknas. Man kan inte byta språk. Användare tycker att ikonen för kartan är svår att förstå. Man kan inte komma tillbaka till nuvarande plats i kartan. Om man börjar skriva en adress i adressfältet och sedan trycker på kartikonen kan hamnar man ofta i en helt annan världsdel. Man kan inte skriva in studentrabatt eller eventuella andra rabatter. Önskemål En funktion för inställningar. Användare skulle kunna rekommendera appen till vänner genom exempelvis Facebook, Twitter och Google. Kunna tracka taxin. Kunna välja att åka via en adress. Kunna välja från sina favoritdestinationer. Man borde få ett bekräftels . Man borde kunna kryssa bort det man skrivit och inte behöva sudda allt i inmatningsfältet. 7

12 05 Konceptförslag 05.1 Funktionskoncept Till första presentationen fokuserades det endast på att identifiera problem med taxijakt-applikationen. Det som presenterades var därför förslag till lösningar på problemen. Det första viktiga beslutet var vilket sorts menysystem som skulle gälla. Ett vertikalt menysystem tyckte gruppen kändes mer lättöverskådligt än om det helt plötsligt dök upp en ny sida. Med ett vetikalt menysystem menas att man navigerar genom olika sidor till skillnad från ett där all information finns på samma sida och man får scrolla ner i applikationen. Följande förändringar gjordes: Logotypen minskades En språkvalsikon lades till Ett fält med via lades till då många inte åker direkt till slutdestinationen Fälten gjordes fristående för att få det mer luftigt De svarta knapparna togs bort och knapparna fick nytt utseende Sociala media så som Twitter, Facebook och Google plus lades till Bakgrunden fick en gradient i samma gula färg som i originalet Kartikonerna ändrades till googles standard Funktioner så som FAQ, inställningar, köpvillkor och lämna synpunkter lades under meny-knappen på mobilen I kartan lades en nuvarande position -knapp till för att snabbt kunna hitta tillbaka till där man är De svarta knapparna som vid varje steg tog användaren tillbaka till föregående sida lades under mobilens bakåtknapp Två nya funktioner vid bekräfta lades till. Dessa var tilläggsalternativen bekräftels och påminnelse En avbryt -knapp lades brevid bekräfta -knappen I tack för din bokning syns en timer till taxins ankomst och vilken mail bekräftelsen skickats till På sidan tidigare bokningar gjordes skillnad mellan aktiva bokningar och tidigare bokningar Timern syns på aktiva bokningar Två av dessa förändringar gick inte att genomföra, att ha en meny under telefonens menyknapp och att utnyttja telefonens bakåtknapp. Detta för att en webbapplikation som denna inte kommer åt telefonens funktioner. Även tankar på att byta inmatningssätt fanns men inte heller det gick att ändra av samma anledning. 8

13 Före Efter Före Efter 1. Sök taxi 2. Kartvy Före Efter 3. Välj bolag 9

14 Före Efter Före Efter 4a. Bekräfta, uppscrollad 4b. Bekräfta, nedscrollad Före Efter Före Efter 5. Tack för din bokning 6. Tidigare bokningar 10

15 05.2 Designkoncept För att få applikationen att kännas mer tilltalande ville uppdragsgivaren även att gruppen skulle undersöka hur det grafiska formspråket kunde göras om. En rad olika koncept togs fram, men fortfarande med funktionskoncepten som grund. Olika former och stilar testades. Det som fokuserades mest på var: Placering och val av menyknapp Placering och val av bakåtknapp Knapparnas utformning; kantigt eller rundat, storlek och om de skulle vara glasartade eller matta Fältens utformning, vilken form samt hur snävt allting fick vara för att fortfarande vara läsbart Färger Bakgrunder; enfärgat, gradient eller bild Hur man skulle visualisera vilket steg man är på Hur kartikonerna skulle se ut En del inslag av taxijakt.se föredrogs av användarna jämfört med de konkurrerande applikationerna. Ett av dem var att man ser i vilket skede av beställningen man befinner sig. Detta känns igen från flera betalsidor på Internet och gör att man känner sig säker på att ingen beställning gjorts förrän användaren aktivt bekräftat bokningen på sista sidan. Ett annat inslag som uppskattades i s applikation var att man, till skillnad från i konkurrenternas, inte flyttas till en ny sida när man ska skriva in addresserna. Detta gör att man som användare lättare förstår stegen och känner igen sig, Då dessa två inslag redan fungerade bra behölls de därför vid utformandet av designen på konceptförslagen. På nästa sida visas de konceptförslag som gruppen framställde. Koncepten exemplifierades genom visualisering av förstasidan. 11

16 bild på alla koncept Konceptförslag 12

17 Konceptförslag 13

18 05.3 Vidareutveckling Efter att ha visat koncepten för ett antal användare och fått feedback och kommentarer på dessa gjordes en sammanställning av vad som ansågs mest attraktivt. Dessa attribut gjordes om till tre helt nya koncept som alla hade olika formspråk och uttryck, se bild nästa sida. - Överlag ansågs en glasartad knapp med färg (beroende på bakgrund) mest tilltalande. - Menyraden högst upp kunde antingen bestå av knappar eller bara markerade fält. - Inmatningsfälten fick gärna vara separerade från varandra för att ge distinkta avgränsningar. - Sök taxi -knappen tyckte de flesta användarna såg snyggast ut då den inte var lika lång som de övriga fälten. - Texten som förklarar i vilket skede av bokningen man är fungerade bra i originaldesignen. Eftersom den tydligt visade aktuellt steg behölls den layouten. 14

19 Tre koncept i skala 1:1, Koncept 1, Koncept 2 och Koncept 3 15

20 06 Slutligt koncept Det koncept som gruppen valde att vidareutveckla till ett slutligt koncept var koncept 3 som har en svart/vit bild på skyskrapor i bakgrunden och en utstickande färgklick på knapparna. Att den övre menyraden är svart är på grund av att den inte ska konkurrera ut och ta blicken från den orangea bekräfta-/gå vidare-knappen som är av större vikt vid fortsatt navigering. Denna design känns spännande och estetiskt tilltalande samtidigt som den inte upplevs som alltför rörig. Bakgrunden bör därför vara svart/vit och gärna lite nedtonad. Att just New York har valts som bakgrund är för att många ser staden som någonting exklusivt och spännande; en modern stad i framkant. Dessutom förknippar man ofta New York just med dess gula taxibilar. Det var även den design som fick mest positiv feedback i användarundersökningarna. Följande uppslag visar en visualisering av navigeringen genom applikationen från startsida till tidigare bokningar. 16

21 Slutgiltigt koncept 17

22 06.1 Navigering 1. Sök taxi 2. Meny 3. Laddar 4. Välj bolag 18

23 5. Bekräfta 6. Tack för din bokning 7. Tidigare bokningar 19

24 1. Sök taxi. På sidan sök taxi gjordes en rad förändringar. Kartikonen byttes till en pin som lättare skulle kännas igen. Sök taxi -knappen gjordes kortare. När användaren först klickar i från/till rutan dyker favoriter upp i en rullmeny sammanlänkad med rutan. Om denne sedan fortsätter skriva tre bokstäver så dyker alternativ med samma bokstavskombination upp där istället, precis som sökfunktionen på google.se fungerar. För att åka via en destination kommer denna upp som ett alternativ ovanför favoriter i till-fältet. 2. Meny. De funktioner som saknades eller var placerade på separata knappar återfinns nu under en menyknapp uppe i högra hörnet, då appen inte har åtkomst till mobilens menyknapp. Det största problemet med att applikationen avslutas vid användande av mobilens tillbakaknapp har lösts genom att placera en bakåtknapp uppe i vänstra hörnet. Den har återigenkänningsfaktor då även Iphone använder en pil för att navigera sig bakåt som är placerad på samma ställe. 3. Laddar. När applikationen laddar kan användaren få en bättre blick över bakgrunden. 4. Välj bolag. Sidan där taxibolaget väljs fungerade bra som den var. Det enda som ändrades var att bolagen separerades från varandra med rutor samt att ändra sökning -knappen togs bort och ersattes med bakåtknappen i menyraden. 5. Bekräfta. På denna sida lades bekräftels och påminnelse till. Påminnelsen räknar ned tiden till taxins ankomst och är tänkt att vara kopplad till taxins gps. Bekräfta-knappen kompletterades med en avbryt-knapp som då tar användaren tillbaka till startsidan som då är nollställd. Bekräfta-sidan gjordes även om så att all information syns utan att behöva scrolla. Detta innebar att inmatningsfälten gjordes smalare och välj ett annat bolag -knappen togs bort och ersattes med bakåtknappen i menyraden. 6. Tack för din bokning. På tack för din bokning -sidan gjordes gör en ny sökning -knappen om till en tillbaka till startsidan - knapp. Om användaren valt att få ett bekräftels eller en påminnelse på föregående sida syns detta även här. 7. Tidigare bokningar. Tidigare bokningar gjordes om så att aktiva bokningar fick en upplyst ram för att skilja dessa från äldre bokningar. Om användaren valt att få ett bekräftels eller en påminnelse syns detta även här. 20

25 06.2 Applicerbarhet Tanken var att utformningen av -applikationen skulle kunna implementeras på de två andra applikationerna Eparkera och clubline.se. Att få in konceptet sexighet, enligt uppdragsgivarens önskemål, på Eparkera var lite svårt med tanke på att den fortfarande skulle kännas seriös och stilren. Därför valdes bakgrundsbilden bort då denna inte hade något med Eparkera att göra. Knapparna och menyerna kunde däremot återanvändas från taxijakt.se men med ett färgtema som gick ihop med den nuvarande designen av Eparkera. För att göra den ännu mer stilren slogs knapparna ihop och många av alternativen som kändes onödiga att ha på förstasidan hamnade under menyknappen. På Clubline-applikationen fungerar utformningen och temat väldigt väl. Något som skulle kunna läggas till är personliga inställningar så som att ha vimmelbilder i bakgrunden och ett galleri med vimmelbilder under en menyknapp. Även live-kameror över de olika klubbarna skulle kunna vara ett alternativ om sådant finns. Bakgrunden gör att applikationen känns mer modern och ger en känsla av en stad full av liv. Före Efter Före Efter Eparkera Clubline 21

26 22

27 07 Rekommendationer För att få ytterligare feedback på funktionerna och designen på applikationen bör ytterligare användarundersökningar göras, åtminstone under en kortare period. Under menyn skulle i sådana fall ett alternativ att skicka in synpunkter finnas. Alternativt skulle en kampanj kunna utföras där man uppmanas att ladda ner och använda applikationen och skicka in sina åsikter. Många användare är studenter, som får ett rabatterat studentpris vid taxiresor. Under fliken Kampanjkod på första sidan borde man därför kunna skriva in student och få priset uträknat automatiskt. Ett annat alternativ vore att man skulle kunna klicka i en ruta för studentpris eller andra eventuella rabatter som finns. Bakgrunden som valts till applikationen är den som flest personer tyckte kändes attraktiv och sexig. Skulle däremot en annan bakgrund väljas kan övrig layout lätt anpassas till den. Man skulle även kunna ha en funktion som gör att man kan personifiera applikationen genom att välja olika designteman. Dock kanske applikationen inte används tillräckligt ofta för att något sådant skulle locka användarna. Gruppen valde att lägga störst fokus på designen till taxijakt.se och det har därför endast gjorts enkla konceptförslag till clubline och eparkera. Dessa konceptförslag skulle behöva mer undersökningar och designarbete för att bli fulländade. 23

28 08 Sammanfattning är ett företag som skapat en tjänst där kunder kan boka taxiresor genom en webbapplikation eller en enkel hemsida. Där kan kunden se vilka bolag som finns, vad det kostar samt hur snart man kan bli upphämtad. Dessutom slipper man telefonköer och eventuella missförstånd med adresser. Användarmålgruppen är privatpersoner som använder appen vid nöjesresor men även affärsresenärer är en stor målgrupp. Applikationen är relativt ny på marknaden och därför vill ha hjälp med att utveckla designen samt att hitta eventuella användarproblem. Designen idag är väldigt enkel och önskar att göra den mer åtråvärd och sexig. Arbetet inleddes med kundundersökningar och undersökningar om gränssnittsutformning och webbdesign. Designen skulle sedan även kunna appliceras på två andra applikationer som taxijakt har nära samarbete med; Eparkera och Clubline.se. Efter undersökningarna togs först ett förslag på funktionskoncept fram som mest rör användarvänligheten av applikationen. Där lades fokus på utförandet steg för steg, för att användaren ska kunna använda applikationen så smidigt som möjligt. En delpresentation av funktionskonceptet hölls med, där företaget fick komma med synpunkter och fortsatt utveckling diskuterades. Då funktioner och steg hade bestämts fortsattes arbetet genom att fokusera på designen gällande färg, utformning, ikoner med mera. Ett flertal designkoncept utvecklades och efter kundundersökningar smalnades koncepten ner och sammanställdes som tre designförslag. Ett av förslagen ansågs att bäst följa kraven och presenterades som ett slutligt koncept. Delar av designen anpassades sedan även på Eparkera och clubline.se. 24

29 09 English summary is a company that has developed a service where customers can book their taxi trips through a web application or a simple webpage. They enable the customer to see the available taxi firms, the costs for each of them and how soon they can pick you up. In addition to that, you don t have to be put on hold on the telephone or get your address misunderstood. The target group consists of individuals that use the application for personal travels and business travelers. The application is relatively new on the market and therefore wants some help with developing the design and finding possible user oriented problems. The design today is very simple and wishes to make it more attractive and sexy. The development process started with investigative user tests and researches regarding interface layout and web design. The final design was also supposed to be modified and applied to two other applications; Eparkera and clubline.se. After the researches, the group created a functional concept mostly regarding user-friendly design. Focus was on the execution of the application, going through it step by step, to make it as user-friendly as possible. This concept was presented to, that commented on and discussed further development of the concept with the gruop. When the functions and the different steps of the application had been decided, the process continued by focusing on the design regarding color, layout, icons etc. A number of design concepts were developed and, after a user test, narrowed down and visualized as three concepts. One of them was concidered to best meet the requirements and was presented as the final concept. Parts of the design was applied to Eparkera and clubline.se. 25

30 10 Projektteam Gruppen har bestått av Thérése Östergren och Tanya Edman Projektledare Karoline Pettersson Handledare Johan Bergström Handledare David Larsson 26

31 Henrik Norberg Designkonsult Johan Larsson Designkonsult Kristin Kammensjö Designkonsult Olof Nordström Designkonsult Tanya Edman Designkonsult Thérése Östergren Designkonsult

32 ger åtta norrbottniska företag en unik möjlighet att arbeta tillsammans med unga kreativa studenter i skarpa designprojekt för att utveckla nya innovativa koncept för produkter och tjänster samtidigt som studenterna får möjlighet att utveckla sitt eget företagande. är ett nystartat företag som har avsikten att hjälpa privatpersoner att lätt få tag på en taxi. För att ta reda på vad kunderna tycker om deras mobilapplikation har de tagit hjälp av. Uppgiften har varit att göra kundundersökningar och egna tester på webbapplikationen taxijakt.se. Utifrån dessa resultat har sedan nya koncept och lösningsförslag tagits fram. Denna rapport beskriver hela konceptutvecklingsprocessen.