Realiseert een applicatieStel je eigen tourfiets samen

Plaats, datum: Gouda, 01-07-2014

Stel je eigen tourfiets samen – realiseert een applicatie 1

Opgesteld door: Jens de Hoog

InhoudsopgaveVerantwoording...........................................................................................................................3

1 versiebeheer.............................................................................................................................4

1.1 Versiebeheer......................................................................................................................41.2 Verzendlijst........................................................................................................................4

2 Planning ..................................................................................................................................4

3 Gerealiseerde Functionaliteiten(Functioneel ontwerp 3.5)......................................................5

4 Gerealiseerde interfaces(Functioneel ontwerp 4).....................................................................6

4.1 Interface............................................................................................................................65 Gerealiseerde interfaces(Functioneel ontwerp 4)...................................................................18

5.1 Interface..........................................................................................................................18

Stel je eigen tourfiets samen – realiseert een applicatie 2

Verantwoording

1. De kandidaat heeft zich verdiept in de toe te passen programmeertaal en methodieken en heeft deze juist toegepast. Zie applicatie en technisch ontwerp hoofdstuk 4

2. De kandidaat heeft de interfaces geïdentificeerd en besproken met de leidinggevende / projectleider. Op basis hiervan realiseert hij interfaces die ergonomisch verantwoord zijn en aansluiten bij het ontwerp. Zie applicatie, hoofdstuk 4 en hoofdstuk 5

3. De kandidaat heeft na analyse van plan van aanpak, functioneel en technisch ontwerp een realistische planning van werkzaamheden en activiteiten gemaakt en deze vastgelegd in de planning van de werkzaamheden. Zie hoofdstuk 2, plan van aanpak hoofdstuk 8.

4. De kandidaat heeft (onderdelen van) een applicatie gerealiseerd die voldoet aan de gestelde eisen. Dit is gebeurd met de juiste materialen en middelen. Waar sprake is van een realisatie in onderdelen heeft de kandidaat deze in overleg met collega's en/of leidinggevende samen gevoegd tot een werkend geheel. Voortdurend is hierbij overleg geweest met collega's opdrachtgever en/of leidinggevende. Zie applicatie en hoofdstuk 5.

5. De kandidaat heeft een complete en goed verzorgde documentatie opgeleverd in het (kwaliteits)handboek. Zie bijlage handleiding.

Stel je eigen tourfiets samen – realiseert een applicatie 3

1 versiebeheer

1.1 VersiebeheerVersie Datum Auteur Aanpassingen0.1 28-06-14 Jens de Hoog Document realiseren van een applicatie aangemaakt0.2 01-07-14 Jens de Hoog Kleine wijzigingen, verwijzingen verbeterd,

besprekingen toegevoegd.

1.2 VerzendlijstDit document wordt ter beschikking gesteld aan:

N. vd RoovaartB. KlopJ. de Hoog

2 Planning

Dit is een beknopte planning voor de realisatie, voor de uitgebreide planning zie plan van aanpak.

Activiteit Tijd (uren) Dag (af) GerealiseerdUsbw installeren 1 16-06-14 JaDatabase installeren 2 16-06-14 Jainterfaces 10 18-06-14 Jajquery drag&drop 30 22-06-14 JaDatabase verbinden met applicatie 1 22-06-14 JaMysql / AJAX 30 28-06-14 Ja

Stel je eigen tourfiets samen – realiseert een applicatie 4

3 Gerealiseerde Functionaliteiten(Functioneel ontwerp 3.5)

Actie Prioriteit Gerealiseerd Opmerkingen Programmeer TalenRegistreren Hoog ja De bezoeker krijgt een

email met bevestiging link.

De registratie velden zijn geschreven in HTML, de validatie en connectie is gedaan met PHP / smtp mail / javascript / Mysql

Bevestigen Hoog Ja De geregistreerde bezoeker opent de bevestiging link uit de email en wordt verplaats naar lid

Smtp mail voor de email,php / mysql voor controle van aanmelding, html / javascript voor interfaces.

Inloggen Hoog ja Leden kunnen inloggen. De inlog velden zijn geschreven in HTML, de validatie en connectie is gedaan met PHP / mysql

Onderdelen toevoegen

Hoog Ja Beheerders kunnen onderdelen toevoegen.

De velden zijn geschreven in HTML, de validatie met connectie is gedaan met javascript/ PHP / mysql

Onderdelen wijzigen

