Project Initiation Document Afstudeerstage Wouter Janssen

2/12 Project Initiation Document Afstudeerstage Wouter Janssen Opdrachtnemer: Websdesign Internet Communicatie, Wouter Janssen Opdrachtgever: Websdesign Internet Communicatie Website: http://wouterstudeertaf.blogspot.com/ Versiebeheer Datum Versie Auteur Wijzigingen 25-01-12 1.0 Wouter Janssen Initieel document 08-03-12 2.0 Wouter Janssen Doorvoeren afspraken met stagedocent 19-03-12 2.1 Wouter Janssen Doorvoeren wijzigingen stagebegeleider 19-03-12 2.2 Wouter Janssen Gedetailleerde uitwerking onderzoek Eindhoven, donderdag 22 maart 2012 Websdesign Internet Communicatie Oude stadsgracht 1 5611 DD Eindhoven T 040 23 24 611 www.websdesign.nl Websdesign Internet Communicatie 2012

3/12 Inhoudsopgave 1. Inleiding...4 1.1 Doel van dit document...4 1.2 Aanleiding...4 1.3 Globale kosten en doorlooptijd...4 2. Achtergrond... 5 2.1 Probleemstelling... 5 2.2 Opdracht...5 2.3 Over Websdesign internet communicatie... 5 3. Projectdefinitie...6 3.1 Projectdoelstellingen...6 3.2 Gekozen oplossing of aanpak... 6 3.3 Onderzoeksfase... 6 3.4 Vooronderzoek... 7 3.5 Het Onderzoek...7 3.6 Ontwikkelfase... 10 3.7 Bronnen... 10 3.8 Producten cq. Eindresultaat... 10 Bijlage A: Planning... 11 Bijlage B: Communicatie...12

4/12 1 Inleiding 1.1 Doel van dit document Dit document is opgesteld om alle relevante basisinformatie en uitgangspunten van het project vast te leggen om het op de juiste wijze te kunnen besturen. Het heeft tot doel het project te definie ren, als basis te dienen voor het management ervan en de beoordeling van het succes van het project mogelijk te maken. Dit Projectinitiatiedocument (of PID) behandelt de volgende fundamentele aspecten van het project: Wat beoogt men met het project te bereiken? Waarom is het belangrijk om deze doelstellingen te bereiken? Hoe en wanneer zullen de maatregelen die in dit PID besproken worden gerealiseerd worden? Het document wordt gebruikt: Om er zeker van te zijn dat het project een gezonde basis heeft voordat de Stuurgroep gevraagd wordt zich aan het project te committeren; Om te dienen als basisdocument op grond waarvan de Stuurgroep en de Projectmanager de voortgang en wijzigingen kunnen toetsen en bewaken en vragen omtrent geldigheid van het project tijdens de uitvoering ervan kunnen beoordelen. 1.2 Aanleiding Het laatste jaar van de opleiding HBO-ICT te Fontys Eindhoven staat geheel in het teken van afstuderen. Uiteraard hoort daar een stage bij, welke in dit geval gehouden wordt bij Websdesign Internet Communicatie. Bij deze stage hoort een afstudeeropdracht en om te zorgen dat het project in goede banen loopt wordt dit document opgesteld. 1.3 Globale kosten en doorlooptijd De enige kosten die aan dit project verbonden zijn, is het maandelijkse loon van de stagiair. Het project is gestart op Maandag 13 februari en zal 17 weken lopen. Een gedetailleerde planning is opgenomen in bijlage A.

