AFSTUDEERPROJECT
HALLOWEEN FACEBOOKSHOP GEKOPPELD AAN MAGENTO
Hogeschool van Amsterdam
Communication and Multimedia Design
Afstudeerproject 2013/2014
Bekijk de Facebookshop zélf op:
http://goo.gl/zFCFCg
Voorwoord
De afstudeerfase biedt mij een uitgelezen kans om twee van mijn persoonlijke, professionele interesses gecombineerd in te brengen in een (afstudeer)project. Webdevelopment alsook sociale media hebben mij aangezet tot het realiseren van een Facebookshop te combineren en toe te passen op één groot project. Hoewel dit afstudeerproject door mij volledig zelfstandig is uitgevoerd, hebben een aantal personen mij gesteund bij de realisatie hiervan. Ik wil van de gelegenheid gebruik maken om een persoonlijk dankwoord uit te spreken aan alle betrokkenen die mij tot steun zijn geweest tijdens mijn studie en dit afstudeertraject.
In het bijzonder wil ik de opdrachtgever, Jordy van Overeem, bedanken voor het verlenen van de opdracht, zijn begeleiding en onze plezierige samenwerking. Ik hoop dan ook van ganzen harte dat de Facebookshop in de toekomst winstgevend zal bijdragen voor zijn onderneming. Ook wil ik mijn vriendin, vader en moeder bedanken voor de mentale support die zij mij hebben geboden. In perioden van spanning, frustratie en nervositeit heeft hun steun mij telkens weer gemotiveerd en mij gaande gehouden.
Tot slot wil ik mijn afstudeerbegeleider Anne Marleen Olthof bedanken voor haar nuttige afstudeersessies, haar hulp en feedback.
Met een zekere voldoening en met genoegen blik ik terug op het resultaat. Purmerend 2013
Managementsamenvatting
Deze scriptie is geschreven in het kader van het afstudeertraject van de opleiding Communication and Multimedia Design aan de Hogeschool van Amsterdam. Als onderwerp is gekozen voor de
ontwikkeling van een in Facebook geïntegreerde webshop en deze te koppelen aan het webshop-systeem Magento. Dit project wordt uitgevoerd in dienst van het bedrijf Colorlens. Dit bedrijf handelt online in kleurlenzen en biedt deze aan door middel van een webshop op internet: Colorlens.nl. Colorlens.nl maakt gebruik van het populaire webshop-systeem genaamd Magento.
Magento is een applicatiebeheerssysteem, waarmee niet alleen webshops kunnen worden opgezet maar ook mogelijkheden biedt voor het beheer van productvoorraden, de financiële administratie en de boekhouding. Aangezien deze faciliteiten onontbeerlijk zijn voor een goede bedrijfsvoering, is bewust gekozen om een koppeling te programmeren tussen de Facebookshop en Magento. Deze koppeling maakt van Magento één centraal beheersysteem voor beide webshops.
De uitdaging van dit project is dat de Facebookshop en Magento twee verschillende systemen zijn die, voorafgaand aan dit onderzoek, nog onafhankelijk van elkaar functioneerden. De wijze waarop de koppeling wordt opgezet is bepalend voor de manier waarop de systemen zullen communiceren. Aan de koppelingsmethode worden daarom eisen gesteld. Deze systeemeisen stellen dat de
gegevensoverdracht tussen beide systemen betrouwbaar en snel moet verlopen. Op grond van deze eisen worden de koppelingstechnieken onderzocht en wordt hieruit een keuze gemaakt voor
implementatie.
Binnen deze Facebookshop worden kleurlenzen aangeboden toegespitst op het evenement
Halloween. Eerder onderzoek heeft namelijk uitgewezen dat Colorlens in de perioden van Carnaval en Halloween de meeste producten worden verkocht. Het volledige productassortiment van de
Facebookshop wordt ingericht in Magento en toegespitst op Halloween. Gezien het tijdsbestek van dit onderzoek is besloten dit project vooralsnog te beperken tot een event: Halloween.
Het sociale netwerk en Facebook zelf, bieden extra mogelijkheden voor de Facebookshop. In grote getalen discussiëren en bereiden Facebook-gebruikers zich voor op Halloween evenementen. In het eerste hoofdstuk wordt onderzoek verricht naar de mogelijkheden, waarmee het eindproduct zich kan mengen in deze discussie, of zelfs een eigen discussie kan starten. Uit dit hoofdstuk komen
interessante middelen naar voren, waaronder de Social Plugins. Deze plug-ins maken het mogelijk dat gebruikers kleurlenzen kunnen delen met derden, kunnen ‘liken’ en kunnen aanraden aan anderen met behulp van de Facebook Comments Plugin.
Deze scriptie wordt vervolgd met een gebruikersonderzoek waarin interviews worden afgelegd en enquêtes worden verspreid. Met deze hulpmiddelen worden de verwachtingen van de stakeholders omtrent de Facebookshop inzichtelijk gemaakt. Deze verwachtingen worden vertaald naar
systeemeisen. Deze eisen bepalen de functionaliteit van de Facebookshop. Nadat het besluit voor een koppelingstechniek kenbaar is gemaakt, volgt er een verantwoording van het ontwikkelproces. Naast de ontwikkeling van de webshop wordt er aandacht besteed aan de opbouw van de koppeling. Deze beschrijving maakt duidelijk hoe producten getransporteerd worden naar Facebook en hoe bestellingen binnen Facebook worden opgeslagen in Magento.
Het systeem wordt uitvoerig getest en worden de laatste bevindingen verwerkt in het eindproduct. Alle overige bevindingen met een lagere prioriteit, worden beschreven in het hoofdstuk: conclusies, kanttekeningen en aanbevelingen.
Voorwoord ... 0 Managementsamenvatting ... 1 Inleiding ... 4 Werkwijze en verantwoording ... 4 1 Het bedrijf ... 5 1.1 Aanleiding ... 5 1.2 Probleemstelling ... 6 1.3 Doelstelling ... 6 1.4 Gewenst resultaat ... 6 1.5 Onderzoeksvraag ... 7 1.6 Deelvragen ... 7 2 Onderzoek ... 8 2.1 Onderzoeksmethoden en technieken ... 8 2.2 Ontwikkelmethoden en technieken ... 9
3 Van E-Commerce naar F-Commerce ... 9
3.1 E-Commerce ... 9 3.2 F-Commerce ... 10 3.2.1 Soorten F-Commerce ... 10 3.2.2 Conclusie ... 11 3.3 F-Commerce Ecosphere ... 12 4 Analyse Facebookshop ... 13 4.1 Typen Facebookshops ... 13 4.1.1 Conclusie ... 13
4.2 Specifieke kenmerken van een Facebookshop ... 14
4.3 Conclusie ... 16 5 Gebruikersonderzoek ... 17 5.1 Stakeholderanalyse ... 17 5.2 Rollen en verantwoordelijkheden ... 17 5.3 Stakeholder interviews ... 18 5.3.1 Opzet onderzoek ... 18 5.3.2 Opdrachtgever ... 19 5.3.3 Consumenten ... 20 5.3.4 Conclusie consumentenenquêtes ... 21
5.3.5 Conclusie expert interview ... 21
6 Systeemanalyse ... 22 6.1 Functionele eisen ... 22 6.2 Niet-functionele eisen ... 22 6.3 Interface eisen ... 23 6.4 Deelproducten ... 23 6.5 Systeemeisen ... 23 6.5.1 Programmeertaal ... 24 6.5.2 Web hosting ... 24 6.6 Randvoorwaarden ... 24 6.7 Use-cases ... 24 7 Koppelingstechnieken ... 27
8.6 Deelproduct 2: Synchronisatiemodule ... 31 8.7 Deelproduct 2: Betaalmodule ... 32 8.8 Deelproduct 3: Winkelwagen ... 33 8.9 Deelproduct 3: Productdetailpagina ... 33 9 Systeemtests ... 34 9.1 Voorbereidende fase ... 34 9.2 Uitvoerende fase ... 34 9.3 Evaluatiefase ... 34 9.4 Testresultaten ... 34 9.5 Conclusie ... 35
10 Conclusies, Kanttekeningen & aanbevelingen ... 36
10.1 Conclusie ... 36
10.2 Kanttekeningen ... 36
10.3 Aanbevelingen ... 36
11 Bibliografie ... 38
12 Bijlagen ... 39
Bijlage 1 Google Analytics statistieken ... 39
Bijlage 2 Wat is een Facebook webshop? ... 40
Bijlage 3 Wat is Magento? ... 41
Bijlage 4 Vragenlijst interview met opdrachtgever ... 41
Bijlage 5 Vragenlijst interview met consumenten ... 41
Bijlage 6 Vragenlijst interview met Walibi ... 42
Bijlage 7 Enquêteresultaten consumenten ... 43
Bijlage 8 Entiteit Relatie Diagram ... 46
Bijlage 9 Wireframe ... 47
Bijlage 10 Sequence diagram ... 48
Bijlage 10: Systeemtest checklist ... 49
Bijlage 11 Productoverzicht in een Facebook App ... 50
Bijlage 12 Productoverzicht in een Facebook tab ... 51
Bijlage 13 Product detailpagina ... 52
Bijlage 14 Winkelwagen ... 53
Bijlage 15 Afrekenen ... 54
Bijlage 16 Transactie Sisow in testmodus ... 55
Bijlage 17 Order bevestiging ... 56
Bijlage 18 Email bestelbevestiging ... 57
Inleiding
Colorlens.nl is een gespecialiseerde online aanbieder van kleurlenzen in Nederland. Middels een webshop verkoopt deze onderneming een omvangrijke collectie aan kleurlenzen. Colorlens.nl richt zich met online verkoop op een afgebakend, klein bewerkbaar deel van de markt. Deze nichemarkt omvat een specifieke doelgroep met een gemiddelde leeftijd dat varieert tussen de 16 en 35 jaar. Carnaval en Halloween zijn hoogtijdagen voor de online verkoop in de webwinkel, juist in deze perioden worden de meeste kleurlenzen verkocht. Het specifieke karakter en sfeer van deze
evenementen maakt dat onder genoemde doelgroep een diep verlangen ontstaat om op te vallen. De bezoekers van de evenementen beantwoorden deze behoefte door zich uit te dossen in passende opvallende kleding. De outfit wordt verder geaccentueerd en gecompleteerd met een paar kleurlenzen. Het aankoopgedrag tijdens Halloween heeft de ondernemer getriggerd om een nieuwe
verkoopstrategie te onderzoeken en op te zetten. Vanuit deze strategie is het idee ontstaan om een Facebookshop te ontwikkelen, om gericht kleurlenzen aan te bieden, in eerste instantie toegespitst op Halloween.
Werkwijze en verantwoording
Van groot belang wordt geacht om in deze scriptie de realisatie van de Facebookshop procesmatig inzichtelijk te maken. De algemene werkwijze bestaat uit twee onderzoeksmethoden die zijn gebruikt om tot de conclusies en aanbevelingen te komen. De twee onderzoeksmethoden zijn hieronder schematisch weergegeven.
Afbeelding 1. Research for Design versus Research through design: Uit “Manual Afstudeerproject 2012-13”, door Sonja Rouwhorst. 2012-13
Research for Design wordt ingezet om een beter inzicht te krijgen in de hoofd- en deelvragen. In deze fase wordt gezocht naar oplossingen die de ontwerpvraag en bijbehorende deelvragen kunnen
beantwoorden. De onderzoeksresultaten die hieruit voortvloeien worden later in dit onderzoek gebruikt ter ondersteuning van het ontwikkelproces.
1 Het bedrijf
Colorlens.nl verkoopt via een webshop op internet een omvangrijke collectie aan kleurlenzen. Het is de stellige overtuiging van de opdrachtgever, dat twee belangrijke factoren het commerciële succes van de webshop hebben bepaald. Nader onderzoek bevestigt dit. Deze factoren zijn de nichemarkt waarop Colorlens zich doelgericht richt en de investering in zoekmachine optimalisatie.
1. Nichemarkt
Colorlens richt de verkoop op een afgebakend en klein bewerkbaar deel van de markt: een specifieke doelgroep met een leeftijd die varieert tussen de 16 en 35 jaar. Naar deze doelgroep probeert
Colorlens op twee verschillende manieren een zeker expertstatus uit te stralen. Dit doet zij enerzijds door een groot assortiment aan kleurlenzen aan te bieden, anderzijds door de klanten in de webshop goed te informeren, bijvoorbeeld over het gebruik van kleurlenzen.
2. Investering in zoekmachine optimalisatie
Volgens de opdrachtgever is de investering in zoekmachine optimalisatie de belangrijkste sleutel geweest tot het commerciële succes van de webshop. Deze techniek van zoekmachine optimalisatie heeft de webshop beduidend beter vindbaar gemaakt. Dit blijkt dan ook uit de hogere posities in de organische zoekresultaten van zoekmachine Google. Cijfers van bezoekersaantallen tonen een sterke groei aan. Volgens de opdrachtgever heeft deze groei tot een constante groei in omzet en beter bedrijfsresultaat geleid. Zie, bijlage 1: Google Analytics Statistieken (1).
De evenementen Carnaval en Halloween vormen de belangrijke speerpunten, waarop de online verkoop van de webshop bewust is gericht. In de aanloop naar deze evenementen worden de meeste kleurlenzen afgezet. De specifieke sfeer en de entourage creëert bij de doelgroep een diep verlangen om op te vallen. Dit verlangen vervullen de deelnemers met verkleedpartijen. Men kiest voor een persoonlijke outfit en zoekt daarbij passende kleurlenzen.
1.1 Aanleiding
Het aankoopgedrag tijdens Carnaval en Halloween is de aanleiding geweest om een nieuwe
verkoopstrategie te onderzoeken en uit te werken. Vanuit dit oogpunt is het concept ontstaan om een Facebookshop te ontwikkelen. Deze webshop moet het mogelijk maken om gerichter kleurlenzen aan te bieden toegespitst op evenementen zoals Carnaval of Halloween. Daarnaast kan de Facebookshop van toegevoegde waarde zijn voor de sociale marketing activiteiten van de opdrachtgever. Te denken valt aan reclame-uitingen (Bijlage 2: Wat is een Facebook webshop?)
Gekozen is om het systeem Magento, waarmee de huidige webshop wordt beheerd, verder te ontwikkelen tot één integraal beheersysteem, waarmee ook de nieuwe Facebook webshop kan worden beheerd. (Bijlage 3: Wat is Magento?)
Magento biedt verschillende functionaliteiten voor het beheer van beide webshops in één omgeving. 1. De productvoorraadregistratie
2. De financiële administratie 3. De transacties
1.2 Probleemstelling
De bestaande webshop en de Facebookshop zijn in de basis twee verschillende systemen die gescheiden in twee omgevingen, onafhankelijk van elkaar functioneren. Om beide systemen centraal integraal te kunnen beheren, dienen deze twee systemen aan elkaar te worden gekoppeld. Het CMS van Magento moet daartoe worden geprogrammeerd tot een centraal beheersysteem voor beide webshops. Voor het beheer op één locatie moet er een koppeling worden geprogrammeerd zodat beide systemen met elkaar kunnen communiceren.
Ontwerpuitdaging
Voor een goede werking van Magento als centraal beheerssysteem is het van groot belang dat beide systemen gegevens met elkaar kunnen uitwisselen Dit kan alleen door beide systemen aan elkaar te koppelen en zodoende van Magento één centraal beheerpunt wordt gemaakt.
De technische oplossing om Magento en de Facebookshop aan elkaar te koppelen is de uitdaging van dit project.
Het belang van functioneel specificeren
Om tijdens de ontwikkelfase het overzicht te behouden is het van belang dat vooraf de
functionaliteiten worden gespecificeerd. Door te werken met functionele specificaties wordt duidelijk waarvoor bepaalde functies nodig zijn en waarvoor deze dienen. Omdat de Facebookshop uit een groot aantal functionaliteiten bestaat, is dit overzicht van extra belang. Bovendien voegt de koppeling met Magento daar extra functionaliteiten aan toe.
1.3 Doelstelling
Doelstelling van dit project is om een Facebookshop te ontwikkelen dat is gekoppeld aan het Magento beheersysteem. Hierbij moet Magento functioneren als centraal beheersysteem voor zowel de huidige webshop als voor de nieuwe Facebookshop. Uitgangspunt is dat de opdrachtgever één omgeving behoudt waarin beide webshops volledig beheerd kunnen worden. Hierdoor wordt het ondernemen en beheren van beide webshops zo eenvoudig mogelijk gemaakt.
De technische koppeling tussen beide webshops moet minimaal voldoen aan de volgende eisen: • De productvoorraad wordt op één locatie in het Magento CMS beheerd.
• De financiën worden op één locatie in het Magento CMS beheerd. • De transacties worden op één locatie in het Magento CMS beheerd. • De Facebookshop bestellingen worden opgeslagen in het Magento CMS.
• Het productassortiment van de Facebookshop wordt opgemaakt in het Magento CMS
1.4 Gewenst resultaat
Het gewenste eindproduct is een functionerende Facebookshop dat gekoppeld is aan het bestaande webshop-systeem Magento.
1.5 Onderzoeksvraag
Om tot een juiste oplossing te komen voor de gestelde problematiek, werd de volgende onderzoeksvraag geformuleerd:
Onderzoeksvraag
Hoe kan ik een Facebookshop ontwikkelen dat is gekoppeld aan het webshop-systeem Magento?
1.6 Deelvragen
Bovengenoemde onderzoeksvraag is weer onderverdeeld in een aantal deelvragen:
Gebruikersonderzoek
Wie zijn de stakeholders die direct of indirect invloed uitoefenen op het gewenste eindproduct?
Techniek
Wat zijn de specifieke kenmerken van een webshop die relevant zijn voor een Facebookshop? Welke typen Facebookshops bestaan er en zijn relevant voor Colorlens?
Realisatiefase
Wat zijn de essentiële functionaliteiten waaruit de Facebookshop moet bestaan? Op welke functionaliteiten van Magento moet de Facebookshop worden aangesloten? Met welke technieken kan een koppeling worden geprogrammeerd tussen beide webshops? Aan welke functionele eisen moet de Facebookshop voldoen?
Aan welke niet-functionele eisen moet de Facebookshop voldoen? Aan welke randvoorwaarden moet de Facebookshop voldoen?
2 Onderzoek
Voordat het onderzoeksproces van start gaat, volgt hier een overzicht van de gebruikte onderzoeksmethoden, onderzoektechnieken en een overzicht van de ontwikkelmethoden- en technieken.
2.1 Onderzoeksmethoden en technieken
• Desk research
Desk research wordt verricht om tot een oplossing te komen waarmee een koppeling kan worden geprogrammeerd tussen beide webshops. Daarnaast zullen bestaande bronnen worden
geraadpleegd bij het programmeren van de Facebookshop. • Stakeholdermatrix
De stakeholderanalyse is ingezet om te kunnen bepalen welke personen/organisaties direct of indirect invloed uitoefenen op het gewenste eindproduct.
• Stakeholder interviews
Elke stakeholder heeft een eigen rol en wijzigende verantwoordelijkheden voor het eindproduct. Om die reden is voor elke stakeholder een andere vragenlijst opgesteld. Per stakeholder wordt een interview afgenomen met een specifiek doel en worden verschillende onderwerpen behandeld.
• Competitieve analyse
Competitieve analyse wordt ingezet om erachter te komen welke factoren het succes van een Facebookshop bepalen. In dit proces worden verschillende succesvolle Facebookshops bestudeerd en tegenover elkaar gezet.
• Observatieopdrachten
Tot slot worden een aantal personen gevraagd om middels een aantal opdrachten de nieuwe Facebookshop te testen. De uitvoering en het gedrag van de eindgebruikers en het systeem worden geobserveerd en gebruikt om het product te verbeteren.
2.2 Ontwikkelmethoden en technieken
• Agile development
In dit project wordt de agile ontwikkelmethodiek gehanteerd, met als doel de opdrachtgever zoveel mogelijk bij het project te betrekken. Onderstaande Agile ontwikkeltechnieken worden ingezet die het Agile ontwikkelproces te ondersteunen:
• Functionele eisen
In hoofdstuk 6 worden functionele eisen gesteld aan het eindproduct. Aan de hand van deze eisen wordt bepaald wat de gewenste functionaliteiten zijn van de Facebookshop. Bij het opstellen van deze eisen is de opdrachtgever nauw betrokken geweest. Functionele eisen zorgen ervoor dat het eindproduct voldoet aan de verwachtingen van de stakeholders.
• Use-cases
Use-cases worden bepaald door systeemeisen en beschrijven de functionaliteiten van de Facebookshop. Zie ook hoofdstuk 6.
3 Van E-Commerce naar F-Commerce
In dit hoofdstuk wordt de wijze waarop online handel kan worden bedreven binnen Facebook besproken. Maar allereerst volgt nu een definitie van twee elkaar overlappende termen die online handel definiëren, namelijk: E-Commerce en F-Commerce. De twee definities worden tegenover elkaar gezet om verder inzicht te verkrijgen. Daarbij wordt expliciet gemaakt welke mogelijkheden Facebook als platform op het sociale netwerk toe te voegen heeft aan de commercie. Tot slot worden de verschillende Facebook webshops behandeld
3.1 E-Commerce
Vrij vertaald staat E-Commerce (E = Electronic) voor internet commercie. Volgens het woordenboek van Dale staat te term e-commerce voor: handel via het internet (2). Deze handel kan plaats vinden in vele vormen, maar over het algemeen staat dit voor het verhandelen van goederen en/of diensten. Cory Janssen van Technopedia geeft een bredere betekenis aan het woord E-Commerce:
“Electronic Commerce (E-commerce) is the marketing, buying and selling of merchandise or services over the Internet. It encompasses the entire scope of online product and service sales from start to finish. E-Commerce tools include computer platforms, applications, solutions, servers and various software formats manufactured by E-Commerce service providers and purchased by merchants to increase online sales.“ (3)
Uit bovenstaande definitie valt op te maken dat E-Commerce meer is dan louter en alleen online-handel. E-Commerce is een verzamelnaam voor alle activiteiten, processen en toepassingen die het online handelen in goederen en/of diensten mogelijk maakt.
3.2 F-Commerce
Net als E-Commerce is F-Commerce een verzamelnaam van alle activiteiten, processen en toepassingen die online handelen mogelijk maakt. Het enige wat F-Commerce van E-Commerce onderscheidt is dat de online handel wordt bedreven binnen Facebook zelf, óf op welke wijze dan ook, wordt beïnvloedt door Facebook. F-Commerce staat dus voor alle activiteiten, processen en
toepassingen, waarmee online handel wordt bedreven binnen Facebook zelf, óf op welke wijze dan ook buiten Facebook, beïnvloed door Facebook.
3.2.1 Soorten F-Commerce
Verschillende vormen van F-commerce worden onderscheiden welke elk hun eigen specifiek kenmerken bevatten.
Jeff Ente onderkent vier verschillende soorten F-Commerce, namelijk (4): 1. Facebook-Facilitated On-Site Selling
2. Facebook Initiated Selling
3. Complete Selling through Facebook 4. iFrames versus Facebook Apps 1. Facebook-Facilitated On-Site Selling
Met de Social Plugins van Facebook is het mogelijk om de sociale aspecten uit Facebook te
integreren in een website. Social Plugins zijn eenvoudig te integreren door de voorgeprogrammeerde code van Facebook toe te voegen aan de broncode van een website. Als een Social Plugin is
toegevoegd aan een website, worden er opdrachten verzonden naar het netwerk van Facebook. Op het moment dat een opdracht is ontvangen door Facebook, wordt de gewenste informatie uit het sociale netwerk geretourneerd naar de website. De website kan op zijn beurt informatie weergeven die normaliter alleen binnen het sociale netwerk van Facebook wordt getoond.
Populaire en herkenbare voorbeelden van Social Plugins zijn de ‘like’ en ‘share’ knoppen. Deze Social Plugins zijn een waardevolle toevoeging aan de gebruikerservaring van een webshop. Daarnaast maken deze Social Plugins een virtuele vorm van mond-tot-mond reclame mogelijk. Als een gebruiker op een ‘like’ knop klikt, verspreidt Facebook informatie over de context/locatie waarop deze actie is uitgevoerd. Mensen die onderdeel zijn van het sociale netwerk van deze gebruiker, krijgen dan automatisch deze informatie voorgeschoteld. Kortom, Sociale Plug-ins zijn voor E-Commerce ondernemingen waardevolle toevoegingen, waarmee virtuele mond-tot-mond reclame kan worden bewerkstelligd. Door Social Plugins te integreren kan Colorlens kosteloos reclame maken voor producten, bestellingen en winacties/kortingen onder een groot publiek.
Als een extra toevoeging op de Social Plugins, heeft Facebook de Open Graph API ontwikkeld om de gebruikerservaring nog persoonlijker te maken. Ontwikkelaars hebben met deze tool toegang tot persoonlijke informatie van de bezoeker en zijn vrienden binnen zijn sociale netwerk. Met de Open Graph API is het mogelijk om selectief producten te tonen op basis van de interesses die zijn ingevuld in het Facebook-profiel. Ook biedt deze methode de mogelijkheid om profielfoto’s te tonen van een bezoeker en van personen uit zijn vriendenlijst. Aangezien deze methode toegang biedt tot
persoonlijke- en privacygevoelige informatie, vraagt Facebook de bezoeker om een akkoord, alvorens de webshop te kunnen bezoeken.
2. Facebook Initiated Selling
Bedrijven hebben de mogelijkheid om op Facebook een gratis storefront op te zetten. Een storefront kan het beste worden beschouwd als een etalage van een winkel waarin het productassortiment wordt gepresenteerd. Vervolgens moet de consument de winkel betreden om producten te kunnen betalen. In deze storefronts start het winkelproces binnen Facebook (de etalage) en wordt dit proces afgerond door Facebook te verlaten en naar de website te gaan (in de winkel). Het merk Facebook gaat verloren en het uiterlijk van de webshop voelt volledig anders aan.
3. Complete Selling through Facebook
Complete Selling through Facebook verschilt van Facebook Initiated Selling. In deze methode kunnen consumenten het volledige bestelproces afronden zonder Facebook te verlaten.
4. Facebook Apps
Een Facebook App is een applicatie waarmee een webshop als app kan worden geïntegreerd in Facebook. Om een Facebookshop op te zetten is een Facebook developers account nodig.
Uit de vier verschillende soorten van F-Commerce van Jeff Ente kan geconcludeerd worden dat online handel via Facebook in de praktijk op twee manieren kan worden bedreven (4). F-Commerce kan bestaan uit online handel binnen Facebook, maar ook buiten Facebook door de Social Plugins te integreren.
3.2.2 Conclusie
Wanneer er sprake is van F-Commerce binnen Facebook, wordt de online handel volledig uitgevoerd binnen het platform van Facebook zelf. Hieronder valt het volledige winkelproces.
Wanneer de F-Commerce plaatsvindt buiten Facebook wordt alleen gebruik gemaakt van sociale aspecten van Facebook, zoals de integratie van de ‘Like’ en “Share” button. Andere Social Plugins worden later in dit onderzoek behandeld.
Social Plugins zijn een waardevolle toevoeging aan de gebruikerservaring van de Facebookshop. Door deze plugins worden bezoekers aangezet producten te delen met vrienden binnen hun sociale netwerk. Met de Facebook Open Graph API kan de gebruikerservaring nog persoonlijker worden gemaakt. Facebook’ s Open Graph API maakt het mogelijk om profielgegevens uit te lezen en deze vooraf in het bestelformulier in te vullen. Hiermee kan het bestelproces in de webshop aanzienlijk worden versneld.
3.3 F-Commerce Ecosphere
Zoals eerder beschreven neemt F-Commerce twee verschillende vormen aan, namelijk F-Commerce binnen en buiten Facebook. Deze twee vormen zijn structureel in kaart gebracht aan de hand van de volgende punten in onderstaande afbeelding, ook wel genaamd de F-Commerce Ecosphere (5).
Afbeelding 2. F-Commerce Ecosphere, door Janice Diner.
De F-Commerce ecosfeer van Janice Diner, beschrijft de zes verschillende manieren waarop
transacties via Facebook worden uitgevoerd (5). Aangezien in dit onderzoeksverslag wordt ingegaan op de verkoop van kleurlenzen binnen Facebook, wordt enkel gekeken naar de manieren van F-Commerce binnen Facebook.
• F-Stores
In de bovenste laag in de F-Commerce ecosphere wordt de Facebookshop, oftewel de F-Store, beschreven. Een F-store wordt door Janice Diner gekenmerkt als een Facebook e-commerce store, waarin bezoekers goederen kunnen kopen zonder het platform Facebook te verlaten (5). F-stores kunnen worden aangedreven door Facebook Ads & Sponsored Stories en Facebook Credits. • Facebook Ads & Sponsored Stories
Facebookshops kunnen worden gepromoot door Facebook Ads & Sponsored Stories (6). Tegen betaling is het mogelijk om gericht te adverteren op basis van demografische variabelen van
Facebook-gebruikers. Ondernemers kunnen bijvoorbeeld hun advertenties selectief te tonen op basis van leeftijd, geslacht, maar ook interesses die gebruikers hebben ingevuld in hun Facebook-profiel. Aangezien het overgrote deel van de consumenten van Colorlens vrouwelijk is, kunnen advertenties op het vrouwelijke publiek worden toegespitst. Deze selectieve manier van adverteren zou van extra waarde kunnen zijn bij de promotie van de webshop tijdens Halloween. Kortom, Facebook Ads &
4 Analyse Facebookshop
Dit hoofdstuk start met een overzicht van vier verschillende typen Facebookshops. Vervolgens worden de specifieke kenmerken van een Facebookshop geanalyseerd. In deze analyse worden de
functionaliteiten besproken die kenmerkend zijn voor F-commerce.
4.1 Typen Facebookshops
In 2009 werd de eerste Facebook geïntegreerde webshop geïntroduceerd. Vanaf deze introductie begonnen E-Commerce ondernemingen de waarde van Facebook als verkoopkanaal in te zien. Steeds meer Facebookshops werden ontwikkeld in diverse soorten en maten. Paul Marsden heeft onderzoek gedaan naar deze verschillende typen webshops. Paul is tot de conclusie gekomen dat er drie verschillende typen Facebookshops zijn: de Full Store, Faux Store en de Fan Store (8).
1. Full Store
Kenmerkend voor de Full Store is dat het voor iedereen toegankelijk is. Daarnaast bestaat de Full Store uit alle functionaliteiten die ook worden verwacht bij een normale webshop.
Dit type webshop wordt meestal ingezet door grote merken als een integraal onderdeel van de verkoopstrategie. 8th Bridge is een leverancier van een Full Store webshop-systemen (9). 8th Bridge biedt een webshop-systeem aan tegen maandelijkse betaling. De kosten van dit systeem variëren per abonnementsvorm.
2. Faux Store
Faux Store bestaat alleen uit een productoverzicht op Facebook. Dit betekent dat alleen de producten worden geëtaleerd in Facebook, maar dat het bestelproces wordt voltooid buiten Facebook. Tijdens het betaalproces worden de consumenten doorgesluisd naar een systeem buiten Facebook. Bekende leveranciers van een Faux Store webshop zijn Shop Tab (10) en Bigcommerce (11). Ook deze leveranciers bieden deze systemen aan tegen abonnementsvorm. E-Commerce ondernemingen betalen aan deze bedrijven forse maandelijks bedragen die variëren tussen de 24,95 en 299,95 dollar per maand. De prijs is afhankelijk van het aantal producten dat wordt geëtaleerd in de webshop en het verbruik aan opslagruimte.
3. Fan Store
De Fan Store is geschikt voor bedrijven die aan hun klanten extra diensten willen verlenen. De Fan Store is een gesloten community, toegang wordt alleen verleend aan fans van een
Facebookpagina. Moontoast (12) en Payvment (13) zijn twee bekende leveranciers van systemen, waarmee een Fan Store kan worden opgezet.
4.1.1 Conclusie
In de Full Store worden de bestellingen en transacties binnen Facebook geplaatst en afgehandeld. Dit betekent dat om het bestelproces binnen Facebook af te kunnen handelen, een aparte betaalmodule moet worden geprogrammeerd. Aan Facebook wordt Magento als centraal beheersysteem gekoppeld om de bestellingen en transacties op te slaan en administratief te verwerken.
De Faux Store is een eenvoudigere variant van de Full Store. In de Faux Store wordt het bestelproces buiten Facebook door Magento in een webshop afgehandeld. Doordat het bestelproces door Magento wordt afgehandeld is er geen betaalsysteem vereist. Het is alleen van belang dat de Facebookshop de consument doorsluist naar Colorlens.nl en dat Magento de juiste betaalgegevens ontvangt.
4.2 Specifieke kenmerken van een Facebookshop
Facebookshop is een applicatie van F-commerce die het mogelijk maakt om online handel te kunnen bedrijven binnen Facebook. Kenmerkend voor F-commerce zijn de technieken die de sociale
interactie tussen de webshop en het platform van Facebook mogelijk maken. Deze technieken maken een Facebookshop uniek ten opzichte van een traditionele webshop.
Aangezien dit project is gericht op de ontwikkeling van een Facebookshop is het van belang om te weten wat de specifieke technische kenmerken inhouden en welke relevant zijn voor Colorlens.
Afbeelding 2. F-Commerce: Selling on Facebook, door Paul Marsden.
Paul Marsden heeft een infographic vormgegeven, dat een duidelijk beeld schept in de wijze waarop handel binnen Facebook kan worden bedreven en welke technieken dit ondersteunen (14). Ter verduidelijking heeft Marsden de infographic ingedeeld in twee lagen. De bovenste laag visualiseert de toepassingen waarmee transacties binnen Facebook worden uitgevoerd zoals de Facebookshop. De onderste laag geeft een aantal technieken weer die de bovenste laag aandrijven. Paul Marsden noemt dit Facebook Assisted Commerce, een verzameling van technieken,waarvan F-Commerce gebruik kan maken. Deze technieken maken de sociale interactie tussen de webshop en het platform van Facebook mogelijk. Dit zijn aspecten die het online winkelen nog socialer maken en de
Relevante functies, waarmee Facebook commercie wordt aangemoedigd zijn:
Open Graph API
Met deze techniek kunnen Facebook applicaties worden aangemaakt die kunnen communiceren met het platform Facebook.
Facebook Authenticatie
Het Facebook authenticatie protocol maakt het mogelijk dat gebruikers kunnen inloggen met een Facebook account. Bezoekers die de Facebookshop bezoeken zijn in het bezit van een Facebook account. Het voordeel is dat deze gebruikers zich niet hoeven te registreren alvorens te kunnen inloggen. Als een bezoeker in het bezit is van een account bij Colorlens hoeft niet ingelogd te worden.
Facebook Social Plugins
Door middel van Social Plugins uit Facebook kunnen de sociale functies van Facebook worden toegevoegd aan webshop. Hieronder volgt een opsomming van de Social Plugins van Facebook.
Like button
Met de like button kunnen gebruikers met één op de knop pagina’s en content delen zodat zijn vrienden dit kunnen lezen.
Share button
Biedt dezelfde functionaliteit als de like button, maar geeft gebruikers meer controle over de content die zij delen. Met de share button kunnen gebruikers een persoonlijk bericht toevoegen aan de gedeelde content.
Embedded posts
Maakt het mogelijk om content van een website te integreren in een bericht dat in Facebook wordt gedeeld.
Follow button
Deze knop stelt bezoekers in de gelegenheid om een bepaald bericht/activiteiten rondom een organisatie te volgen.
Comments
Geeft bezoekers de gelegenheid om op een bepaalde activiteit/bericht te kunnen reageren.
Share Dialog
Dit stelt bezoekers in de gelegenheid om vrienden op Facebook uit te nodigen om een bericht te lezen.
Facepile
Geeft de Facebook profielfoto’s weer van mensen die verbonden zijn aan een website. Facepile geeft alleen profielfoto’s weer van mensen die de Facebook pagina in het verleden hebben geliked.
Facebook Graph API
Met de Facebook Graph API wordt toegang verleend tot persoonlijke informatie van een Facebook gebruiker. Toegang kan worden verleend tot onder andere: profielfoto’s, persoonlijke gegevens en de interesses van gebruikers.
Facebook Ads
Met Facebook Ads wordt reclame gemaakt op Facebook door middel van beeldadvertenties en gesponsorde berichten. Colorlens kan dit gebruiken om gericht te adverteren op specifieke doelgroepen.
Facebook Marketing
Facebook Marketing omvat alle activiteiten met betrekking tot reclame maken en het bereik van Colorlens kan vergroten.
4.3 Conclusie
Samenvattend zijn er drie verschillende typen Facebookshops: Full Store, Faux Store en Fan Store. Uit deze drie typen Facebookshops zal een keuze moeten worden gemaakt. Deze keuze wordt gemaakt in een interview met de opdrachtgever en zal gebeuren aan de hand van de wensen van de opdrachtgever.
In een interview met de opdrachtgever worden deze drie opties voorgelegd en wordt er gekeken welke type webshop het beste aansluit bij de onderneming van Colorlens.
Vanuit de specifieke kenmerken van de Facebook webshops kwamen de volgende conclusies naar voren. Het onderscheidende productvoordeel van een Facebookshop is dat het sociale interactie mogelijk maakt met Facebook.
In de infographic van Paul Marsden wordt een duidelijk beeld gegeven van de manier van handel drijven binnen Facebook. Voor dit onderzoek wordt er vooral gericht gekeken naar de mogelijkheden die Facebook Stores ondersteunen. De onderste laag geeft een aantal technieken weer die Facebook Stores aandrijven. De Social Plugins uit de infographic worden toegepast binnen het ontwikkelen van het product in hoofdstuk 8.
5 Gebruikersonderzoek
Voor het gebruikersonderzoek is een stakeholderanalyse ingezet waarin geïdentificeerd wordt welke personen/organisaties direct of indirect invloed uitoefenen op het gewenste eindproduct. Vervolgens worden de rollen en verantwoordelijkheden per stakeholder vastgelegd in de stakeholdermatrix.
5.1 Stakeholderanalyse
Interne stakeholders
Het bedrijf Colorlens.nl telt in totaal maar één werknemer en dat is de opdrachtgever zelf. De enige interne stakeholder in dit project is dus de opdrachtgever.
Externe stakeholders
Binnen dit project zijn er een aantal stakeholders die van buitenaf invloed uitoefenen op de organisatie. Als primair belanghebbende heeft de consument met zijn verwachtingen het grootste belang bij het eindproduct. De leverancier en de bank hebben als secundaire belanghebbenden geen direct belang bij het eindproduct, maar zijn wel van invloed op het eindproduct.
Interface stakeholders
Facebook is een organisatie die met zijn privacygevoelige wet- en regelgeving indirect invloed kan uitoefenen op het gewenste eindproduct.
5.2 Rollen en verantwoordelijkheden
In de stakeholdermatrix hieronder is aangegeven welke stakeholders invloed hebben op het gewenste eindproduct. Per stakeholder staan de rollen en verantwoordelijkheden voor het eindproduct
aangegeven.
Stakeholder Rol Verantwoordelijkheden
Consument De consument bezoekt de webshop, zoekt naar producten en koopt producten. n.v.t.
Opdrachtgever
De opdrachtgever is mede bepalend voor het eindproduct en beslist uit welke
functionaliteiten de Facebookshop bestaat.
De opdrachtgever is
verantwoordelijk voor de inhoud van de webshop, de
productvoorraad en het beheer van bestellingen.
Sisow
Sisow is een betalingsprovider die transacties valideert voordat deze worden verwerkt door de bank.
Sisow is verantwoordelijk voor het correct en veilig afhandelen van transacties.
Bank
De bank verwerkt transacties en zorgt ervoor dat het geld van de consument wordt
overgeboekt naar de rekening van Colorlens.
De bank is verantwoordelijk dat het geld van de consument wordt overgeboekt naar Colorlens.
5.3 Stakeholder interviews
Elke stakeholder heeft zijn eigen set verantwoordelijkheden voor het eindproduct. Om die reden zijn er verschillende vragenlijsten opgesteld en onderzoeksmethoden gehanteerd. Per
stakeholderinterview wordt het doel beschreven en worden de behandelde onderwerpen kenbaar gemaakt.
5.3.1 Opzet onderzoek
Dit onderzoek bestaat uit een diepte-interview, enquêtes en een expert interview. Diepte-interview
De opdrachtgever wordt geïnterviewd door middel van een diepte-interview. In dit interview wordt doorgevraagd naar de achterliggende motivaties en ideeën omtrent de Facebookshop. Aan de hand van de onderzoeksresultaten wordt grotendeels de inhoud van de Facebookshop bepaald. Daarnaast wordt in grote lijnen duidelijk welk type Facebookshop het beste past bij Colorlens. De maximale duur van het diepte-interview wordt geschat op een uur en vindt plaats op het kantoor van de
opdrachtgever.
Consumenten enquêtes
Kwalitatief onderzoek door middel van een diepte-interview kost beduidend meer tijd dan kwantitatief onderzoek. Om die reden is er besloten om consumenten te ondervragen door middel van enquêtes. In de enquêtes wordt het consumentenvertrouwen ten aanzien van het online betalen binnen
Facebook getoetst. De enquêtes nemen hooguit tien minuten in beslag. Om tot vertrouwelijke kwantitatieve onderzoeksresultaten te komen worden de enquêtes verspreid onder zoveel mogelijk testpersonen. Besloten is om de enquêtes te verspreiden over de e-mail en te adresseren aan het klantenbestand van Colorlens. Gestreefd wordt om minimaal 500 personen te enquêteren.
Op basis van de wensen van de opdrachtgever en het consumentenvertrouwen, wordt bepaald welk type Facebookshop het beste past bij dit project. Dit besluit wordt in overleg met opdrachtgever gemaakt.
Expert interview
Aangezien besloten is om de Facebookshop voorlopig te richten op Halloween wordt een expert interview gehouden met een stylist van het Walibi Fright Nights evenement. Halloween Fright Nights vindt jaarlijks plaats en wordt gehouden in het pretpark Walibi. Op dit evenement lopen scare-actors rond, die kleurlenzen gebruiken om pretparkbezoekers de stuipen op het lijft jagen. Stylist Sebastiaan van der Ham is verantwoordelijk voor de selectie aan kleurlenzen. De vragen uit het expert interview zijn gericht op het consumeren en de keuze van kleurlenzen. De duur van het interview betreft maximaal 30 minuten en wordt telefonisch gehouden.
5.3.2 Opdrachtgever
Doel: Het inzichtelijk maken van de verwachtingen van de opdrachtgever. Onderwerpen: 1. Verwachtingen
2. Functionele en niet-functionele behoeften 3. Randvoorwaarden
4. Risicofactoren
De warming-up sessie bleek een eyeopener geweest te zijn voor de rest van het interview. Tijdens de warming-up sessie sprak de opdrachtgever over zijn bedrijf FreshyMedia. Daarbij werd al snel over gestapt naar het idee om het project Colorlens.nl een pioniersrol toe te bedelen, een testcase om aan te tonen waar een webwinkel in de toekomst toe in staat kan zijn. Klanten waarderen het dat
FreshyMedia feedback kan geven vanuit dit oogpunt. De opdrachtgever had in dit kader niet alleen het belang van Colorlens.nl in het vizier, maar zag ook in dat het gewenste eindproduct relevant kan zijn voor zijn onderneming. Dit bleek duidelijk ook uit de uitingen van de opdrachtgever na vragen omtrent zijn verwachtingen bij dit project.
Opsomming met de verwachtingen van de opdrachtgever naar aanleiding van het interview:
Verwachtingen
Meer bestellingen namelijk; vijf á tien bestellingen meer per week.
Succesvolle case van een Facebookshop te kunnen presenteren aan mijn klanten. Naast mijn huidige doelgroep ook een nieuwe doelgroep te kunnen bereiken in Facebook. Meer likes te krijgen waardoor mijn producten vaker worden gedeeld binnen Facebook.
Uit het interview kwamen de volgende functionele en non-functionele behoeften van de opdrachtgever naar voren.
Functionele behoeften
In Magento de producten in de Facebookshop beheren.
In Magento de productcategorieën in de Facebookshop beheren. Integratie van het betalingssysteem Sisow in de Facebookshop. Integratie van de like-button bij alle producten in de Facebookshop. Integratie van de share-button bij alle producten in de Facebookshop.
Niet-functionele behoeften
Klanten moeten toegang hebben tot een gebruiksaanwijzing. Klanten moeten weten dat ik een snelle levertijd hanteer.
Klanten moeten weten dat de verzending van de producten kosteloos is. Het bestelproces moest simpel zijn en weinig tijd kosten.
Vanuit de functionele en non-functionele behoeften en verwachtingen van de opdrachtgever kwamen de volgende risicofactoren ter sprake:
Risicofactoren volgens opdrachtgever
Lekken in de beveiliging van de Facebookshop.
Bugs in de koppeling met Magento waardoor bestellingen niet worden ontvangen.
5.3.3 Consumenten
Doel: Het inzichtelijk maken van de verwachtingen en voorkeuren van de consument. Onderwerpen: 1. Verwachtingen
2. Functionele en niet-functionele behoeften 3. Randvoorwaarden
4. Risicofactoren
Voor het creëren van inzicht in het gebruik van de consument zijn enquêtes ingevuld door
verschillende webshop-gebruikers. Er is gekozen voor de onderzoeksmethode enquête vanwege het voordeel van een snelle dataverzameling in een korte periode. De enquête is onderverdeeld in meerkeuzevragen en openvragen. Bovendien kreeg elke consument de gelegenheid om ook zijn/haar persoonlijke mening te verkondigen.
In een tijdsbestek van twee weken zijn de volgende gegevens verzameld vanuit de consumenten: • Verwachtingen
• Functionele en niet-functionele behoeften • Randvoorwaarden
• Risicofactoren
De bovenstaande onderwerpen worden ingevuld aan de hand van gestelde vragen tijdens de enquête. De resultaten van de meerkeuzevragen zijn weergegeven in de vorm van diagrammen om een
overzicht te creëren van de uitkomsten. Daarnaast is een vergelijking gemaakt tussen de ingevulde open vragen. Deze beschrijvingen vindt u achter de meerkeuzevragen. Zie bijlage 7.
5.3.4 Conclusie consumentenenquêtes
Van de 500 uitgezonden enquêtes zijn 20 enquêtes daadwerkelijk beantwoord. De volgende gegevens zijn hierop gebaseerd.
De consument geeft aan dat de Facebookwebshop moet voldoen aan de volgende voorwaarden: • duidelijk informatie overzicht gaande het gebruik van lenzen
• uitgebreid assortiment • fotomateriaal
• categorieën
• betalingsmogelijkheden (iDeal en acceptgiro) • snelle levering
Uit de cirkeldiagram ‘Gebruik Facebook webshop’ die u kunt terugvinden in bijlage 7, valt op dat een groot deel van de consumenten wel eens iets aanschaft via een Facebookshop. In principe kan men dit zien als een positief signaal voor Colorlens. In beginsel zou het voor Colorlens mogelijk zijn om met een Facebookshop een grotere doelgroep te bereiken, mits voldaan aan bovenstaande genoemde voorwaarden.
Vanuit de vraag waar een Facebook webshop volgens de consument aan zou moeten voldoen kwam naar voren dat veiligheid en vertrouwen in de webshop belangrijke aandachtspunten zijn. Ook dit gegeven moet worden meegenomen in het ontwerp van het product.
Genoemde punten verschillen weinig van de voorkeuren voor een gewone webshop. Het voordeel via Facebook is volgens de consument dat op Facebook een grotere publiek kan worden bereikt. Zowel jongeren als ouderen. Ook is het bereik van Facebook wereldwijd, waardoor er meer mensen op de hoogte zijn van het bestaan van Colorlens. Vanwege dit bereik geeft de meerderheid van de
consumenten aan dat meertaligheid op Facebook ook van belang kan zijn voor de ontwikkelingen van het bedrijf. Engels zou dan een voertaal voor de webshop moeten worden of met een doorverwijzing naar de site waar meer talen worden aangeboden.
Uit de enquêtes is gebleken dat consumenten het vertrouwen hebben om betalingen te doen binnen Facebook. Dit betekent voor Colorlens dat de Full Store een mogelijke optie is. Attentiepunten zullen dus binnen het ontwerp zijn het betaalsysteem, het vermelden van een snelle levertijd en het
categoriseren van producten.
5.3.5 Conclusie expert interview
Het expert interview heeft slechts een en ander bevestigd, en weinig toegevoegd aan dit onderzoek. De expert die benaderd is voor dit onderzoek is de ontwikkelaar van Walibi Fright Nights. De expert gaat over de aanschaf van kleding en accessoires voor de verschillende stukken. De expert bleef erg kort in de antwoorden en gaf aan al jaren bij een ander bedrijf te bestellen. Hij was niet geïnteresseerd in de ontwikkelingen van Colorlens, maar was wel benieuwd naar de ontwikkelingen van dit onderzoek. De expert gaf aan dat de website duidelijk was, maar dat dit voor hun keuze niet van belang is. Zij kiezen de kleurlenzen voor de Halloween feesten uit op de rollen die zij hebben bedacht en de daarbij passende kleur. Omdat zij al jaren gebruik maakten van het zelfde bedrijf die alle mogelijkheden aanbiedt, zouden zij hier niet snel van afwijken.
6 Systeemanalyse
In de systeemanalyse worden de behoeften van de belanghebbenden geanalyseerd en uitgewerkt tot systeemeisen. Systeemeisen zijn van cruciaal belang aangezien deze bepalend zijn voor de kwaliteit van het eindproduct. Recent onderzoek van Colin Kennedy wijst uit dat goed beschreven
systeemeisen het verschil kunnen maken tussen een geslaagd of mislukt project (16). Ruim 24% van de gefaalde projecten zijn gestrand door incompetente systeemeisen. Systeemeisen zijn incompetent wanneer deze incompleet zijn of niet zijn bijgewerkt nadat deze zijn gewijzigd. Om te zorgen voor kwalitatieve systeemeisen voor dit project zijn deze opgedeeld in: functionele eisen, niet-functionele eisen en interface eisen.
6.1 Functionele eisen
John Reekie beschouwt functionele eisen als een expressie van de opdrachten wat een systeem moet uitvoeren (17). Deze eisen worden gevormd aan de hand van de behoeften van de stakeholders. Deze behoeften zijn eerder in dit hoofdstuk vastgelegd en zijn terug te vinden in het
gebruikersonderzoek. Samen met de opdrachtgever zijn deze behoeften geanalyseerd en zijn de functionele eisen gesteld aan de Facebookshop:
• Gebruikers kunnen inloggen met hun Facebook account. • Bestelproces is eenvoudig en kost weinig tijd.
• Na het bestelproces ontvangt de bezoeker een email met een bevestiging. • Productoverzicht wordt op een overzichtelijke wijze getoond.
• Gebruikers kunnen producten filteren op categorie. • Per pagina worden maximaal zes producten getoond.
• Betalingen worden uitgevoerd binnen Facebook en opgeslagen in Magento. • Informatieve pagina’s in Magento zijn te benaderen vanuit de Facebook.
Hieronder volgt herhaling van de eisen beschreven in de doelstelling. Deze eisen zijn gericht op de koppeling tussen de Facebookshop en Magento. Deze eisen zijn een expressie van de behoeften van de opdrachtgever.
Functionele eisen van Colorlens met betrekking tot de koppeling:
• De productvoorraad wordt op één locatie in het Magento beheerd. • De financiën worden op één locatie in het Magento beheerd. • De transacties worden op één locatie in het Magento beheerd. • De Facebookshop bestellingen worden opgeslagen in het Magento. • Het productassortiment van de Facebookshop wordt beheerd in Magento.
6.2 Niet-functionele eisen
Besloten is om de niet-functionele eisen op te stellen aan de FURPS-methodiek van McCall. FURPS is een pakket met softwarekwaliteitseisen, waaronder: functionality, usability, reliability, performance en supportability (18).
In dit project zijn betrouwbaarheid (reliability), snelheid (performance) en de veiligheid (reliability) van belang. Uit het gebruikersonderzoek is gebleken dat betrouwbaarheid een belangrijke factor is voordat de gebruiker iets aanschaft. Verder is de snelheid waarmee de Facebookshop communiceert met Magento belangrijk voor de gebruikerservaring. Hoe langer de laadtijden van de webshop duren, hoe groter de kans dat de klant afhaakt. De opdrachtgever zelf heeft beklemtoont dat hij veel waarde hecht aan veiligheid. Onder deze noemer valt volgens de opdrachtgever het risico dat bestellingen uit de Facebookshop niet goed worden ontvangen in Magento.
6.3 Interface eisen
Interface eisen geven een indruk hoe de Facebookshop eruit komt te zien. Aangezien dit project hoofdzakelijk gericht is op de techniek worden alleen basiseisen van de interface beschreven. Bepaalde interface eisen:
• Links bovenin is het logo van Colorlens ten allen tijde aanwezig. • Paginabreedte is maximaal 810 pixels breed.
• Paginabreedte heeft een marge aan beide zijkanten.
• Interface bevat een breadcrumb zodat de bezoeker weet waar hij zich bevindt.
Het is van belang dat de webshop wordt ervaren als een integraal onderdeel van Facebook. Daarom is het belangrijk dat het uiterlijk van de webshop een eenheid vormt met de huisstijl van Facebook. Mogelijk vergroot dit de betrouwbaarheid van de webshop.
Om een eenheid te vormen met Facebook zijn de consistentie eisen vastgelegd: • Puntgrootte van paragraaf teksten zijn maximaal 11 pixels groot.
• Lettertype is bepaald op Lucida Grande.
• Formulieren, knoppen, tabellen en navigatie zijn geïnspireerd door Facebook.
6.4 Deelproducten
De Agile ontwikkelmethodiek is ingericht om iteratief te ontwikkelen. Dit houdt in dat het mogelijk is een project op te delen in deelproducten en deze afzonderlijk van elkaar op te leveren. Per oplevering van een deelproduct wordt de opdrachtgever de mogelijkheid geboden om feedback te leveren. De verkregen feedback kan tijdens de ontwikkeling van het eerstvolgende deelproduct direct worden toegepast. Deze manier van werken heeft als voordeel dat de opdrachtgever nauw betrokken raakt bij het project.
In overleg met de opdrachtgever zijn de volgende deelproducten bepaald die worden ontwikkeld in deze volgorde: 1. Storefront 2. Productdetailpagina 3. Winkelwagen 4. Betaalmodule
6.5 Systeemeisen
6.5.1 Programmeertaal
In dit project wordt de programmeertaal PHP gebruikt waarmee de Facebookshop wordt ontwikkeld. Op grond van ruime ervaring met deze programmeertaal is gekozen voor PHP.
6.5.2 Web hosting
Om te kunnen testen of bestellingen daadwerkelijk worden ontvangen in Magento wordt een testomgeving opgezet. Op deze testomgeving wordt een kopie bewaard van de broncode en de database van de webshop van Colorlens. Deze bestanden worden geüpload op een eigen webserver. Vanwege veiligheidsmaatregelen is deze webserver tijdens de ontwikkelingsfase niet openbaar toegankelijk. Meer informatie over het opzetten van de testomgeving wordt gegeven in hoofdstuk 8: eindproduct.
6.6 Randvoorwaarden
Het is de wens van de opdrachtgever om in de toekomst meerdere Facebookshops op te zetten. Op voorhand is de opdrachtgever geïnformeerd aangaande het niet haalbaar zijn, gezien het tijdsbestek van dit project. Wel kunnen maatregelen worden genomen door het systeem dusdanig generiek op te zetten. Ongetwijfeld zal in de toekomst deze wens van de opdrachtgever blijven bestaan, in ieder geval is het systeem in grote lijnen hierop voorbereid. Vanwege de verscheidenheid in de
functionaliteiten van webshops en de verschillende wensen van ondernemers is een modulaire aanpak vereist. Het modulair opzetten van het systeem, maakt het mogelijk om modules te kunnen (de)activeren op basis van de webshop en de wensen van haar ondernemer.
6.7 Use-cases
Nadat de functionele eisen zijn vastgelegd en de deelproducten zijn bepaald worden de use-cases gemodelleerd. Use-cases bieden een gedetailleerdere beschrijving van de deelproducten. Aan de hand van de use-cases zijn de use-case diagrammen gemaakt. Deze diagrammen bepalen de functionaliteiten van elk deelproduct.
Naam Use-case 1: Storefront
Samenvatting Consument navigeert door het productaanbod.
Actoren Consument (gebruiker)
Pre condities Producten zijn toegevoegd aan de Facebookshop door de opdrachtgever
Scenario’s 1. Consument klikt op een productcategorie.
2. Systeem toont producten uit de gekozen categorie
3. Consument navigeert door producten en klikt op volgende pagina. 4. Systeem toont de volgende zes producten.
5. Consument besluit product te bestellen en klikt op de knop bestellen.
Uitzonderingen Systeem geeft melding wanneer een categorie geen producten bevat.
Naam Use-case 2: Winkelwagen
Samenvatting Consument maakt gebruik van de mogelijke opties dat een winkelwagen te bieden heeft.
Actoren Consument (gebruiker)
Pre condities Deze use case gaat verder waar use-case 1 is geëindigd, namelijk bij het klikken op de ‘bestellen’ knop.
Scenario’s 1. Systeem heeft product toegevoegd aan winkelwagen. 2. Gebruiker leegt winkelwagen.
3. Systeem toont bericht dat de winkelwagen geen producten bevat en verbergt de ‘afrekenen’ knop.
4. Gebruiker voegt product opnieuw een product toe aan winkelwagen. 5. Systeem heeft product toegevoegd aan winkelwagen.
6. Gebruiker besluit twee keer hetzelfde product toe te voegen aan winkelwagen.
7. Systeem toont twee keer hetzelfde product in winkelwagen. 8. Gebruiker wijzigt het aantal van het product naar 1 en klikt op
‘winkelwagen bijwerken’.
9. Systeem wijzigt het aantal dezelfde producten in 1.
Uitzonderingen Systeem geeft melding wanneer de winkelwagen geen producten bevat.
Naam Use-case 3: Bestellingen
Samenvatting Consument heeft in totaal één product aan de winkelwagen toegevoegd en besluit het product te bestellen en af te rekenen.
Actoren Consument, Sisow, Bank
Pre condities Deze use-case gaat verder waar use-case 2 is geëindigd, namelijk bij het tonen van het winkelwagentje.
Scenario’s 1. Gebruiker klikt op ‘afrekenen’. 2. Systeem toont bestelscherm. 3. Gebruiker vult adresgegevens in. 4. Gebruiker kiest een betaalmethode. 5. Gebruiker klikt op ‘betalen’.
6. Systeem valideert formulier.
7. Systeem plaatst bestelling in Magento. 8. Systeem vraagt de transactie aan bij Sisow. 9. Sisow valideert de transactie.
10. Systeem stuurt de gebruiker door naar de bank.
11. Bank verwerkt transactie en boekt transactie over naar Colorlens. 12. Sisow meldt dat de transactie is voltooid.
13. Systeem stuurt een bevestiging van de bestellen per email op naar de consument.
14. Systeem toont scherm met een bevestiging van de bestelling.
Uitzonderingen • Systeem toont een melding wanneer een verplicht veld in het bestelformulier niet is ingevuld.
• Systeem toont een melding wanneer een de inhoud van een veld in het bestelformulier niet overeenkomt met het verwachte datatype.
Voorbeeld: het telefoonnummer mag alleen cijfers en ’-’ bevatten. • Systeem toont een pagina op basis van de uitkomst van de transactie.
Mogelijke uitkomsten zijn dat de gebruiker een transactie heeft geannuleerd, de sessie is verlopen of mislukt is.
7 Koppelingstechnieken
Dit hoofdstuk behandelt de verschillende technieken waarmee een koppeling kan worden gelegd tussen de Facebook- en Magento webshop. Allereerst moet een keuze gemaakt worden voor een koppelingstechniek die het beste past in dit project. Deze keuze wordt gemaakt op basis van de kwaliteitseisen die vooraf worden opgesteld aan de koppelingsmethode. Alvorens deze
koppelingstechnieken te behandelen, is het van belang om inzicht te krijgen in de wijze waarop beide systemen met elkaar communiceren.
UML-schema; weergave van de koppeling tussen de Facebookshop en Magento.
Bovenstaand UML-schema toont de wijze aan waarop de Facebookshop met Magento communiceert. De pijlen in dit schema geven de communicatierichting aan waarin de gegevens worden uitgewisseld. Deze vorm van datacommunicatie is eenzijdig. Dit betekent dat het onmogelijk is dat beide systeem tegelijkertijd met elkaar communiceren.
Datacommunicatie bestaat uit een client en een webservice. Beide communicanten hebben een specifieke functie in de koppeling. Opdrachten worden aangevraagd door de client en worden uitgevoerd door webservice. Binnen dit project is de Facebookshop de client en is Magento de webservice.
7.1 Webservice
Webservice is een systeem dat een dienst aanbied op het internet. Clients kunnen deze webservice benaderen om gebruik te maken van de functionaliteit van dit systeem. Voor het benaderen van de webservice is een koppelingstechniek nodig, oftewel een communicatieprotocol.
Magento Magento Facebookshop Request Facebookshop Response MySQL database Request Response Consument Leverancier
7.2 Bepalen koppelingsprotocol
Magento ondersteunt twee koppelingsprotocollen, namelijk: SOAP en XML-RPC (19). Beide protocollen maken gebruik van de eXtensible Markup Language (XML), een formaat waarmee de structuur van de gegevensoverdracht wordt bepaald.
Bij het bepalen van het koppelingsprotocol is rekening gehouden met de eerder vastgelegde
kwaliteitseisen. Deze kwaliteitseisen zijn gericht op de snelheid en betrouwbaarheid waarin gegevens worden uitgewisseld met Magento. Onderzoek van Arun Gandhi wijst uit, dat XML-RPC zowel in snelheid als in betrouwbaarheid een betere optie is dan SOAP (20). Ondanks dat XML-RPC een betere optie is, is er toch besloten om SOAP te gebruiken. De reden van dit besluit is dat Magento van SOAP een standaard heeft gemaakt. Daarnaast is ook de documentatie over het gebruik van SOAP uitgebreider dan die van XML-RPC en met SOAP meer resultaat kan worden bereikt.
7.3 Simple Object Access Protocol
SOAP staat voor Simple Object Access Protocol. SOAP maakt het mogelijk dat verschillende applicaties, ongeacht de technologische afkomst, gegevens kunnen uitwisselen. De uitwisseling van gegevens gebeurt aan de hand van XML-bestanden. In deze bestanden worden gegevens verpakt en verzonden naar de client. SOAP bepaalt niet hoe deze gegevens worden getransporteerd, maar specificeert hoe de getransporteerde gegevens eruit komen te zien.
Aan de hand van de definitie van het W3C kan verduidelijkt worden hoe SOAP werkt: "SOAP is a lightweight protocol for exchange of information in a decentralized, distributed environment. It is an XML based protocol that consists of three parts: an envelope that defines a framework for describing what is in a message and how to process it, a set of encoding rules for expressing instances of application-defined datatypes, and a convention for representing remote procedure calls and responses." (21)
Uit bovenstaande definitie valt af te leiden dat SOAP-berichten zijn opgedeeld in drie onderdelen, namelijk:
1. een envelop,
2. een verzameling van coderingsregels en een
3. conventie voor het representeren van de remote procedure calls.
1. SOAP envelop
SOAP-berichten worden verstuurd in XML-bestanden. Een SOAP-bericht bestaat uit een envelop met daarin een header- en body element, zoals weergeven in de afbeelding hiernaast.
Het doel van de header is het aanleveren van contextuele informatie over de verwerking van een SOAP-bericht. Te denken valt aan
authenticatiegegevens, waarmee kan worden geverifieerd of een bepaald systeem gegevens mag aanvragen. Of een respons waarin het pad staat vermeldt dat de Facebookshop moet doorlopen om een bestelling te kunnen plaatsen in Magento.
Het body-element bevat de daadwerkelijke inhoud van het bericht dat moet worden verwerkt door een systeem. Uit het body-element kan de Facebookshop bijvoorbeeld opgemaakt worden welke
2. Coderingsregels
Coderingregels definiëren de data types die worden gebruikt in het XML-bestand. SOAP heeft geen standaard met coderingsregels. Coderingregels worden vastgelegd door de partijen van de systemen die met elkaar communiceren. Aan elk element in een XML-bestand kunnen deze regels worden toegekend.
3. Remote procedure calls
Het laatste onderdeel van het SOAP-bericht is de conventie voor het representeren van de remote procedure calls. Deze representatie wordt vastgelegd in de vorm van een WSDL-bestand. Dit bestand beschrijft de wijze waarop een client specifieke gegevens kan ophalen van de webservice. Elke procedure call heeft een eigen naam waarmee deze kan worden aangeroepen. Daarnaast wordt per procedure call aangegeven welke gegevens worden geretourneerd door de webservice. Het
voorbeeld hieronder geeft een procedure call weer voor het ophalen van productgegevens.
<complexType name="catalogProductEntity"> <all>
<element name="product_id" type="xsd:string"/> <element name="sku" type="xsd:string"/> <element name="name" type="xsd:string"/> <element name="set" type="xsd:string"/> <element name="type" type="xsd:string"/>
<element name="category_ids" type="typens:ArrayOfString"/> <element name="website_ids" type="typens:ArrayOfString"/> </all>
</complexType>
Bovenstaande aanvraag heeft de naam catalogProduct en kan door de client worden aangeroepen. De webservice retourneert vervolgens een aantal elementen over een bepaald product. Bij elk
element is een datatype gedefinieerd. Dit zijn de coderingsregels die zijn gespecificeerd door Magento. Bovenstaand voorbeeld geeft aan dat deze procedure call onder andere een ID, een naam en het producttype retourneert. Alle mogelijke procedure calls zijn door Magento gedocumenteerd. Uit deze documentatie valt eenvoudige af te leiden welke procedure calls beschikbaar zijn en wat de verwachte responses hiervan zijn.
8 Eindproduct
In dit hoofdstuk worden alle doorgelopen processen en gemaakte beslissingen tijdens de ontwikkelfase beschreven. Het ontwikkelproces wordt verantwoord aan de hand van de vooraf bepaalde deelproducten. Elk product wordt pas opgeleverd, wanneer de opdrachtgever feedback heeft gegeven en heeft ingestemd met het eindresultaat.
8.1 Ontwerp
Aangezien dit project is gericht op de techniek wordt op het ontwerp van de webshop niet diep ingegaan. Om tegemoet te komen aan de interface eisen die zijn gesteld aan dit project zijn er wireframes vormgegeven. Deze wireframes kunt u achterin dit document terug vinden in bijlage 9. Onder het kopje interface eisen zijn ook consistentie eisen vastgelegd waaraan het ontwerp moet voldoen. Deze eisen zijn gericht op het ontwerp van Facebook.
8.2 Opzetten testomgeving
Om te kunnen ontwikkelen is een op een webserver een testomgeving opgezet. Hiervoor is een eigen webserver gebruikt. De eigen webserver is gekozen omdat er op deze manier geëxperimenteerd kon worden met de werking van Magento. Kunnen de producten worden opgehaald en de bestellingen worden geplaatst? Door gebruik te maken van de eigen webserver kan dit geen gevolgen hebben voor de reeds bestaande webshop. De bestanden van Colorlens zijn gekopieerd vanuit de Magento webshop en geüpload op de eigen webserver. Om dit te kunnen doen is er toestemming nodig van de opdrachtgever. De opdrachtgever ging hier mee akkoord en heeft de bestanden aangeleverd.
8.3 Facebook applicatie opzetten
Om een webshop te integreren binnen Facebook, moest er een Facebook applicatie worden aangemaakt. Facebook heeft hiervoor een website ingericht, waar ontwikkelaars hun app kunnen configureren (22). Om toegang te krijgen tot deze website dient de gebruiker zich te registreren als Facebook developer. Eenmaal geregistreerd, kan de Facebook applicatie worden aangemaakt. Tijdens het opzetten vraagt Facebook naar een naam en een naamruimte voor de app. Aan de hand van de naam kan de webshop worden gevonden wanneer een Facebook-gebruiker hier naar zoekt. Aangezien een Facebookshop wordt ontwikkeld gericht op Halloween heeft de app, de naam
‘Halloween kleurlenzen’ gekregen. De naamruimte van de app is de parameter in de URL waarmee de Facebookshop kan worden bezocht. Door het invullen van de naamruimte kan de app worden bezocht via: http://apps.facebook.com/halloweenlenzen.
8.4 Facebook applicatie configureren
Na het opzetten kan de Facebook applicatie worden geconfigureerd. De eerste stap in dit configuratieproces is het configureren van de canvas URL. De URL is een verwijzing naar de omgeving waar de Facebookshop is gehost. Naast de Canvas-URL moet ook een Secure Canvas URL moet worden ingevuld. Sinds 1 oktober 2011 is het verplicht om de Facebook applicatie te hosten op een server met een SSL certificaat. SSL is een afkorting voor Secure Socket Layer (23). Dit protocol zorgt ervoor dat alle gegevens tussen de browser en de webserver worden versleuteld en daardoor niet toegankelijk zijn voor anderen. Aangezien de webserver van Colorlens een SSL-beveiligd is wordt de Facebookshop daar gehost.
Voordat de producten en categorieën kunnen worden getoond in de webshop moeten deze gegevens worden opgehaald uit Magento. Aangezien de opdrachtgever een selectie wil kunnen maken uit het productassortiment van zijn huidige webshop, gaat de aandacht nu uit naar de koppeling met Magento. In het systeem van Magento kunnen meerdere webshops worden opgezet. Door een nieuwe webshop op te zetten binnen Magento heeft ook de nieuwe Facebookshop toegang tot het bestaande
productassortiment. Hierdoor kan er een selectie worden gemaakt uit dezelfde producten en kunnen deze producten worden toegekend aan de Facebookshop.
Nadat de Facebookshop is opgezet in Magento moeten er producten en productcategorieën worden aangemaakt die betrekking hebben tot Halloween. De producten zijn vervolgens geselecteerd die betrekking hebben tot Halloween en zijn hierna toegevoegd aan de Facebookshop. Ditzelfde is gedaan voor alle verschillende productcategorieën.
Vervolgens is er een koppeling geprogrammeerd, waarmee de producten en categorieën uit Magento worden opgehaald. Deze is geprogrammeerd via het SOAP-protocol, beschreven in hoofdstuk 7. Uit deze ontwikkeling bleek dat het ophalen van deze producten en categorieën soms wel zes seconden kan duren. Aangezien in de systeemeisen is bepaald dat de snelheid een belangrijke factor is, moest deze koppeling worden versneld.
Vanuit deze conclusie is het besluit genomen om een synchronisatiemodule te ontwikkelen. Met deze module worden alle producten en gegevens in één keer opgehaald uit Magento.
Hierdoor kan de koppeling aanzienlijk worden versneld. Voor het verantwoorden van de ontwikkeling van de synchronisatiemodule is er een deelproduct toegevoegd.
8.6 Deelproduct 2: Synchronisatiemodule
Om de snelheid van de koppeling te versnellen is besloten om een synchronisatiemodule te
ontwikkelen. In deze module worden alle benodigde gegevens uit Magento opgehaald en opgeslagen in de database. De eerste stap in het proces was het bepalen van de inhoud van de webshop. Voor het vastleggen van deze inhoud is een Entiteit Relatie Diagram (ERD) gemaakt. Het ERD is
toegevoegd aan bijlage 9. Op basis van dit ERD is er onderzoek verricht naar de remote procedure calls, waarmee de data kan worden opgehaald. Vervolgens zijn de calls geïmplementeerd en zijn de resultaten uit deze SOAP-calls opgeslagen in de database. Aangezien deze synchronisatiemodule alleen uit te voeren is door de opdrachtgever is er een backend-systeem ontwikkeld. In dit systeem moet de opdrachtgever eerst inloggen voordat de Facebookshop kan worden gesynchroniseerd met Magento.