Hoog Ja Beheerders kunnen onderdelen wijzigen.

De velden zijn geschreven in HTML, de validatie met connectie is gedaan met javascript/ PHP / mysql

Onderdelen verwijderen

laag ja Beheerders kunnen onderdelen verwijderen.

HTML javascript/ PHP / mysql

Gegevens Wijzigen

Midden ja De gebruikers kunnen hun gegevens wijzigen.

De velden zijn geschreven in HTML, de validatie en connectie is gedaan met PHP / mysql

Fiets (offerte) creëren

Hoog ja Het lid kan een fiets samenstellen en opslaan.

HTML javascript/ PHP / mysql / AJAX / jquery

Fiets wijzigen

Midden Ja Het lid kan de fiets wijzigen

HTML javascript/ PHP / mysql / AJAX / jquery

Fiets verwijderen

Laag nee Besloten dit niet toe te voegen

HTML / PHP / mysql

Offertes inzien

Hoog ja Het lid krijgt een lijst van zijn / haar offertes te zien

HTML / PHP / mysql

Offerte bekijken

Hoog ja Het lid kan de onderdelen van een offerte bekijken

HTML / PHP / mysql

Offerte printen

Laag ja Toon een printbare versie van de offerte en roep printfunctie aan van browser..

HTML / PHP / mysql / javascript

Admin toevoegen

Laag Ja Administrators kunnen leden tot admin aanwijzen

HTML / PHP / mysql / javascript

Admin verwijderen

Laag Ja Admins kunnen admins weer lid maken

HTML / PHP / mysql / javascript

Stel je eigen tourfiets samen – realiseert een applicatie 5

4 Gerealiseerde interfaces(Functioneel ontwerp 4)

4.1 Interface

Menu (header)

MenuHet menu bevat tot 5 knoppen afhankelijk van wat voor type account ingelogd is;

Als de bezoeker nog niet is ingelogd:

Als de gebruiker is ingelogd als lid:

Als de gebruiker is ingelogd als beheerder:

Stel je eigen tourfiets samen – realiseert een applicatie 6

De samensteller pagina:

Stel je eigen tourfiets samen – realiseert een applicatie 7

Op deze pagina krijgt het (toekomstige) lid/gebruiker de samensteller te zien;

Via de tabbladen(onderaan) kan het lid een categorie van onderdelen kiezen, onder de tabbladen krijgt de gebruiker alle onderdelen van de gekozen categorie te zien. Als de gebruiker zijn/haar cursor over een afbeelding van een onderdeel plaatst zal er een beschrijving(links) van dit onderdeel getoond worden.

Zodra het lid een onderdeel gekozen heeft kan hij/zij dit onderdeel toevoegen aan de fiets door op het onderdeel te klikken en verslepen naar het desbetreffende onderdelen vak(midden). Onderdelen kunnen alleen “gedropt” worden in het daarvoor bestemde onderdelen vak, met uitzondering van tassen en bagagedragers, deze kunnen zowel voor als achter op de fiets worden geplaatst.

Om een onderdeel te verwijderen sleept de gebruiker het onderdeel terug naar de categorie.

De gebruiker heeft ook direct een overzicht(rechts) van de geplaatste producten. Zodra de gebruiker klaar is met het personaliseren vult hij/zij een naam in en klikt onderaan op de “Sla op!” knop, hiermee word de fiets opgeslagen in de sessie. Als de gebruiker niet is ingelogd als lid, zal deze doorverwezen worden naar de aanmelding/login pagina. Als de gebruiker wel is ingelogd als een lid wordt de fiets opgeslagen in de database, de gebruiker word doorgestuurd naar zijn/haar overzicht van opgeslagen fietsen.

Stel je eigen tourfiets samen – realiseert een applicatie 8

De Account pagina:Deze pagina heeft 2 versies, niet ingelogd en ingelogd;

niet ingelogd:

De gebruiker krijgt deze versie te zien als hij/zij niet is ingelogd, de gebruiker kan inloggen met een bestaande account,of zich aanmelden voor de website. Na het volledig invullen van het aanmelden formulier en op de “aanmelden!” knop te klikken krijgt het toekomstige lid een email toegestuurd en de volgende popup te zien:

Stel je eigen tourfiets samen – realiseert een applicatie 9

Ingelogd:

De gebruiker krijgt deze versie te zien als hij/zij wel is ingelogd. Op deze pagina krijgt de gebruiker de huidige gegevens van zijn/haar account te zien(behalve wachtwoord). Om de gegevens te wijzigen dient de gebruiker alle velden, op de nieuw wachtwoord velden na, in te vullen/ingevuld laten, zijn/haar wachtwoord te geven en op de “wijzig” knop te drukken. De nieuw wachtwoord velden worden gebruikt om eventueel het wachtwoord te wijzigen. Als er voor wordt gekozen om het wachtwoord te wijzigen dient de gebruiker beide nieuw wachtwoord velden in te vullen en deze dienen gelijk te zijn aan elkaar. Als de gebruiker zijn/haar email en/of wachtwoord wijzigt, zal deze popup getoond en de gebruiker uitgelogd worden.

Stel je eigen tourfiets samen – realiseert een applicatie 10

opgeslagen fietsen:

Op deze pagina krijgt het lid zijn/haar samengestelde fietsen te zien. Door op de “Toon” knop te klikken krijgt de gebruiker de desbetreffende offerte overzicht te zien. Door op de “Wijzig” knop te klikken opent de samensteller met de opgeslagen onderdelen.

Offerte overzicht:

Hier krijgt de gebruiker een overzicht te zien van zijn/haar fiets. Door op de print knop te drukken opent er een nieuwe pagina met de printbare versie.

Stel je eigen tourfiets samen – realiseert een applicatie 11

De printbare versie:

Stel je eigen tourfiets samen – realiseert een applicatie 12

Offerte overzicht pagina:

Hier kan de beheerder een overzicht zien van opgeslagen fietsen(offertes). Door op de toon knop te klikken gaat de beheerder naar het volledige overzicht van de offerte.

Stel je eigen tourfiets samen – realiseert een applicatie 13

Onderdelen beheer:

Hier krijgt de beheerder de onderdelen te zien. De beheerder kan nieuwe onderdelen toevoegen met de “Nieuw onderdeel knop”. Met de wijzig knop gaat de beheerder naar de wijzig pagina voor het onderdeel. Met de verwijder knop word het desbetreffende onderdeel verwijderd.

Stel je eigen tourfiets samen – realiseert een applicatie 14

De nieuw onderdeel pagina:

Hier kan de beheerder een formulier invullen en een foto uploaden om een nieuw onderdeel toe te voegen.

Stel je eigen tourfiets samen – realiseert een applicatie 15

Wijzig onderdeel:

Hier krijgt de beheerder de info van het desbetreffende onderdeel te zien. Na het wijzigen van de info kan deze worden opgeslagen met de “Sla op” knop.

Stel je eigen tourfiets samen – realiseert een applicatie 16

De ledenbeheer pagina:

hier kan een beheerder leden beheren, om een lid te verwijderen of beheerder te maken klikt de beheerder op de delete/maak beheerder knop.

Stel je eigen tourfiets samen – realiseert een applicatie 17

5 Verslaglegging besprekingen.

Tijdens dit project hebben er meerdere besprekingen plaatsgevonden van ongeveer 5min, dit vanwege de variërende werkdruk naar aanleiding van klanten op de zaak. Tijdens deze besprekingen zijn de interfaces doorgenomen (functioneel ontwerp 4, technisch ontwerp 4) en is besloten dat deze gerealiseerd kunnen worden zonder verdere aanpassingen. De applicatie is als volledige website gerealiseerd, dus er is geen sprake geweest van samenvoegingen. Tijdens de bouw zijn de interfaces en structuur meerdere malen besproken met alle betrokkenen.

Datum Nodige documentatie / opgeleverde realisatie

Opmerkingen

18-06-14 Interfaces, dit document. Interfaces zijn voldoende, kan verder met drag & drop functionaliteiten.

20-06-14 Drag & drop Op schema slepen werkt en droppen werkt, moet nog per vak gerealiseerd worden

22-06-14 Drag & drop Drag & drop functionaliteiten voldoende

22-06-14 Verbinding database Verbinding voldoende.

22-06-14 AJAX, dit document Verbinding werkt, juiste format van gegevens(onderdelen info) dient gerealiseerd te worden. Documentatie dient bijgewerkt te worden.

25-06-14 AJAX Gegevens komen goed binnen, dient gelinkt te worden aan de versleepbare onderdelen

28-06-14 AJAX, dit document Applicatie werkt naar toebehoren, documentatie voldoende.

Stel je eigen tourfiets samen – realiseert een applicatie 18