5/12 2 Achtergrond 2.1 Probleemstelling Het internet en het gebruik hiervan verschuift steeds meer van enkel desktop ervaring naar een medium dat beschikbaar is op vele verschillende platformen. Als logisch gevolg hiervan willen ook de klanten meer inspelen op deze ontwikkeling, waardoor Websdesign in zijn werkwijze mee zal moeten groeien met deze behoefte. De bezoeker moet dus zelf kunnen bepalen via welke apparaten hij de web applicatie gebruikt. Hierdoor wordt het bereik van web applicaties vele male groter en ook de functionaliteit kan en moet breder. Het probleem wat Websdesign ondervindt is dat er naast de huidige verschillende browsers er nu ook rekening gehouden moet worden met verschillende scherm resoluties en beschikbare functionaliteiten op de diverse apparaten. Om elk project hier apart voor in te richten is tijd rovend werk en brengt veel risico factoren met zich mee. Daarnaast is de kennis binnen het bedrijf op dit moment niet toereikend genoeg om een dergelijke nieuwe werkwijze efficie nt op te nemen in hun huidige werkproces. 2.2 Opdracht Om de klant hoge kwaliteit producten te kunnen blijven bieden en toch in te spelen op de huidige marktontwikkelingen moet er een advies gegeven worden waarmee het huidige werkproces van Websdesign aangepast kan worden naar de nieuwste ontwikkelingen. Dit advies moet de fout gevoeligheid en het tijdrovende van steeds opnieuw integreren wegnemen en het product verrijken met nieuwe functionaliteiten op de verschillende platvormen. In het onderzoek moeten de nieuwe basis elementen/programmeertalen (als bijvoorbeeld HTML5 en CSS3) met elkaar vergeleken worden en er moet onderzocht worden wat er nodig is om te voldoen aan de wensen binnen het bedrijf. Hierbij moeten factoren als backwards compatibiliteit, simpele integratie in het eind product, gebruiksvriendelijkheid en verbetering van het interne werk proces in acht worden genomen. Na het onderzoek en het daaruit gekomen adviesrapport zal er een ICT-Product ontwikkeld moeten worden welke aansluit op het onderzoek. Belangrijk hierbij is dat binnen de realisatie wordt voldaan aan de reeds bestaande standaarden die gelden binnen het development en design team van Websdesign. 2.3 Over Websdesign internet communicatie Websdesign is een fullservice internetbureau gevestigd in Eindhoven en Venray. Sinds 1998 bedenken, bouwen en beheren wij, met een team van 12 gepassioneerde professionals, online oplossingen voor toonaangevende merken en organisaties die bijdragen aan het behalen van marketingdoelstellingen. Dit noemen wij het realiseren van zichtbaar effect.

6/12 3 Projectdefinitie 3.1 Projectdoelstellingen De hoofddoelstelling van dit project is dat Websdesign een advies krijgt over hoe om te gaan met de nieuwe ontwikkelingen op de markt met behoud van kwaliteit van het eindproduct. Daarnaast zal er een product ontwikkeld worden waarin dit advies verwerkt wordt. Nieuwe technieken gaan het mogelijk maken om een website er op meerdere platforms goed uit te laten komen. Tot nu toe is hier nog geen standaard manier van werken voor binnen Websdesign. Hier moet dus een oplossing voor komen, op zo n manier dat de kwaliteit wel gewaarborgd blijft. Na het onderzoek zal er een voorstel komen waarin een combinatie van tools en technieken zal worden voorgesteld en een manier waarop deze te gebruiken zijn binnen het huidige werkproces van Websdesign. 3.2 Gekozen oplossing of aanpak Tijdens het project wordt er onderzoek gedaan naar de technieken die zich nu ontwikkelen en wenselijk zijn voor Websdesign. Er zal gekeken worden naar welke technieken belangrijk zijn bij de moderne manier van front-end development en daarnaast zal onderzocht worden welke tools en of library s het werk daarbij kunnen vereenvoudigen. De belangrijkste vraag voor het onderzoek (en daarmee de onderzoeksvraag) is:,,op welke manier kan Websdesign op het gebied van front-end development en interactie inspelen op snelle ontwikkelingen van de markt zonder kwaliteitsverlies van het eindproduct en verhoging van de doorlooptijd?. Wanneer dit onderzoek afgerond is wordt er een advies gebracht over hoe Websdesign om kan gaan met de nieuwe technieken. Bij dit advies hoort een plan met richtlijnen. Wanneer de werknemers binnen Websdesign tevreden zijn over dit plan zal er een product ontwikkeld worden aan de hand van het plan. Hoe en wat dit product zal gaan worden wordt pas duidelijk na afronding van het onderzoek. 3.3 Onderzoeksfase De onderzoeksfase draait vanzelfsprekend om de onderzoeksvraag. Belangrijk is dat inzichtelijk wordt gemaakt wat de nieuwe technieken en tools zijn, welke van deze technieken interessant zijn voor Websdesign en hoe deze toegepast kunnen worden. Het onderzoek hierbij zal vooral bestaan uit deskresearch en interviews met enkele werknemers binnen Websdesign die lichte ervaring hebben met de nieuwe technieken of daar al (klein) onderzoek naar gedaan hebben. Om te kunnen starten met het onderzoek is het belangrijk dat er voldoende bronnen beschikbaar zijn. Daarom zal er in de eerste weken van het project vooronderzoek gedaan worden naar bruikbare bronnen voor het onderzoek.

