Kevin Reumkens
2012
Alles behalve babystapjes
Kevin Reumkens
2012
Loading...
Terug
Auteur: Kevin Reumkens (1988) Fontys Hogescholen Eindhoven ICT & Media Design
Studentnummer 2130815 Kevinreumkens@gmail.com Organisatie:
Fresh Fruit Digital Luchthavenweg 81.115 5657 EA Eindhoven Bedrijfsbegeleiders: Michiel Houben Michiel@sourcerepublic.com Matthijs Keij matthijs.keij@fresh-fruit.com Assessoren: Pieter Wels p.wels@fontys.nl Suzanne van Kuijk s.vankuijk@fontys.nl
Introductie
Tijdens het afgelopen semester heb ik onderzoek mogen doen voor Fresh Fruit Digital, dat gevestigd is op het Flight Forum in Eindhoven. Tijdens deze afstudeerfase heb ik mijn scriptie geschreven voor de opleiding ICT & Media Design aan de Fontys Hogescholen, evenals in Eindhoven. Fresh Fruit Digital is een onderdeel van het overkoepe-lende Green House Group, dat een samensmelting is van creatieve en technische ondernemingen. Fresh Fruit Digital is een online marketing bedrijf dat klanten een optimale marketing mix biedt.
Het werken bij Fresh Fruit Digital is mij uitstekend bevallen omdat ik mijn kennis op het gebied van het online wezen heb uitgebreid en samen heb gewerkt in een jonge en inspiratievolle omgeving. Buiten dit afstudeerproject om heb ik binnen de Green House Group ook veel geleerd over het reilen en zeilen in de online marketing business. Mijn onderzoek was gericht op mobiele Apps in de kinderkleding branche. Hierbij heb ik veel geleerd over de technische en grafische mogelijkheden en richtlijnen van mobiele applicaties. Daarnaast heb ik inzicht gekregen in de trends van mobiele applicaties binnen het komende jaar. Op algemeen vlak zijn bijvoorbeeld mijn onderzoeks-vaardigheden sterk ontwikkeld.
Ik wil van deze gelegenheid gebruik maken om diverse mensen te bedanken die een bijdrage hebben geleverd aan dit afstudeertraject. Mattijs Keij en Michiel Houben voor de begeleiding binnen Fresh Fruit Digital en de Greenhouse Group, Pieter Wels voor zijn begeleiding vanuit Fontys, Michel Kusters en Erik Driessen voor het sparren over afstuderen. Audrey Kawarmala voor haar steun en motivatie bij het schrijven van deze scriptie. Ook wil ik alle collega’s binnen de Green House Group bedanken voor hun uitstekende hulp.
Met deze scriptie breng ik buiten de mogelijkheden van een mobiele applicatie binnen de kinderfashion sector, ook de technische mogeli-jkheden van smartphones in het algemeen in kaart.
Ik hoop dat deze scriptie reflecteert met hoeveel plezier ik er de af-gelopen maanden aan heb gewerkt.
-Kevin Reumkens
Colofon
Voorwoord
Terug
Fresh Fruit Digital is een onderneming die zich bezighoudt met online marketing. Gevestigd in het European Business Centre werkt het nauw samen met andere online ondernemingen zoals Blue Mango en Source Republic. Onder de overkoepelende organisatie “Greenhouse Group werken deze bedrijven regelmatig samen aan projecten.
In de nabije toekomst wordt er binnen de Green-house Group een Kinderfashion vergelijkingssite gelanceerd. Om deze website van de grond te krijgen en aan de man te brengen is er besloten om te onderzoeken of een mobiele applicatie hier iets aan kan bijdragen.
Deze wens leidt tot de formulering van de vol-gende onderzoeksvraag en het beginpunt van een volwaardig afstudeerproject:
“Hoe kan een mobiel platform zo veel mogelijk bijdragen aan de interactie tussen een kinder-fashion vergelijkingswebsite en diens doel-groep?”
Deze ligt aan de basis van het in deze scriptie omschreven onderzoek.
Om deze vraag te beantwoorden is er gebruik gemaakt van diverse onderzoeksmethoden. Deskresearch heeft voornamelijk uitsluitsel ge-bracht over de technische mogelijkheden en de grafische richtlijnen van een mobiele applicatie. Fieldresearch is gebruikt om uit te vinden wat de doelgroep verwacht van een dergelijke applicatie en om concurrenten te onderzoeken.
Hieruit bleek dat een mobiele applicatie meer-waarde kan bieden voor een kinderfashion vergelijkingssite en dat de doelgroep ook bereid is deze te gebruiken. Er zijn specifieke rich-tlijnen waar men zich aan dient te houden bij
het ontwikkelen van een applicatie, deze zijn in deze scriptie vernoemd. De technische benod-igdheden zijn beschreven en hierbij is de beste ontwikkelingsmethode gekozen. Daarbij zijn de benodigde tools omschreven.
Aan de hand van deze conclusies is er een prototype ontwikkeld en kunnen de volgende aanbevelingen worden gedaan:
Hoewel de doelgroep nog niet heel erg gewend is aan vergelijken met een mobiele applicatie geeft deze wel aan hier het nut van in te zien. Door meerwaarde te bieden ten opzichte van een standaard website zijn mensen eerder bereid om de applicatie te gebruiken.
Ook al zijn mensen nog niet massaal bereid om transacties via een mobiel apparaat te doen, deze functie implementeren voor de toegang kan nooit kwaad. Trends wezen uit dat mobiele transacties het komende jaar populairder zullen worden. Tot die tijd kunnen de aankopen worden opgevangen door de gebruiker via de website op een laptop of desktop te laten betalen.
De technische mogelijkheden van smartphones en hun besturingssystemen gaan snel vooruit. Ook de technieken om applicaties te maken worden talrijker en omvangrijker. Het is aan te bevelen om dit te blijven onderzoeken voor toe-komstige applicaties.
Samenvatting
Terug
Fresh Fruit Digital is a company in the online marketing business. Vested in the European Business Centre and working closely to other online companies such as Blue Mango and Source Republic. Under the umbrella company of the Green House Group.
In the near future the Greenhouse Group will launch a children’s fashion website with the in-tention to let the audience compare kids fashion prices. To get this website off the ground, the decision has been made that research in mobile applications is crucial. So Fresh Fruit will have in-sight on how mobile applications can contribute. This wish led to the starting point of a worthy graduation assignment in which the following question is leading:
“How can a mobile platform contribute as much as possible in the interaction between children’s fashion and their target group?”
This is the basis for this thesis. In order to answer this question, several research methods have been used. Desk research mostly led to insights on the technical possibilities and the graphical guidelines of a mobile app. Field re-search is used to find out what the target group expects of a certain application, but also to investigate the competitors inside this branch. This revealed that mobile application offers an added value to a children’s fashion vertical. And the target audience is willing to use this. There exist specific guidelines to which one needs to comply when designing a mobile app. These are named in this thesis. The technical necessities are written and therefore a proper development method is chosen.
By these conclusions, a prototype has been developed and the following recommendations have been made:
Even though the target group is not used to comparing clothes using a mobile application, they do see the use of it. By offering added value in comparison to a standard website, the target audience is more willing to use an application. Even when the audience is not entirely willing to do transaction via mobile devices, implementing this function can do no harm. Research shows that the willingness to pay via mobile devices will increase in the coming year. Untill then, transac-tions can be done by the user through a website on their desktop/laptop by sharing the shopping-cart from the mobile app.
The technical possibilities of smartphones and their operating systems are innovating rapidly. The techniques to develop applications are becoming more elaborate and the ways to do so are increasing. It’s recommendable to keep researching on this matter for future applications.
Summary
Terug
Android:
Google Android is een open source bestur-ingssysteem voor mobiele telefoons gebaseerd op de Linuxkernel en het Java-programmeerplat-form.
App/Applicatie:
Computerprogramma waar iets mee gedaan kan worden, bijvoorbeeld tekstverwerken, tekenen, rekenen. Besturingssystemen zoals Windows en Linux vallen niet onder de noemer applicaties.
Appstore:
Een App Store is een online softwarewinkel waar software gekocht kan worden. De software, ook wel apps genoemd, omvat programma’s voor smartphones
Besturingssysteem:
Een besturingssysteem (ook wel: bedrijfssys-teem, in het Engels operating system of afgekort OS) is een programma (meestal een geheel van samenwerkende programma’s) dat na het opstarten van een computer in het geheugen ge-laden wordt en dat de functionaliteiten aanbiedt om andere programma’s uit te voeren.
CSS:
Cascading Style Sheets, HTML extensie voor het gebruik van sjablonen, met x-as, y-as en z-as, pagina`s erven opmaak van bovenliggend pagina`s
Framework:
Een softwareframework is een geheel van soft-warecomponenten dat gebruikt kan worden bij het programmeren van applicaties. Echter ook afspraken hoe die componenten gebruikt worden binnen een groep ontwikkelaars en welke code-standaarden en bibliotheken gebruikt worden kunnen ook onderdeel zijn van een framework.
HTML:
HTML of hypertext markup language is een markup-taal – afgeleid van SGML – om infor-matiepagina’s op internet (meer bepaald het www) aan te maken (‘to mark up’). HTML bestaat uit een aantal codes (de zogenaamde ‘tags’) waarmee zowel de structuur als de lay-out van een www-pagina kan worden gedefinieerd, zoals het in vet weergeven van een woord, het maken van een paginabrede titel enz. Bovendien kun-nen woorden, regels tekst of beelden worden gemarkeerd als hyperlinks die verwijzen naar een ander www (HTML)-document, zodat de gebruiker vanuit elke www-pagina kan ‘springen’ naar andere www-pagina’s (eventueel opgesla-gen in andere servers) of naar grafische beelden, videobestanden of audiofiles.
Javascript:
Om meer functionaliteit en interactiviteit in web-pagina’s te krijgen heeft de Netscape Javascript ontwikkeld. Hierdoor kunnen er bijvoorbeeld acties worden gehangen aan gebeurtenissen (events). Bijvoorbeeld het laten verschijnen van een nieuw venster als de bezoeker met de muis over een link rolt (in plaatst van er op klikken). Bijna alle moderne browsers kunnen met Javas-cript overweg. Websitemaken.be heeft ook een eigen Javascript-afdeling
Vertical:
Een gespecialiseerde website die dient als een portaal naar een specifieke markt of niche.
Wireframes:
Wireframes zijn een visueel hulpmiddel bij het ontwikkelen van een website of -applicatie. Ze kunnen gezien worden als de bouwtekening van een website, waarin een overzicht wordt gegeven van de verschillende onderdelen die op een website aanwezig zullen zijn.
Verklarende woordenlijst
Inleiding
Bedrijfsbeschrijving
Project definitie
Technische ontwikkelingen User interface
Doelgroep gedrag
concurrentie analyse Conclusies & aanbevelingen
Prototype
Reflectie
Bronnenlijst
Bijlagen
Terug
Kan een mobiele applicatie iets toevoegen aan een hedendaagse kinderfashion vertical? En op welke manier kan een applicatie ingezet worden als dit zo is?
Op deze vragen wordt in deze scriptie antwoord gegeven.
Mobiele telefoons hebben de laatste jaren grote technologische sprongen voorwaarts gemaakt. Dit zal de komende jaren doorzetten. Het aantal smartphone gebruikers stijgt snel en er wordt veel gebruik gemaakt van applicaties. Dit Kinderfashion applicatie project is gestart omdat Fresh Fruit Digital zich samen met andere bedrijven binnen de Greenhouse Group wil pro-fileren in de online kinderfashion branche. Dit project geeft weer wat de huidige situatie van smartphone gebruik en kinderkleding vergelijken is. Daarnaast wordt er gekeken naar de tech-nisch mogelijkheden en grafische richtlijnen die belangrijk zijn voor mobiele applicaties.
Deze scriptie is opgebouwd uit 12 hoofdstukken maar deze vallen grofweg uiteen in 5 hoofdon-derdelen.
Het eerste deel bevat een introductie. Hierin wordt het stage bedrijf beschreven en de op-dracht uitgelegd. Dit vindt u terug in hoofdstuk 1-3.
Het tweede deel omvat hoofdstuk 4-7. Dit is het grootste deel van het rapport en omvat een uitgebreide omschrijving van het verrichtte onderzoek.
Hoofdstuk 8 en 9 gaan over de getrokken con-clusies, aanbevelingen en het daaruit volgende prototype.
Het laatste deel bevat de reflectie op het project, de bronnenlijst en een verwijzing naar de n. Dit betreft hoofdstuk 10-13.
1 Inleiding
Terug
2.1 Missie & visie
Missie: Samen met onze klanten het hoogste rendement uit hun online marketingactiviteiten halen door innovatief te zijn en te blijven. Visie: De wereld van online marketing verand-ert continu. Aan ons de taak om te zorgen dat klanten met onze hulp in staat blijven om hun online doelstellingen te realiseren.
2.2 Beschrijving opdrachtgever
Fresh Fruit Digital (FFD) houdt zich bezig met online marketing. Het biedt zijn klanten een complete marketing mix. Naast zoekmachine optimalisatie en display advertising biedt het ook Europese campagnes en affiliate programma’s. Als onderdeel van de Greenhouse Group werkt FFD veel samen met bedrijven als Blue Mango Interactive, Source Republic, We Are Blossom en Affilidirect.
Binnen deze Group wordt alles aan online mar-keting gedaan. Van zoekmachine optimalisatie tot display adds en landing pages, ieder bedrijf heeft zijn eigen specialisatie. In totaal werken er meer dan 75 man bij de Greenhouse Group. Deze zijn verdeeld over 5 bedrijven.
2 Bedrijfs Beschrijving
Terug
3.1 Project doelstellingen
Binnen de Greenhouse Group lopen er pro-jecten waaraan meerdere bedrijven deelnemen. Zo wordt er nu gewerkt aan een kinderfashion vergelijkingswebsite en alles er omheen. Omdat dit een nieuwe sector is die de Green-house Group wil betreden wordt er onderzoek gedaan naar verschillende facetten binnen dit gebied. De bedoeling is dat er een Vergelijking-swebsite komt waarop kinderkleding vergeleken kan worden en dat hierbij een mobiele applicatie/ website gemaakt wordt.
Deze mobiele applicatie moet passen binnen den wensen en eisen van de doelgroep en een toevoeging bieden aan de vergelijkingswebsite. Aangezien de smartphone markt als een razende blijft groeien en mensen steeds vaker mobieltjes of tablets gebruiken om te surfen en applicaties te gebruiken, wil Fresh Fruit kijken hoe deze kun-nen worden ingezet om een Fashion vergelijking-swebsite te ondersteunen of uit te breiden. Dit onderzoek is bedoeld om een goed inzicht te krijgen in de mogelijkheden van user interface design binnen mobiele applicaties en hoe deze in te zetten in de kinderfashion sector.
Ook kan het onderzoek naar de mogelijkheden van mobiele apparaten en de verschillende vor-men van applicaties in de toekomst handig zijn voor het bedrijf. Om te gebruiken binnen andere sectoren dan de kinderfashion.
3.2 Gekozen oplossing of aanpak
Om de doelstelling te bereiken Is er gekeken naar het huidige vergelijkingsgedrag van de doelgroep, de meerwaarde die applicaties kun-nen bieden ten opzichte van websites en huidige
concurrentie klimaat. Op basis van deze punten is de volgende onderzoeksvraag geformuleerd: “Hoe kan een mobiel platform zo veel mogelijk bijdragen aan de interactie tussen een kinder-fashion vergelijkingswebsite en diens doel-groep?”
3.2.1 Fases
Het onderzoek is verdeeld in 5 duidelijke hoofd-delen. Deze 5 onderzoeken samen hebben geleid tot het beantwoorden van de hoofdvraag, het trekken van een conclusie en de realisatie van het eindproduct.
Fase 1: Onderzoek
Wensen en verwachtingen van de doelgroep -Type telefoon of tablet. (welk besturingssys-teem)
-Huidige vergelijkingsgedrag doelgroep. -Verwachtingen van de doelgroep van mobiele applicaties en websites binnen de kinderfashion sector.
-Welke functionaliteiten vind de doelgroep wenselijk?
-Welke informatie verwacht de doelgroep van een vergelijkingsapplicatie?
Ontwikkelingen binnen mobiele applicaties -De technische mogelijkheden en beperkingen van mobiele apparaten (Android en IOS). -Verschillen tussen de mogelijke alternatieven op een mobiel apparaat (native app, web app en mobiele website.)
-Algemene richtlijnen voor user interface design op mobiele apparaten.
-Trends op gebied van mobile user interface design.
3 Project definitie
Terug
Concurrenten
-Wie zijn de voornaamste concurrenten? -Hoe maakt de concurrentie gebruik van user interface design om de doelgroep aan te sporen tot een handeling?
- Zijn er gemeenschappelijke elementen binnen deze apps?
Fase 2: Vergelijken en analyseren resultaten De resultaten die in fase 1 uit het onderzoek naar voren zijn gekomen evalueren. Uitzoeken hoe binnen de technische mogelijkheden van smart-phones aan de eisen van de doelgroep voldaan kan worden. Op basis van de wensen en het mo-biele gebruik van de doelgroep kan er bepaald worden welk type applicatie het best aansluit en welke de meeste impact op de doelgroep heeft. Hierbij wordt er gekeken welke nieuwe ontwik-kelingen interessant zijn om te gebruiken en hoe een stap voor te blijven op de concurrenten. Fase 3: Conclusies trekken en uitgangspunten bepalen, concept verzinnen.
Vervolgens worden er uit de analyse conclusies getrokken en wordt alles vastgelegd. Op basis van dit afgebakende gebied wordt er een con-cept opgesteld.
Fase 4: Draadmodellen en prototypes ontwik-kelen en testen
Het concept wordt gebruikt om een aantal draadmodellen (globale lay-out van de website/ applicatie) te maken en deze al aan de doelgroep voor te leggen. Dit om te kijken of ze de positio-nering logisch vinden en hoe ze op de lay-out reageren.
De meest wenselijke draadmodellen zullen leiden tot 1 of meerdere prototypes van de mobiele ap-plicatie of website. Deze zal ook weer uitvoerig
getest moeten worden en alle feedback zal verwerkt worden zodat er uiteindelijk 1 duidelijk eindproduct kan komen.
Fase 5: Eindproduct vaststellen en ontwikke-len (proof of concept)
Nu duidelijk is hoe de gebruikers op de proto-types reageren en wat wel en niet werkt voor de doelgroep kan er een eindproduct gemaakt gaan worden. Dit is hoogstwaarschijnlijk een prototype van de uiteindelijke app. Het zou een uitbreiding van de vergelijkingswebsite kunnen zijn, maar ook een mobiele versie er van of een onderste-uning. Uit het onderzoek zal blijken welke richt-ing er richt-ingeslagen wordt.
3.3 Scope
Dit project richt zich uitsluitend op de mobiele app. De kern van dit project is verkennen hoe mobile user interface design ingezet kan worden om een optimale app te maken voor een kinder-fashion vergelijkingswebsite. Belangrijk hierbij is dat hij aansluit bij de wensen en het gebruik van de doelgroep. Er wordt verder gekeken naar de technische mogelijkheden van mobiele applicat-ies. Het eindproduct zal geen volledig werkende applicatie zijn maar een prototype hiervan. Het maken van een vergelijkingswebsite, ver-garen van database gegevens (al dan niet door middel van een crawler) en distributie van de eventuele app vallen niet binnen het project.
Terug
3.4 Producten c.q. eindresultaat
Er worden verschillende producten opgeleverd, welke hier uiteengezet worden.
- Onderzoeksrapport
Een rapport waarin alle deelvragen en de hoofd-vraag worden behandeld en beantwoord. Dit rapport zal de basis vormen voor de rest van de eindproducten.
- Conclusies en concept
Op basis van het onderzoeksrapport kunnen er conclusies getrokken worden en wordt een con-cept voor een mobiele app/website verzonnen. - Draadmodellen en prototypes
Op basis van het concept worden er draad-modellen en prototypes ontworpen die aan de grondslag van het proof of concept liggen. - Proof of concept
De laatste op te leveren versie van de app/ mobiele website. Het zou een uitbreiding van de vergelijkingswebsite kunnen zijn, maar ook een mobiele versie ervan of een ondersteuning. Uit het onderzoeksrapport, draadmodellen en prototype zal blijken welke richting er ingeslagen wordt.
Terug
Hierin wordt behandeld voor welke platformen er ontwikkeld dient te worden en wat de doelgroep verwacht van een dergelijk eindproduct. Dit onderdeel bevat informatie over smartphone gebruik, app gebruik, het huidige online kinder-kleding vergelijkingsgedrag en de verwachtingen van een kinderkleding app.
Onderzocht op basis van cijfers (deskresearch ourmobileplanet.com) en op basis van een en-quête (zie bijlage)
Omschrijving doelgroep
De doelgroep voor een kinderfashion applicatie bestaat uit ouders met jonge kinderen (0-12 jaar) die zowel mode als prijsbewust zijn en in het bezit zijn van een smartphone of tablet.Verder zijn de volgende kenmerken van toepassing op de doelgroep:
Leeftijd: 20-40 jaar Geslacht: Man en vrouw
Kenmerken: Modern, Prijsbewust, modebewust, Interesses: Kinderen, mode, mobiele apps, winkelen
Productbezit: laptop of desktop, smartphone en/ of tablet, mp3 speler.
Vrije tijd: winkelen, op de bank surfen op het web via smartphone of tablet, sporten.
4.1 Mobiel gebruik
Uit recente cijfers(2012) van de website http:// www.ourmobileplanet.com/nl op gebied van smartphone penetratie blijkt dat 72% van de Nederlandse bevolking tussen de 18-29 in het bezit is van een smartphone. Voor het segment Nederlandse bevolking tussen de 30-49 ligt dit iets lager, 57% van deze mensen is in het bezit van een smartphone.
Uit ditzelfde onderzoek blijkt dat 36% van de 18-29 jarigen meer apps denkt te gaan gebruiken
in de toekomst. Voor de 30-49 jarigen geldt hetzelfde voor 31%. Slechts een klein deel (2% en 3%) denkt minder apps te gaan gebruiken. Hieruit blijkt dat de doelgroep vertrouwd raakt met mobiele applicaties en ze ook steeds meer gebruikt.
Meer dan de helft van al deze mensen geeft aan naar producten te zoeken via hun smartphone maar minder dan een kwart koopt ook daadwer-kelijk iets via de smartphone. Als hoofdreden wordt hiervoor gegeven dat men liever betaalt via laptop of desktop.
Op basis van dit onderzoek is ook vastgesteld dat de twee meest gebruikte besturingssyste-men Android(33%) en IOS(30%) zijn. Vandaar dat in dit onderzoek deze twee besturingssystemen verder behandeld zullen worden.
4.2 Huidig kinderkleding
vergelijkingsge-drag
Uit een zelf opgestelde enquête (Bijlage) blijkt dat er nog niet veel vergeleken wordt op kinder-kleding(16%). Mensen die aangeven dit wel te doen noemen losse sites en vergelijken dan zelf. Er wordt door niemand een vertical of vergelijk-ingssite genoemd. Het bezoeken van kinderkl-eding gerelateerde websites op de smartphone ligt nog lager 8% en 0% van de ondervraagde gebruikt hier een app voor.
Het grootste deel van de ondervraagden gaat de sites af van winkels zoals de H&M, Zara en Wehkamp. Ook marktplaats en Ebay worden genoemd.
De doelgroep geeft wel in groten getale (62%) aan andere producten/diensten te vergelijken op hun smartphone. Producten/diensten vergelijken
4 Doelgroep gedrag
Terug
Terug
op een smartphone wordt dus veel gedaan. Door een gebrek aan applicaties en/of websites waar een duidelijk overzicht met kinderkleding van meerdere aanbieders wordt vertoond blijft de kinderkleding hierin achter.
4.3 Verwachtingen en wensen
Er kwamen 6 duidelijke functies naar voren die de doelgroep handig tot zeer handig zou vinden in een kinderkleding applicatie. Dit zijn de vol-gende:
-Uitgebreid assortiment van kleding en duidelijke zoekfunctie.
-Prijzen vergelijken.
-Kleding toevoegen aan een winkelmandje dat ook via de desktop beschikbaar is.
-Mogelijkheid tot doorverkopen van kleding d.m.v. van foto’s.
-Kortingsacties op gebied van kinderkleding. -Op de hoogte gehouden worden wanneer bepaalde (door de gebruiker gespecificeerde) kledingstukken in de aanbieding komen. Hieruit blijkt dat de doelgroep weldegelijk kinder-kleding zou vergelijken, en prijsbewust zou willen winkelen.
Al deze functies spreken voor zich, de enige die wat toelichting vereist is: de mogelijkheid tot doorverkopen van kleding d.m.v. van foto’s. Met behulp van de camera in de smartphone kan er een foto gemaakt worden van een kledingstuk en deze valt vervolgen te uploaden naar de app. Er dienen een aantal velden ingevuld te worden zoals : prijs, merk, maat, geslacht van drager, materiaal en kleur. Vervolgens kunnen andere gebruikers al deze kledingstukken zien in de app en kunnen deze kledingstukken doorverkocht worden als het kind eruit gegroeid is.
Omdat dit een secundaire functie is zal hier niet
de nadruk op komen te liggen.
Het eerder genoemde feit dat de doelgroep liever aankopen doet via laptop of desktop dan via een smartphone, blijkt ook uit de gewenste func-ties. De doelgroep zou wel kleding uitzoeken en toevoegen aan een winkelwagentje, maar ook daadwerkelijk een aankoop doen blijft toch vaak achterwege.
Verder is er onderzocht wat de doelgroep de belangrijkste criteria vindt op gebied van kinder-kleding. Hieruit kan worden opgemaakt welke informatie er prioriteit krijgt op het (relatief kleine) smartphone scherm. -Maat -Foto -Prijs -Levertijd -Voorraad -Geslacht
Zijn de 6 belangrijkste volgens de respondenten. Belangrijk is dus dat deze voor ieder product in 1 oogopslag duidelijk moeten zijn.
De volgende criteria zijn, in de genoemde volgor-de, minder belangrijk volgens de ondervraagden: -Materiaal
-Kleur -Leeftijd -Merk -Populariteit
Deze zouden eventueel in een later scherm getoond kunnen worden.
Terug
4.4 Beslissingen op basis van dit
onder-zoek
Uit het onderzoek blijkt dat de doelgroep bereid is om kinderkleding te vergelijken via een mobiel apparaat. De reden dat het nog niet veel gedaan wordt is het gebrek aan een duidelijke autoriteit die verschillende aanbieders combineert. naast functionaliteiten zoals prijzen vergelijken, zoeken naar bepaalde kledingstukken en kled-ing toevoegen aan een winkelmandje, is er ook vraag naar functionaliteiten zoals kortingen, een “sale alert” en kleding doorverkopen d.m.v. zelf toegevoegde foto’s.
Doordat de doelgroep nog beperkt bereid is betalingen via mobiel te verrichten zal een kop-peling met het winkelmandje van de website een niet te missen toevoeging zijn.
Dit heeft als gevolg dat er een account aange-maakt dient te worden voor iedereen die iets toevoegt aan het winkelmandje.
De volgende functionaliteiten zijn onmisbaar voor de doelgroep en zullen zeker in de applicatie terug moeten komen:
Uitgebreid assortiment van kleding en duidelijke zoekfunctie.
Prijzen vergelijken.
Kleding toevoegen aan een winkelmandje dat ook via uw desktop beschikbaar is.
Verder zijn deze functionaliteiten erg gewenst (maar niet noodzakelijk):
Mogelijkheid tot doorverkopen van kleding d.m.v. van foto’s.
Kortingsacties op gebied van kinderkleding. Op de hoogte gehouden worden wanneer be-paalde kledingstukken in de aanbieding komen.
Doordat bepaalde mogelijkheden van een smart-phone zich ideaal lenen voor dergelijke func-tionaliteiten (beter dan bijvoorbeeld een desktop of laptop.) Voegt een app ook daadwerkelijk iets toe aan een vergelijkingswebsite. Bijvoorbeeld het fotograferen van kleding voor herverkoop. En pushberichten ontvangen van aanbiedingen. De criteria met de hoogste prioriteit dienen zo snel mogelijk zichtbaar te zijn (liefst in 1 oo-gopslag.) omdat deze bepalen of het product wel of niet interessant is voor de gebruiker.
Al deze punten kunnen zogenaamde “Dealbreak-ers” zijn. Vallen alle criteria in de smaak maar is het product niet meer op voorraad of wordt het niet in een bepaalde maat aangeboden, dan is het voor de gebruiker waarschijnlijk niet meer interessant. -Maat -Foto -Prijs -Levertijd -Voorraad -Geslacht
Belangrijk hierbij is ook een goed werkende zoek- en filterfunctie.
Op basis van filters (welke maat, geslacht van het kind, maximale prijs) kunnen al veel van deze criteria afgevangen worden.
Terug
Terug
Dit hoofdstuk richt zich op technische ontwikke-lingen en op de trends die spelen op gebied van mobiele applicaties.
Er wordt allereerst behandeld welke technieken benodigd zijn om de gewenste functionalitei-ten te realiseren. Deze vergelijking is tot stand gekomen door uitvoerig onderzoek te doen naar alle technische mogelijkheden op gebied van mobiele applicaties.
Hiernaast is er op basis van rapporten door vooraanstaande onderzoeksbureaus en pre-sentaties/samenvattingen van het SXSW event (Het grootste interactive event waar ieder jaar de laatste mobile trends gepresenteerd worden.) Is er een lijst samengesteld met relevante mogeli-jkheden voor een kinderfashion applicatie. 5.1 Wat voor een app?
Er zijn verschillende soorten apps. Alle drie de vormen van apps hebben hun voor en nadelen, en per project dient er ook goed nagedacht te worden welke van de drie het meest geschikt is voor de te ontwikkelen app. We maken onder-scheid tussen Native, web en hybride. Alle drie worden besproken om een beeld te vormen over de verschillen en de keuze die gemaakt is te ondersteunen.
5.1.1 Native app
Met een Native app wordt een applicatie bedoeld die is toegespitst het besturingssysteem waar deze op wordt gedraaid. Dit houdt in dat een native app die ontwikkeld wordt voor Google’s Android niet op Apple’s IOS kan draaien en visa versa. Hij kan alle sensoren van het desbetref-fende apparaat aanspreken en er hoeft geen verbinding met het internet plaats te vinden om hem te starten. Verder zijn deze apps verkrijg-baar in de appstores van beiden besturingssys-temen. Native apps dienen handmatig geüpdate
te worden. (Dit kost een extra handeling voor de gebruiker.) De ontwikkeling voor meerdere platforms neemt veel tijd in beslag en het is een duur proces.
Voordelen
-Kan het maximale uit het desbetreffende bes-turingssysteem en mobiele apparaat halen. (alle functies aanspreken)
-Zeer hoge snelheid.
-kan in appstores verkocht worden. Nadelen
-Hoge ontwikkelingskosten.
-Werkt maar op 1 besturingssysteem. -Strenge regels ter goedkeuring van de app. -Handmatige updates.
5.1.2 Web app
Een mobiele versie van een website. Geheel in webtalen zoals HTML, CSS en Javascript ge-codeerd. Deze wordt zo gemaakt, dat hij op alle resoluties goed uitziet en werkt op alle smart-phones die toegang tot het Internet hebben. Het is niet mogelijk om alle sensoren aan te spreken, er zijn slechts een beperkt aantal per bestur-ingssysteem aanspreekbaar. Voor deze vorm van applicaties dient er een internet verbinding actief te zijn en ze kunnen niet in de appstore verkocht worden. Webapps worden automatisch geüp-date als ze worden aangepast door de program-meur (het zijn immers websites) daar deze vorm van mobiele applicaties op iedere smartphone met internettoegang werkt zijn de kosten relatief laag en de productietijd kort.
Voordelen
-Lage ontwikkelingskosten. -Werkt op alle besturingssystemen. -Geen keuring of handmatige updates.
5 Technische ontwikkelingen
Terug
Nadelen
-Niet alle sensoren zijn aanspreekbaar. -Er is een actieve internetverbinding nodig. -Kan niet in de appstore worden verkocht. -Kan geen gebruik maken van lokale opslag op de telefoon zelf.
5.1.3 Hybride app
Dit is een soort schil die je instaat stelt native ap-plicaties te schrijven op basis van web technolo-gieën. Een hybride app combineert de voordelen van een native app en een web app. Ze kunnen veel sensoren aanspreken die en native app ook aanspreekt, kunnen worden aangeboden in de appstores, kunnen werkend gemaakt worden op meerdere besturingssystemen.
Voordelen
- Lage ontwikkelingskosten. - Werkt op alle besturingssystemen. - Kan veel sensoren en “native” functies aanspreken.
- Kan in de appstore aangeboden worden. Nadelen
- Er is een internet verbinding nodig. (content kan wel gechached worden zodat deze offline beschikbaar is.)
- Je kan veel toestel specifieke functies aanspreken maar niet allemaal.
- Worden nog wel eens afgekeurd door Apple als je ze in de appstore wilt zetten.
5.1.4 Keuze en verdediging
Voor dit project wordt er gekozen voor een hybride app. Zo kan alle informatie uitgelezen worden van de vergelijkingswebsite (producten en hun specificaties) en deze in een eigen schil geplaatst worden. Tevens kan er op deze manier gebruik gemaakt worden van bijvoorbeeld de camera en de notificaties. Deze beide functies
zijn nodig om alle functionaliteiten die in het vo-rige hoofdstuk bepaald zijn te kunnen gebruiken. Daarnaast zijn de voordelen talrijk bij deze vorm van een applicatie. De mogelijkheid om hem op verschillende besturingssystemen te draaien en de relatief lage productiekosten zorgen ervoor dat dit een aantrekkelijke vorm is voor een bedrijf om een applicatie in te schrijven. Door de app aan te bieden in de appstores is hij makkelijk te vinden door de mobiele gebruikers.
De nadelen zijn overbrugbaar. De functionalitei-ten die benodigd zijn voor de te ontwikkelen applicaties zijn beschikbaar op basis van ver-schillende web application frameworks. (hiero-ver meer in het volgende hoofdstuk) Doordat content gecached kan worden kunnen toch alle functionaliteiten gebruikt worden ondanks dat de gebruiker niet met het internet verbonden is.
5.2 Technische ontwikkelingen
Niet alleen de mogelijkheden van de smart-phones worden talrijker, ook softwarematig is er steeds meer mogelijk op het gebied van applicaties. In dit hoofdstuk wordt er gekeken naar de verschillende mogelijkheden voor het maken van een hybride app, de mogelijkheden per besturingssysteem (Android en IOS) en naar opkomende trends binnen applicaties.
5.2.1 Frameworks voor hybride apps
Er is een groot aantal frameworks waarmee hy-bride applicaties gemaakt kunnen worden. Ieder framework heeft zijn eigen voor- en nadelen. Om te bepalen welk framework het meest geschikt is voor dit project zijn alle grote frameworks vergeleken op basis van de volgende vergeli-jkingen:
Terug
Terug
Bron:
http://www.markus-falk.com/mobile-frame-works-comparison-chart/
Op basis van deze informatie zijn de twee meest gebruikte frameworks voor hybride nog eens naast elkaar gelegd om de verschillen duidelijk te maken.
Daarnaast wordt er ook meteen gekeken naar extra plug-ins die nodig zijn om tot het gewenste eindproduct te komen.
Web application frameworks
De twee meest gebruikte web application frameworks zijn vergeleken om zo tot de meest optimale oplossing te komen voor de te realis-eren kinderfashion app.
Phone Gap
Phone Gap is een op HTML 5 gebaseerd framework. Door gebruik te maken van HTML en javascript kunnen applicaties ontwikkeld worden die Native functies aanspreken. Daarnaast is het met Phone Gap mogelijk om meteen te expor-teren voor meerdere platforms. Op deze manier hoeft er niet voor ieder besturingssysteem een andere app geschreven te worden.
Voordelen
- Lage instapdrempel
- Snel en relatief simpel, zeker voor mensen die bekend zijn met webtalen.
- Makkelijk om te zetten naar verschillende besturingssystemen.
Nadelen
- Omdat het web-based is heb je dezelfde cross-browser problemen als bij een gewone
website. (verschillende browsers interpreteren code op een andere manier)
- De “webview” van sommige platforms (bijvoor-beeld Android) heeft wat beperkingen.
Sommige code werkt niet naar behoren en er zijn nog een aantal bugs.
- De native interface kan niet aangeroepen worden. Visuele effecten dienen zelf nagemaakt te worden als deze gebruikt willen worden. Dit voelt noot zo soepel aan als echt native interface elementen en transities.
appcelerator
Appcelerator heeft een andere aanpak dan Phone Gap. Dit framework zet de code ook daadwerkelijk om naar native code. Hierdoor kunnen er ook meerdere functies aangespro-ken worden dan met bijvoorbeeld Phone Gap en is het ook niet mogelijk om 1 applicatie te schrijven en deze in een keer te exporteren naar alle gewenste platforms. Deze hebben immers andere functies en UI-elementen.
Voordelen
- Kan meer native functies aanspreken dan an-dere frameworks zoals platform specifieke elementen.
- Geen gebruik van de webview component. - Makkelijker om te coderen dan de native talen. Nadelen
- Lastiger coderen.
- Lastig uit te breiden met API’s omdat het erg complex in elkaar zit.
- Kan maar naar 3 besturingssystemen geëxpor-teerd worden.
Er is gekozen om de app op basis van Phone Gap te maken. De meeste informatie dient van het web gehaald te worden (producten en andere database gegevens.) En er is binnen het bedrijf al veel HTML en CSS kennis. Daarnaast vallen alle benodigde functies te realiseren met behulp van
Terug
Phone Gap en kan een Applicatie op basis van dit framework makkelijk geëxporteerd worden voor meerdere besturingssystemen.
Om het beste uit de touch functies en de interface te halen, wordt de plug in JQ Touch gebruikt. Door gebruik te maken van deze plug-in kunnen toch functies aangesproken worden en kunnen er design elementen vanuit Android en IOS gebruikt worden.
5.2.2 Mogelijkheden van smartphones
Android en IOS toestellen zijn beiden high-end smartphones. Allebei deze besturingssystemen zitten bovenop de laatste vernieuwingen en ook de hardware van de toestellen waar deze op draaien wordt regelmatig verbeterd om met de laatste technieken mee te gaan.
Alle smartphones hebben toegang tot het inter-net. Daarnaast hebben ze ook allemaal een vorm van notificaties en één of meerdere camera’s. Er zijn smartphones die nog geen touchscreen hebben. Hier wordt de applicatie echter niet voor ontworpen. Android en IOS toestellen kunnen alle benodigde functies vervullen in samenwerk-ing met de gekozen techniek.
5.3 Opkomende trends
De trends die dit moment spelen binnen mobile apps zijn bepaald op basis van 2 bronnen. De eerste is een onderzoek van het vooraanstaande bureau Gartner. In dit hoofdstuk worden alleen de trends genoemd die relevant zijn voor ene kinderfashion app. (Voor een volledige lijst van mobiele trends zie de bijlage)
Daarnaast heeft het SXSW event, het grootste interactieve evenement in de wereld, als uitgang-spunt gediend. Hier worden ieder jaar de nieuwe trends en meest kansrijke applicaties
aangekon-digd (Twitter en Foursquare zijn hier bijvoorbeeld groot geworden.)
Ook hier worden alleen relevante trends bespro-ken.
Op basis van deze trends is er een beeld gevormd van de richting die vel applicaties op zullen gaan en nieuwe technieken die groot gaan worden het komende jaar. Deze informatie is van belang om de app interessant te houden voor de gebruikers.
5.3.1 Gartner trends
Gartner is het leidende bedrijf in de wereld in onderzoek en advies op gebied van informatie techniek.
Er zijn 4 trends aangekondigd die goed aanslu-iten bij een kinderfashion app. Voor iedere trend wordt er beschreven hoe hij van toepassing kan zijn op het eindproduct. Hierdoor worden alle functionaliteiten nogmaals verantwoord. -Social-networking
Sociale elementen in applicaties zijn niet nieuw. Maar het sociale aspect zal de komende tijd alleen nog maar toenemen. Apps zullen steeds vaker koppelingen met sociale netwerken krijgen. Een handige manier om een kinderfashion app aan een social network te koppelen is door een Facebook log-in te maken. Hierdoor wordt niet alleen het registratie proces zo makkelijk mo-gelijk gemaakt, ook is het momo-gelijk om berichten op iemand zijn Facebook profiel te plaatsen en extra informatie te vergaren.
Terug
Terug
-Mobile search
Vergelijken werd al lange tijd op de computer gedaan. Steeds meer mensen gebruiken hun smartphone om producten te zoeken en te vergelijken. Gezien de kortere tijdsduur van smartphone sessies ten opzichte van desktop sessies zal een vergelijkingsapp alle relevante data in één opslag moeten laten zien. Zodat de gebruiker zo min mogelijk tijd kwijt is met vergelijken.
Het vergelijken van producten wordt de spil van de mobiele applicatie.
-Mobile commerce
Nu is mobile commerce een verlengde van e-commerce vaak is het alleen een gestroomlijnder proces. Er zijn echter tal van mogelijkheden met de sensoren op de huidige smartphones. Sale alerts, of kleding die aansluit bij eerdere aankopen kunnen worden weergegeven als een gebruiker incheckt in een fysieke winkel. (op basis van geolocatie.)
Ook notificaties op het moment dat bepaalde door de gebruiker gespecificeerde producten in de uitverkoop komen zijn een voorbeeld van op het mobiele apparaat toegespitste commercie. -Mobile payment
Er wordt al veel vergeleken maar daadwerkeli-jke mobiele aankopen blijven toch nog achter. Veel gebruikers hebben het gevoel dat mobile afrekenen minder veilig is en vinden het handiger om dit op een laptop of desktop uit te voeren. Desondanks voorspelt Gartner dat mobile pay-ment het komende jaar sterk zal groeien. Om deze groei te faciliteren zullen ontwikkelaars een veilig gevoel moeten geven en het zo makkelijk
mogelijk make nom af te rekenen via een smart-phone.
BRON:
http://www.gartner.com/it/page.jsp?id=1544815
5.3.2 SXSW trends
Het South by Soutwest festival in Austin is het meest vooraanstaande interactive event in de wereld. 3sixtyfive bood een update van dit event aan waarin de belangrijkste trends besproken werden.
Het onderwerp van het SXSW was dit jaar social serendipity. Dit wil zoveel zeggen als het toevallig ontdekken van nieuwe locaties, producten of mensen via een social medium. Hieronder valt ook het aanraden van producten op basis van je eerdere aankopen of op basis van aankopen van je vrienden. Als een applicatie zijn gebruiker onverwachts kan helpen aan relevante informatie of producten geeft dit de gebruiker een goed gevoel. Het voelt als een extra service en kan de gebruiker een positiever gevoel over de applica-tie geven, en hem doelgerichter helpen bij zijn zoektocht.
5.4 Beslissingen op basis van dit
onder-zoek
Door de verschillende vormen van mobiele ap-plicaties te vergelijken en deze naast de wensen en eisen van de doelgroep te leggen is besloten om een Hybride app te bouwen. Dit soort app kan gebruik kunnen maken van de native func-ties van Android en IOS apparaten. Ook kan er makkelijk een link gelegd worden met de verti-cal website en kunnen gegevens uitgewisseld worden.
Terug
De frameworks waarmee deze applicatie wordt gebouwd, Phone Gap en jQmobile, zijn op hun beurt gekozen vanwege hun mogelijkheden die perfect aansluiten bij de vereisten van de eerder vastgestelde functionaliteiten die de app moet bevatten. Daarnaast zijn de functionaliteiten getoetst aan de trends die de komende tijd spelen om te kijken of de app levensvatbaar en aantrekkelijk blijft.
Op basis van de trends uit hoofdstuk 5.3 is bepaald of de functies van de applicatie ook bij deze tijd horen. Er zijn 4 Gartner trends gevonden waarde app een raakvlak mee heeft. Daarnaast hebben de trends ervoor gezorgd dat er gekozen is voor een Facebook log-in om het mobiele registratie proces zo makkelijk mogelijk te houden.
Sociale media gaan steeds meer geïntegreerd worden in het hedendaagse leven, mensen verwachten steeds relevantere informatie. Ge-bruikers willen zelfs “toevallig” juist die dingen tegenkomen die ze kunnen gebruiken (social ser-endipity) Mensen kleding laten zien op basis van hun eerdere aankopen is een kleine toevoeging waar ze op het eerste gezicht niks van merken maar wat de ervaring met de app weldegelijk positiever maakt.
6.1Richtlijnen
Om een app zo gebruiksvriendelijk te maken zijn er een aantal factoren waar rekening mee gehouden dient te worden. Het verlangen, en het gedrag van de gebruiker, de beschikbare ruimte voor de interface en de interactie mogelijkheden die deze heeft, de verschillende apparaten en besturingssystemen. Al deze factoren spelen mee in het ontwerp van een interface voor een mobiele applicatie. Er zijn bepaalde richtlijnen voor mobiele apparaten waarbij rekening is gehouden met de apparaten, de gebruikers en de besturingssystemen. Deze worden in dit hoofdstuk genoemd.
6.1.1 Algemeen
Het ontwikkelen van een interface voor smart-phone is anders dan bijvoorbeeld een Desktop applicatie. Door bijvoorbeeld de beperkte scher-mruimte, de gebruiksduur(veel korter dan op een desktop/laptop) en de grootte van de menselijke vinger. (ten opzichte van bijvoorbeeld een muis cursor.)
Toch zijn er een aantal principes die voor iedere interface gelden.
Bron: Designing Mobile Interfaces - Hoober, Berkman - O’Reilly (2012)
Leerbaarheid
Het moet meteen duidelijk zijn waar een app voor is en hoe je er mee interacteert.
Laat alleen de functionaliteiten zien die de ge-bruiker helpen om hun doel te bereiken. Interfaces moeten makkelijker te bedienen zijn voor iedere keer dat de gebruiker er mee inter-acteert.
6 User interface
Terug
Terug
Efficiëntie
Het aantal interacties die een gebruiker moet maken met de interface dient zo laag mogelijk gehouden te worden voor iedere taak. De belangrijkste taken moeten zo efficiënt mo-gelijk gemaakt zijn (minste handelingen, duidelijk in beeld)
Fouten afvangen
Geef de gebruiker zo min mogelijk de kans om fouten te maken .(idealiter is fouten maken on-mogelijk in een applicatie.) Zorg dat alle knoppen op elk moment werken en geef de gebruiker een duidelijke route waardoor hij vanzelf de juiste dingen doet.
Houd het simpel
Taken die het vaakst gebruikt worden moeten makkelijk uit te voeren zijn.
Minder gebruikelijke taken moeten mogelijk uit te voeren zijn.
Houd de interface duidelijk en schoon, vermijd nutteloze functies en maak geen rommel van de lay-out.
Navigatie moet nooit teveel lagen bevatten en onoverzichtelijk worden.
Verwachtingen
Gebruikers hebben voor veel functies een verwachtingspatroon van wat er gaat gebeuren. Zorg ervoor dat precies dat gebeurt wat de gebruiker verwacht.
Zichtbaarheid
Hoe belangrijker de functie, hoe zichtbaarder hij moet zijn. Minder belangrijke functies/informatie moet minder zichtbaar zijn. Maar wel leesbaar.
Feedback
Zorg ervoor dat de gebruiker altijd Feedback krijgt van de gebeurtenissen (ook als er functies of elementen ingeladen worden moet er duidelijk zijn wat er gebeurt.)
De gebruiker moet de controle over de app heb-ben. Niet andersom!
Consistentie
Wees consistent in de vormgeving van items met dezelfde functies. Dit geldt zowel in de applicatie zelf als voor design dat gebruikers verwachten van iedere applicatie op hun platform. Dit ver-schilt per apparaat, houd je dus aan de design standaard.
Maak ook gebruik van pictogrammen of meta-foren die de gebruikers kennen vanuit de echte wereld.
Informatie design
In mobiele interfaces zijn de volgende variabelen belangrijk voor ieder element. Ze staan op vol-gorde van meest naar minst belangrijk. (positie van een element is belangrijker dan grootte, grootte is belangrijker dan vorm enz.) - positie - grootte - vorm - contrast - kleur - gedaante
Door rekening te houden met dit 6-tal variabelen kan het belang maar ook de functie van een ele-ment aangegeven worden
Terug
Daarnaast is er nog een aantal richtlijnen die voor een smartphone app extra belangrijk zijn. Vermijd Horizontaal scrollen en beperk verticaal scrollen tot een minimum.
Houd de input die de gebruiker moet leveren zo min mogelijk. En sla informatie van de gebruiker op zodat hij dit niet steeds opnieuw hoeft te typen.
Maak knoppen groot genoeg en houd genoeg ruimte tussen verschillende interactieve Element-en zodat de gebruiker altijd de actie uitvoert die hij bedoelde.
6.1.2 Richtlijnen Android
Apparaten en resoluties
Er zijn 4 gebruikelijke schermdichtheden voor de Android toestellen. Te weten:
Android adviseert om eerst te bouwen voor de “Baseline” MDPI (Medium dots per inch) variant en daarna omhoog en omlaag te schalen voor de andere dichtheden.
Op deze manier ligt het uitgangspunt in het mid-den en duiken er minder problemen op met de lay-out en zijn schaalbaarheid dan als je bij de hoogste of laagste resolutie begint.
Touch feedback
Wanneer een gebruiker het scherm aanraakt op een actie gebied, moet er sprake zijn van visuele feedback.
Afmetingen en Grids
Als afmeting voor een touchscreen object wordt een minimale lengte en breedte van 7-10 mm aangegeven. Dit komt overeen met een minimum van 48 DP(op de laagste resolutie is dit 9 mm.) Als deze eenheid aangehouden wordt heb je ook altijd een goede verhouding tussen informatie dichtheid en toegankelijkheid van de elementen.
tussen iedere 2 elementen dient een ruimte te zitten van 8dp.
Lettertype
Met de komst van Android 4.0 Ice Cream Sand-wich is speciaal een lettertype ontwikkeld welke duidelijk is op hoge resolutie mobiele schermen en welke ideaal geschikt is voor interfaces.
6 User interface
Terug
Terug
Er zijn 4 vaste kleuren voor tekst in Android UI’s deze zijn:
Hierin wordt onderscheid gemaakt tussen donk-ere thema’s en lichte thema’s.
qua grootte adviseert Android de volgende maten.
Kleuren
Kleuren worden binnen Android apps gebruikt om nadruk te leggen op bepaalde elementen. Blauw is de standaard binnen Android appli-caties maar ook de andere kleuren hieronder behoren tot het pallet.
Pictogrammen
Pictogrammen vormen een belangrijk onderdeel van de Android interface. Niet alleen worden ze in de apps gebruikt, ook is er een pictogram nodig om de app op te starten. Dit zogenaamde launcher pictogram moet een grootte hebben van 48 x 48 dp. De stijl van de launcher
picto-grammen is door bij alle Android apps hetzelfde. Het is een 3-D vooraanzicht van een silhouet dat van bovenaf
bekeken wordt.
Daarnaast zijn er pictogrammen voor in de zoge-naamde actionbar.
Deze pictogrammen geven de meest belangrijke acties die gebruikers met de app kunnen uitvo-eren weer. Pictogrammen voor veelgebruikte functies zijn al beschikbaar. Deze pictogrammen moeten 32x32dp zijn. Hiervan is een vierkant van 24x24 dp bedoeld voor het pictogram en de rest is bedoeld als tussenruimte.
Deze pictogrammen moeten simpele platte, niet te gedetailleerde weergaven zijn van de functies. De lijnen en negatieve ruimtes moeten een dikte hebben van minimaal 2dp.
Terug
Pictogrammen die gebruikt worden in de body van de app dienen klein te zijn. 16x16dp met een 12x12 dp gebied waarin het pictogram zich bevindt en de de rest tussenruimte.
Ze moeten zo simpel mogelijk gehouden worden zodat de gebruiker ze makkelijk kan interpreteren ondanks hun beperkte grootte.
Als deze pictogrammen klikbaar zijn, dient er genoeg contrast te zijn met de achtergrond kleur. Gebruik alleen kleuren als deze ook een doel hebben.
Schrijfstijl
-Hou het zo kort en duidelijk mogelijk -Hou het simpel
-Wees vriendelijk
-Geef de belangrijkste informatie eerst -Omschrijf alleen belangrijke en relevante infor-matie
6.1.3 Richtlijnen IOS
Apple heeft een uitgebreid User Interface Guide line document. Dit document staat op:
http://developer.apple.com/library/
ios/#DOCUMENTATION/UserExperience/Con-ceptual/MobileHIG/Introduction/Introduction. html#//apple_ref/doc/uid/TP40006556-CH1-SW1 Gezien de enorme hoeveelheid onformatie in dit UI guide line document beperken we ons hier tot dezelfde categoriën die ook voor het Android
besturingssysteem besproken zijn. Apparaten en resoluties
IOS draait alleen op producten van Apple. Hier-door zijn er een stuk minder resoluties dan voor bijvoorbeeld Android.
Toch vallen deze ook grofweg in 4 categorieën. iPhone/iPod: 480x320 pixels
iPhone Retina: 960x640 pixels iPad ( 1,2): 1024x768 pixels 3th Gen iPad: 2048x 1536 pixels
Voor zowel de iPhone Retina als de 3th Gen iPad geldt dat de resolutie 2 keer die van zijn voorganger is.Dit maakt ontwerpen voor verschil-lende IOS apparaten relatief eenvoudig.
Touch feedback
IOS gebruikers verwachtingen soepele anima-ties wanneer er iets gebeurt. Niet alleen ver-wachten ze directe feedback wanneer er op een knop wordt gedrukt, ook willen ze op de hoogte gehouden worden van langdurige operaties. Standaard worden IOS UI elementen gehighlight als er op getapt wordt.
Afmetingen en grids
De minimale afmetingen voor klikbare IOS elementen is 44x44 dp verder worden er geen maten genoemd voor klikbare elementen. Lijsten zijn veelgebruikte elementen binnen IOS, Voor de opbouw van een lijst zijn er
duidelijke regels:
Terug
Terug
Beiden varianten kunnen gebruikt worden. Ook moet er rekening gehouden worden met het verschijnende toetsenbord wanneer de gebruiker tekst moet typen.
Lettertype
Er zitten standaard 58 fonts in de laatste versie van IOS. Deze kunnen allemaal gebruikt worden. Een voordeel bij het gebruik van deze fonts is dat ze allemaal goed leesbaar zijn op kleine scher-men.
Voor een volledige lijst van al deze fonts: http://iosfonts.com/
Kleuren
Kleurgebruik is vrij in IOS. Er zijn standaard kleuren voor IOS lijsten enzovoorts. Die werden in “ afmetingen en grids” al genoemd.
Apple verwacht wel in iedere IOS app op maat gemaakte grafische elementen. Er wordt veel waarde gehecht aan mooie applicaties, die ook veel esthetische waarde hebben.
Pictogrammen
Er zijn minimaal 3 pictogrammen nodig voor een IOS app. Het applicatie pictogram is de eerste
hiervan. Deze komt op het homescherm van de IOS apparaten en hiermee kan de applicatie gestart worden.
Voor de iphone en de iPod Touch zijn de vol-gende groottes vereist.
57 x 57 pixels
114 x 114 pixels (hoge resolutie)
Voor de iPad zijn de volgende groottes vereist. 72 x 72 pixels
144 x 144 (hoge resolutie)
IOS voegt aan ieder pictogram 3 grafische ef-fecten toe.
- afgeronde hoekjes - slagschaduw - reflectieve glans
Dit maakt het verschil tussen een standaard pictogram:
en een pictogram op een IOS home scherm:
Terug
Daarnaast dient er een pictogram gemaakt te worden voor de appstore.
deze moet 512 x 512 pixels
1024 x 1024 pixels (hoge resolutie)
hier kan meer detail in maar hij moet wel aanslu-iten bij de stijl van het app pictogram.
Het laatste pictogram dat iedere app moet heb-ben is een Launch image. Als de app start wordt deze weergegeven over het hele scherm. Dit plaatje moet dus voor ieder apparaat zo groot zijn als het scherm toelaat.
Dit is in de meeste gevallen de statische achter-grond van de applicatie, zodat hier geen extra overgang tussen plaatsvindt.
Optionele pictogrammen
Voor de navigatie, toolbar en tabbar zijn er een heleboel pictogrammen beschikbaar. Eigen pic-togrammen dienen voor de navigatie en toolbar aan de volgende eisen te voldoen
Ongeveer 20 x 20 pixels
Ongeveer 40 x 40 pixels (hoge resolutie) Voor de tabbar geldt:
Ongeveer 30 x 30 pixels
Ongeveer 60 x 60 pixels (hoge resolutie) Al deze optionele pictogrammen moeten: - Simpel en gestroomlijnd zijn.
- Niet te verwarren zijn met systeem-eigen picto-grammen.
- Makkelijk te interpreteren zin.
- Acceptabel zijn en dus niet aanstootgevend. Schrijfstijl
Geschreven woord dient beknopt en duidelijk gehouden te worden.
6.2 Trends
Er zijn heel erg veel trends te ontdekken op gebied van Mobile UI design. Hieronder worden echter alleen de trends besproken die ook daad-werkelijk voordelen hebben bij de kinderfashion applicatie en welke ook gebruikt kunnen worden. 5 item tabbar
Een tabbar met 5 tabs met de focus op de mid-delste. Deze geeft de hoofdfunctie van de app weer. Op deze manier zouden alle functies in 1 keer in beeld kunnen staan.
ook geeft het de hoofdfunctie van de app op een dusdanige manier weer dat hij altijd in het oog springt.
Zijwaartse foto sliders
Door zijwaarts per rij te sliden heb je het voordeel dat de andere rijen stil kunnen blijven staan. Dit is ideaal als je meerdere dingen wilt vergelijken en bij kleding kan dit ook echt uitkomst bieden. Je kan zo shirt, broek en schoenen onder elkaar zetten om te kijken of het matcht.
Terug
Terug
6.3 Beslissingen op basis van dit
onder-zoek
De algemene richtlijnen in dit hoofdstuk zul-len worden nagevolgd in de realisatie fase van de applicatie. Door rekening te houden met menselijke eigenschappen blijft de applicatie zo toegankelijk en natuurlijk mogelijk.
Door de grafische richtlijnen van IOS en Android beiden te onderzoeken was het mogelijk om een beeld van de grafische vrijheid van beiden te vor-men. Hieruit blijkt dat, hoewel de documentatie van de iPhone veel uitgebreider is, hier meer vrijheid is qua vormgeving (minder restricties aan bijvoorbeeld kleur en lettertype) Ook zijn er voor IOS apparaten maar 4 resoluties en maar 2 verschillende verhoudingen waar rekening mee gehouden moet worden.
Volgend op deze vergelijking is de beslissing genomen dat het prototype ontwikkeld wordt volgens de IOS standaard. Naast de algemene richtlijnen zullen dus ook de IOS richtlijnen in acht worden genomen bij het ontwikkelen van het prototype.
Het volgen van trends is geen verzekering van een succesvolle applicatie. Echter zijn deze trends er niet voor niets. De 2 besproken trends voegen iets toe aan de functionaliteit en de overzichtelijkheid van de applicatie. Vandaar dat deze 2 ook een rol zullen spelen in de uiteindeli-jke realisatie.
Een zijwaartse foto slider is handig in een over-zicht van kledingstukken die de gebruiker al als favoriet heeft aangegeven. Als de gebruiker een zoekopdracht geeft voor alleen broeken wordt er door de resultaten gebladerd door verticaal te scrollen.
In hoofdstuk 4 werd genoemd dat horizontaal scrollen op een mobiel apparaat vermeden dient te worden. Echter het idee van een horizontale foto slider is niet dat er horizontaal gescrold wordt maar dat foto’s op een verticale as naast elkaar ingeladen worden en hier doorheen gebla-derd kan worden door de foto’s naar links of naar rechts te schuiven.
Terug
In dit onderzoek worden concurrerende apps. Op basis van een Sterkte-zwakte analyse zijn de voor en nadelen van de concurrenten anno 2012 in kaart gebracht en zijn er patronen en kansen duidelijk geworden.
Deze informatie is vergaard op basis van deskre-search
7.1 Wat zijn de krachten en zwaktes van
de concurrenten?
Ook al wordt kinderkleding voornamelijk vergele-ken via websites, er zijn ook al wat applicaties die in deze behoefte voorzien.
Er is gekeken naar de applicaties van de con-currenten die genoemd werden in de enquête. Aangezien hier geen enkele vergelijkingsapplica-tie bij zat en alleen websites van retail winkels is deze lijst aangevuld met 3 applicaties die kinder-kleding van meerdere retailers vergelijken. Enquête
Zara H&M
Aangevulde applicaties Mode Outlet (DE) Shopstyle (VS) Smallfashion(SE)
Voor deze 5 applicaties is gekeken wat de func-ties in de app waren, hoe ze gestructureerd zijn als men een kledingstuk wil zoeken/kopen, wat hun krachten zijn en waar de zwaktes zitten. Hierdoor kwamen verschillende opvallendheden naar boven. De structuur is over het algemeen redelijk hetzelfde en de functies verschillen ook niet te veel van elkaar. In de basis doen 4 van de 5 applicaties hetzelfde, alleen zijn sommige uit-gebreider. De H&M app valt er een beetje buiten
aangezien hier geen duidelijke zoekfunctie in zit, er geen aankopen gedaan kunnen worden en hij meer gericht is op het weergeven van huidige aanbiedingen. De andere 4 hebben allemaal de mogelijkheid om kleren te zoeken op basis van tenminste categorieën.
Filter functies komen voor in 2 van de vergelijk-ingsapplicaties. Namelijk Shopstyle en My Best Brands. Dit zijn ook de enige 2 applicaties waarin kleding van verschillende retailers gekocht kan worden. Hierdoor staat er ook zeer veel kled-ingstukken in de databases en is een filter zeker geen overbodige luxe. Smallfashion biedt wel een groot assortiment aan merken aan maar is zelf de retailer.
My Best Brands laat alleen kledingstukken in de aanbieding zien, hierdoor kun weet je zeker dat je de goedkoopste kledingstukken koopt. Je loopt echter ook een boel kleding mis die niet in de aanbieding is.
De sale alerts die in de H&M en Shopstyle app zitten zijn een handige manier om de gebruiker in contact te laten komen met de app.
7 Concurrentie analyse
Terug
Terug
Zara
Doel app Structuur Strengths Weaknesses
H&M Shopstyle My Best Brands.de Small-fashion weergeven en aanbieden van het complete assortiment, gebruiker kan aakopen doen in de app Browse, search,refine, buy, favorite, sale alerts, share. Alle kleding van de meest “fashionable” shops en merken weer-geven in 1 applicatie en mogelijkheid tot aankoop. koppeling met PC. promoties en aanbeidingen weer-geven, de laatste arrivals weergeven, allerts bij kortingen, wishlist samenstel-len, winkel vinden via GPS social shares leeftijd en geslacht --> kleding catego-riën --> foto’s --> detailpagina leeftijd en geslacht --> kleding categoriën --> foto’s --> detailpa-gina (uitgebreide filter functies) leeftijd en geslacht --> alles --> foto’s --> detailpagina ( filter functies) merk -->geslacht -> leeftijd --> kled-ing categoriën --> foto --> detailpa-gina alle kledingsstukken die in de aanbieding zijn weergeven voor meer dan 400 on-line shops. Browse Search Refine buy favorite. koppeling met PC.
Kinderkleding van een boel merken verkopen via een applicatie. dames heren kinderen --> foto’s --> favorieten overzichtelijk, aankoop mogelijk en logische flow belangrijkste infor-matie wordt snel weergegeven. sale alerts, uitgebreidde filter opties, overzichtelijk aankoop is mogelijk alles is in de aan-bieding dus goed-koop, filter opties, overzichtelijk
alleen kinderkled-ing
sale alert erg handig,
app crasht vaak waardoor mensen snel opgeven. Producten in win-kelmandje kunnen niet in 1 klik weer op de detailpagina bekeken worden
generiek design
staan producten in die niet meer verkrijgbaar zijn
geen filter vreemde structuur, schoon-heidsfoutjes (teksten te lang waardoor delen verloren gaan) te weinig feedback (aantal items in de slider worden niet weergegeven. onoverzichtelijk, geen aankopen mogelijk, verlanglijstje zit weggestopt
Onderzoek
Terug
7.2 Beslissingen op basis van dit
onder-zoek
Door de krachten en de zwaktes van de con-currenten te bekijken zijn er 2 beslissingen genomen.
-De krachten die 2 of meer apps gemeenschap-pelijk hebben worden ook nagestreefd bij het concept.
-De zwaktes moeten vermeden worden.
7.2.1 Krachten
Overzichtelijk
Er moet een duidelijke structuur in de navigatie zitten. Het moet voor de gebruiker duidelijk zijn waar hij zich op dat moment bevindt en wat hij kan doen. Daarnaast moet er op gelet worden dat er genoeg informatie getoond wordt zonder dat het rommelig wordt.
de meest gebruikte navigatie structuur wordt aangehouden.
globaal:
leeftijd en geslacht --> kleding categoriën --> foto’s --> detailpagina
Sale alert
Op de hoogte blijven van kortingen is niks nieuws. Maar door zelf aan te geven van welke kledingstukken je een notificatie wilt krijgen als ze in prijs verlaagd worden is een extra toevoeg-ing waar de doelgroep ook al het nut van inzag. Filter functies
Doordat een vergelijkingswebsite een groot as-sortiment heeft is een filter functie nodig. Zo kan de gebruiker veel duidelijker vinden wat hij zoekt en is hij minder tijd kwijt aan het doorkijken van kledingstukken die buiten zijn interesse gebied vallen.
De belangrijkste filter functies zijn Leeftijd, geslacht en kleding categorie. Het merendeel van de concurrenten implementeerde deze 3 keuzes al in de zoekstructuur. Hierdoor zoekt de gebruiker altijd al redelijk specifiek naar het juiste product dat ook geschikt is voor zijn of haar kind.
Er zijn echter nog een aantal criteria die uitkomst kunnen bieden bij het vinden van het juiste prod-uct de meest voorkomende uit de onderzochte apps staan hier op een rijtje.
-merk -kleur -winkel -prijs -maat
-alleen producten die in prijs verlaagd zijn Verder is een sorteer functie op prijs een waarde-volle toevoeging. Als de zoekopdracht voldoende gespecificeerd is kan het goedkoopste product dat aan de wensen voldoet het beste bovenaan getoond worden.
Aankoop mogelijk
Ook al bleek uit de enquête van hoofdstuk 4 dat mobiele transacties nog niet erg populair zijn in Nederland, de functie om kleding in een winkel-wagentje te bewaren en via de aanbieders’ web-site te kopen is wenselijk voor diegenen die wel al bereid zijn mobiele transacties te verrichten. Koppeling met PC
Omdat de doelgroep in de enquête van hoofd-stuk 4 al aangaf dat men nog niet helemaal klaar is voor aankopen via de mobiel, maar wel via de desktop of laptop geeft aan hoe belangrijk deze functie is. Kleding vergelijken en bekijken gaat prima op een mobiel apparaat. Door de voorkeuren te bewaren en de gebruikers via de PC de transactie te laten uitvoeren wordt het
Terug
aantal verkochte producten verhoogd.
7.2.2 Zwaktes
Sommige van de genoemde zwaktes moeten te alle tijden vermeden worden. Het is nooit bevorderlijk als een applicatie crasht of als er schoonheidsfoutjes in zitten. Er zijn echter ook specifiekere zwaktes naar voren gekomen bij de concurrenten. Ook deze zullen vermeden moeten worden om de applicatie zo gebruiksvriendelijk mogelijk te maken.
Onoverzichtelijk
De functies moeten duidelijk zijn voor ieder scherm waar de gebruiker naartoe navigeert. Daarnaast moet hij ook snel kunnen navigeren naar de producten waarnaar hij op zoek is. Vreemde structuur
3 van de 5 applicaties gebruiken grotendeels dezelfde structuur. Hieruit valt te concluderen dat de gebruikers waarschijnlijk gewend zijn aan een dergelijke structuur. Hier van afwijken kan on-nodig verwarring bij de gebruiker veroorzaken. Catalogus niet up to date
Het moet vermeden worden om producten in de catalogus te hebben die door de aanbieder niet meer verkocht worden om welke reden dan ook. Gebruikers zien dit als een teleurstelling en er kan een negatief beeld richting de applicatie en het merk ontstaan.
Verwachte functies niet vindbaar of afwezig Gebruikers hebben een bepaald verwachitng-spatroon van vergelijkingssites. Hieraan dient zoveel mogelijk voldaan te worden. (wensen en eisen doelgroep zijn terug te vinden in hoofdstuk 4) Functies die zich wel in de applicatie bev-inden maar de gebruiker moiete kosten om te vinden zullen aanzienlijk minder gebruikt worden
dan wanneer deze duidelijk in beeld gebracht worden.
8.1 Conclusies
In ieder hoofdstuk zijn conclusies getrokken op basis van de behandelde deelvragen.
Hieronder worden al deze conclusies gebundeld in 4 categorieën om tot een antwoord op de hoofdvraag te komen.
Hoofdvraag:
“Hoe kan een mobiel platform zo veel mogelijk bijdragen aan de interactie tussen een kinder-fashion vergelijkingswebsite en diens doel-groep?”
8.1.1 Doelgroep
Men is bereid om kinderkleding via mobiele ap-paraten te vergelijken maar er is een gebrek aan een duidelijke vergelijkingsapplicatie.
Een app is van toegevoegde waarde op basis van de wensen van de doelgroep door func-tionaliteiten als een mobiele camera en notifica-ties.
De doelgroep is beperkt bereid mobiele transac-ties te verrichten maar men zou wel afrekenen op desktop of laptop.
De doelgroep gebruikt voornamelijk Android en IOS apparaten.
8.1.2 Functioneel
Naast een zoekfunctie, het vergelijking van kledingstukken en deze aan een winkelmandje/ favorietenlijst toevoegen Is er vraag vanuit de doelgroep naar:
-kortingen en sale alerts.
-kleren doorverkopen door foto’s te uploaden. Er dient een duidelijke weergave per product te zijn minimaal op basis van de volgende criteria:
-Maat -Foto -Prijs -Levertijd -Voorraad -Geslacht
Dit kan op basis van filters, of een weergave op de resultaten pagina.
Filters moeten toegevoegd worden zodat gebruikers makkelijker vinden wat ze nodig heb-ben.
Er dient een koppeling met de website gemaakt te worden zodat het winkelmandje gesynchro-niseerd kan worden en via desktop afrekenen mogelijk is.
De benodigde functies zijn beschikbaar binnen IOS en Android
8.1.3 Technisch
Een hybride app is de meest efficiënte vorm van een applicatie voor dit project.
Een hybride app kan Native functies van de telefoon gebruiken en makkelijk met een website communiceren.
Het meest geschikte framework voor de hybride app van dit project is Phone Gap met de JQ-touch plug-in. De gehele applicatie kan op deze manier met behulp van HTML CSS en Javascript geschreven worden.
Het prototype is gericht op een IOS app. Doordat er met Phone gap gewerkt wordt valt de applicatie op een later tijdstip goed over te zetten naar Android.