7/12 3.4 Vooronderzoek Voor het onderzoek start is 2 weken vooronderzoek gedaan naar blogs, websites, magazines en video's over de nieuwe technieken. Door het verzamelen van deze bronnen wordt veel tijd bespaard tijdens het uiteindelijke onderzoek. 3.5 Het onderzoek Het onderzoek zal bestaan uit een afwisseling tussen deskresearch en interviews waarbij het constant gaat om het beantwoorden van de hoofdvraag:,,op welke manier kan Websdesign op het gebied van front-end development en interactie inspelen op snelle ontwikkelingen van de markt zonder kwaliteitsverlies van het eindproduct en verhoging van de doorlooptijd? In het onderzoek is het met name belangrijk dat gekeken wordt naar wat het bedrijf wil, wat er mogelijk is met de nieuwe technieken en welke beperkingen er zijn. Het onderzoek bestaat daarom uit de volgende deelvragen / deelonderwerpen: Huidige werkwijze bepalen Hoe gaat Websdesign nu om met het ontwikkelen van websites voor meerdere platforms en wat zijn de problemen daarbinnen? Belangrijk in het bepalen van een nieuwe manier van werken, is het bekijken van de huidige manier van werken. Hierbij is het vooral belangrijk om te kijken waar sneller en gebruiksvriendelijker gewerkt kan worden. Daarnaast is er natuurlijk ook ruimte voor andere suggesties vanuit het team. Onderzoek naar dit onderwerp zal gebeuren middels interviews met team development van Websdesign. De vragen die hierbij gesteld worden zullen vrij algemeen zijn en met name gericht op persoonlijke ervaringen met de huidige werkwijze. Op deze manier ontstaat er een goed beeld over op welke gedeeltes nu teveel tijd wordt verloren qua front-end development. De tijd die hier voor nodig zal zijn zal ongeveer een halve week zijn. Deze tijd zal als volgt ingedeeld worden: Dag 1: Bestuderen van het huidige proces middels documentatie. Dag 2: Interview met 2 werknemers van team Development (enventueel aangevuld met vragen over bevindingen uit de bestudeerde documentatie) In hoeverre wordt er nu rekening gehouden met de usability op andere platforms dan een pc/laptop? Als een klant komt met de vraag om een website voor meerdere platformen, hoe gaan jullie nu dan te werk? Als een klant van zijn bestaande website een mobiele versie willen, hoe gaan jullie hier dan mee om? Waar verlies je zelf voor je gevoel het meeste tijd mee als je aan een website bouwt (ongeacht voor welk platform deze is)? Waar verlies je zelf het meeste tijd mee als je een site ontwikkeld voor meerdere platforms? Wat zou je zelf graag terug zien in de nieuwe standaard voor front-end development binnen Websdesign? In hoeverre heb je al kennis van html5 & css3? m.a.w. Zou je er direct mee aan de slag kunnen gaan zonder enige uitleg over de manier van schrijven ed.? Zijn er nog specifieke vragen van een klant of beperkt het zich met name tot: ik wil een website die op meerdere apparaten goed te bekijken is? Dag 2: Interview met 1 werknemer van team Design: In hoeverre verschilt de nieuwe manier van werken met de oude manier van werken? Wat wordt er van team Development verwacht vanuit team Design? Welke nieuwe mogelijkheden moet ik zeker meenemen in mijn onderzoek? Dag 2/3: Uitwerken bevindingen en beantwoorden deelvraag

8/12 Eisenpakket samenstellen Wat zijn de eisen (binnen team development) voor een nieuwe standaard? Zodra bekend is wat de huidige werkwijze is, is het zaak om een eisenpakket op te stellen. Het is belangrijk dat er niet klakkeloos gebruik wordt gemaakt van alle nieuwe technieken maar er ook goed wordt gekeken in hoeverre deze technieken ook binnen het huidige systeem te gebruiken zijn en welke technieken het team zelf graag wil gebruiken. Hiervoor zal met team development overlegd moeten worden over wat er belangrijk is voor de nieuwe standaard. Dit onderdeel zal uitgevoerd worden aan de hand van interviews. Het gaat hier om een eisenpakket dat specifiek gemaakt wordt voor team Development van Websdesign. Zij zullen dus ook centraal staan tijdens de interviews. Voor dit onderdeel is een halve week nodig. Deze tijd zal als volgt ingedeeld worden Dag 1: Overleg met 3 werknemers van team development. Punten die hierbij aan bod komen: Verwachtingen van de nieuwe standaard Waar moet absoluut rekening mee gehouden worden? Wat zouden optionele elementen zijn? Grenzen van het deskresearch leggen Dag 2: Uitwerken bevindingen en beantwoorden van de deelvraag. Bepalen hoe het deskresearch eruit komt te zien. Trending technieken en features Wat zijn op dit moment de belangrijkste technieken en features wat betreft responsive design en multi-platform development? Naast het kijken naar wat werknemers willen, is het ook belangrijk om te kijken wat er mogelijk is. Door gebruik te maken van deze features ga je met je tijd mee en blijft het mogelijk om producten te maken die klanten van je verwachten. Daarnaast is het slim om te kijken naar welke features trending zijn. Als opkomend webbureau moet je natuurlijk letten op wat hip is, het is dus zaak om te kijken wat op het hedendaagse web veel gebruikt wordt. Dit onderzoeksdeel zal gaan bestaan uit deskresearch. Bronnen die hierbij gebruikt worden zijn magazines als Webdesigner en online (developer) blogs. Vooral de blogs komen vrijwel dagelijks met nieuwe technieken, features of handigheidjes. Magazines gaan vaak dieper in op deze nieuwigheden al zijn deze vaak later met nieuwe features dan blogs. Voor dit onderdeel zullen ongeveer twee weken nodig zijn. Dit deel zal het grootste deel van het onderzoek zijn. De bronnen hiervoor zijn al gevonden. De tijd zal als volgt ingedeeld worden: Week 1: Beperken van de bronnen naar de eisen uit het eisenpakket. Eventueel aanvullende bronnen zoeken (blogs / magazines / boeken) Deskresearch Week 2: Deskresearch Eventueel optie voor interviews mochten er vragen ontstaan. Beantwoorden van de deelvraag

9/12 Beperkingen van de nieuwe technieken In hoeverre bestaan er beperkingen binnen de gewenste technieken? Naast het kijken naar welke mogelijkheden er liggen met de nieuwe technieken is het natuurlijk ook enorm belangrijk om te kijken naar eventuele beperkingen binnen deze technieken. Denk hierbij simpelweg aan compatibiliteit met oudere browsers. Naast het onderzoeken wat de beperkingen zijn is het ook zaak om te onderzoeken of (en zo ja op welke manier) deze beperkingen te tackelen zijn. Dit onderzoeksdeel zal weer bestaan uit deskresearch. Met name magazines zijn hier handig bij omdat zij dieper in gaan op de onderwerpen. Daarbij wordt dus ook vaak informatie verschaft over de beperkingen. Dit sluit natuurlijk niet uit dat er ook online onderzoek gedaan kan worden. Voor dit deel zal een week tijd nodig zijn. Deze tijd zal uit de volgende onderdelen bestaan: Dag 1: Opstellen van de trending features Dag 1 t/m4: Deskresearch aan de hand van de trending technieken en features Dag 5: Beantwoorden deelvraag Advies uitschrijven Op welke manier kunnen de nieuwe technieken gebruikt worden binnen de huidige manier van werken binnen Websdesign? In dit laatste onderzoeksdeel zal vooral gekeken worden op welke manier de voorgaande delen met elkaar tot een geheel kunnen worden verweven. Er ontstaat dan een document met te gebruiken features en technieken met diens beperkingen en hoe deze te tackelen zijn. Aan de hand van dit document kan een advies worden afgegeven hoe Websdesign deze technieken in kan zetten in komende projecten. Dit laatste onderzoeksdeel zal ook weer met name bestaan uit deskresearch en maakt vooral gebruik van alle bevindingen tijdens het onderzoek. Ook zal het belangrijk zijn om middels interviews te toetsen in hoeverre het team zich kan vinden in de voorgestelde standaard. Voor dit onderdeel zal een week tijd nodig zijn. Dag 1 t/m 2: Beantwoorden en uitwerken deelvraag en hoofdvraag Dag 3 t/m 5 Schrijven van het advies De vorm van het onderzoek is in principe zoals hierboven is beschreven. Het kan natuurlijk voorkomen dat er tijdens het onderzoek extra informatie of andere problemen naar boven komen. In dat geval zal het onderzoek aangepast worden en kunnen er dus extra deelvragen bijkomen. Echter zal natuurlijk geprobeerd worden om dit onderzoek zo goed mogelijk aan te houden. De tijd die nu geschat wordt voor het onderzoek is 5 weken. Dit betekent dat het onderzoek afgerond wordt in week 10 van de afstudeerstage.

10/12 3.6 Ontwikkelfase Na het onderzoek volgt de ontwikkelfase waarin, aan de hand van het gegeven advies, een van de huidige producten van Websdesign opnieuw wordt ontwikkeld. Dit product zal vervolgens als voorbeeld van de nieuwe standaard gaan dienen. Hoe dit product er precies uit komt te zien zal bepaald worden na het onderzoek, aangezien het dan pas mogelijk is om exact te bepalen wat er verwacht wordt van het nieuwe product. Het zal hier vooral gaan om het in een nieuw jasje steken van een van de bestaande producten van Websdesign. Voor deze ontwikkelfase staan vervolgens nog 5 weken welke verder gespecificeerd zullen worden na het onderzoek. De ontwikkelfase zal er globaal als volgt uitzien: Bepalen wat het product gaat worden (met bijbehordende features) Ontwerpen (I.O. En Grafisch ontwerp) Uitwerken Testen en finetunen 3.7 Bronnen Een kleine greep uit de te gebruiken bronnen (een uitgebreide bronnenlijst komt terug in het onderzoek): Websites: http://html5demos.com/ http://www.w3schools.com/html5/default.asp http://www.html5rocks.com/en/ http://www.css3.info/ http://www.w3schools.com/css3/default.asp http://www.web-garden.be/bewerken-van-afbeeldingen/css3-scripts-en-voorbeelden/ http://css3generator.com/ http://www.modernizr.com/ Magazine: Webdesigner 3.8 Producten c.q. eindresultaat Er zullen 2 hoofdproducten uit dit project komen: Onderzoeksrapport met als conclusie een advies naar Websdesign: Hierin staan de belangrijkste punten die uit het onderzoek naar voren komen en er staat een advies voor een nieuwe standaard op het gebied van front-end development binnen Websdesign. ICT product: Een bestaand product van Websdesign middels de nieuwe standaard uitgewerkt.

11/12 Bijlage A: Planning Projectplanning Week 1 t/m 5 (t/m 16-03) Vooronderzoek Schrijven en afronden PID Stap 1t/m 6 uit het TSP Week 6 (t/m 23-03) Huidige werkwijze bepalen Interviews en beantwoorden deelvraag Eisenpakket samenstellen d.m.v. Interviews Beantwoorden deelvraag Start schrijven scriptie Week 7 (t/m 30-03) Trending technieken en features Deskresearch Week 8 (t/m 06-04) Trending technieken en features beantwoorden deelvraag Week 9 (t/m 13-04) Beperkingen nieuwe technieken Deskresearch Beantwoorden deelvraag Week 10 (afronden onderzoek) (deadline: 20-04) Beantwoorden hoofdvraag Onderzoek afronden Advies uitschrijven Stap 7 TSP Plan opstellen voor de uitwerking Planning maken / deadlines vaststellen Start met uitwerking Stap 8 TSP Week 11 t/m 15 (afronden ICT-Product) (deadline: 25-05) Ontwikkeling ICT-Product Afronding ICT-product Scriptie bijwerken Stap 9 & 10 TSP Week 16 & 17 (afronden scriptie) (deadline: 01-06) Scriptie schrijven en afronden Scriptie drukken Week 18 (inleveren scriptie((deadline: 07-06)

12/12 Bijlage B: Communicatie Stagiair Wouter Jassen wouter@webs.nl / wouter.janssen@student.fontys.nl +31621438383 Stagebegeleider John Ripmeester john@webs.nl +31648388014 Stagedocent Corrie Wolf-Guis cp.wolf@fontys.nl +31885070882 Afstudeerbedrijf Websdesign Internet Communicatie Oude stadsgracht 1 5611 DD Eindhoven +31402324611 www.websdesign.nl info@webs.nl