4 Functioneel Ontwerp

Wat gaan we leren?

De derde opdracht van kerntaak 1 is het maken van functioneel en technisch ontwerp. Deze les gaat over het functioneel ontwerp (FO). Als uitgangspunt neem je het PvE en als jouw functioneel ontwerp klaar is dan licht je die toe aan de opdrachtgever en vraag je om akkoord.

In deze les bespreken we wat er in het functioneel ontwerp moet komen te staan en hoe je wordt beoordeeld. Ten slotte gaan we oefenen met de cases die we al kennen vanuit de vorige les.

Examen-template

We beginnen gelijk met de deur-in-huis en gaan kijken naar de examen-template; wat moet er in het functioneel ontwerp komen te staan?

De onderstaande indeling is voor een groot deel gekopieerd uit de template die je krijgt op het examen.

Let op het FO heeft een voorblad waarop de titel en jouw naam staat. Op de tweede pagina staat een inhoudopgave en de pagina's hebben paginanummers. Het FO bestaat uit ongeveer 10 pagina's, maar bevat vaak ook veel plaatjes/schema's.

Verder geldt in zijn algemeen, zorg dat alles er netjes en verzorgd uitziet en dat je de zaken zo eenduidelilg mogelijk beschrijft, zorg ervoor dat het zo duidelijk mogelijk is en dat jouw woorden niet verkeerd begrepen kunnen worden.

Inleiding

In dit functioneel ontwerp wordt een overzicht gegeven van de functionaliteiten waaraan de applicatie XYZ moet voldoen.

Functionaliteiten

(dit is een cruciaal criterium)
Hier vermeld je alle functionaliteiten. Dit mag in 'use case formaat' en als je een heel duidelijk PvE hebt gemaakt dan je daar veel uit kopiëren. Beschrijf de eisen duidelijk en geeft prioriteiten aan. Zet alles duidelijk en netjes op papier gebruik bijvoorbeeld tabellen of schema's.

Voorbeelden:

Fout (waarom?)

- de applicatie moet er mooi uit zien en mag geen fouten bevatten

- de applicatie moet veilig zijn

- als admin kan ik de applicatie beheren

- buttons zullen met Bootstrap 4.0 worden vormgegeven

Goed (waarom?)

- als ingelogde gebruiker kan ik zien van welke cursus nog plaatsen beschikbaar zijn.

- als ingelogd gebruiker kan ik mij inschrijven voor een cursus als er ten miste nog voldoende plaatsen zijn

- als ik als admin ben aangelogd dan kan ik alle cursus gegevens beheren, ik kan alleen geen cursussen weggooien waar inschrijvingen aan gekoppeld zijn.

- als ik als admin ben aangelogd kan ik de inschrijvingen op een cursus beheren. Ik kan dus inschrijvingen toevoegen en verwijderen.

Basisschermlay-out

Hoe ziet de website eruit; kleurgebruik, lettertype, en standaardcomponenten. Is er een voorbeeld website, zijn er logo's of banners die moeten worden gebruikt?

Gebruik een voorbeeld van hoe de website er uit ziet. Maar een proto-type, dat kan met een wireframe of met een schermvoorbeeld. Je krijgt hierdoor een goed algemeen beeld van hoe de website er uit komt te zien.

Een voorbeeld van een wireframe vind je op: https://www.roc.ovh/books/examentraining-b1-k1/page/w3-functioneel-ontwerp---flow

Uitvoerontwerp

Laat minimaal een uitvoerontwerp zien. Dit is een plaatje. Uitvoer is het resultaat van het programma. Bijvoorbeeld een overzicht van alle cursusreserveringen of een overzicht van de klassenindeling. Geeft dit in een proto-type weer.

Formulierontwerp

Laat minimaal één ~~invoer scherm~~invoerscherm zien (niet alleen de log-in). Dit is een plaatje. Zelfde als bij uitvoer, maar een duidelijk proto-type.

Navigatiestructuur

Hoe navigeer je door de website, hoe zijn de schermen met elkaar verbonden. Gebruik een schema. Een voorbeeld van een flow-chart vind je op: https://www.roc.ovh/books/examentraining-b1-k1/page/w3-functioneel-ontwerp---flow

Gebruikersschermen

Beschrijf ALLE schermen en geef bij alle invoerschermen aan wat je er precies ~~kan~~kan/moet invoeren. Bij voorkeur voorbeelden in de vorm van proto-type's bijvoegen, zeker voor de complexe schermen; een plaatje zegt zoveel meer dan woorden.

Voorbeeld:

Fout (waarom?)

- aanmeldscherm cursus, geef naam en contactgegevens op.

Goed (waarom?)

- aanmeldscherm cursus, de invoervelden zijn: voornaam, achternaam, woonplaats, email en telefoonnummer.

Beoordeling Examen

In totaal moet ja samen met het TO minimaal 10 (van de 19) punten behalen en er zijn geen cruciale criteria.

Het officiële beoordelingsformulier is bij deze pagina toegevoegd. Let op deze bevat de beoordeling voor het FO en het TO samen.

Functionaliteiten

(0 tot 3 punten)

Cruciaal criterium! minimale eis: "bijna alle eisen en wensen uit het PvE zijn opgenomen en deze zijn begrijpelijk en eenduidig beschreven".

Toegepaste schematechnieken

(0 tot 3 punten)

De juiste schematechnieken zijn gekozen en verduidelijken de functionaliteit.

User Interface

(0 tot 3 punten)

Het is duidelijk hoe het systeem eruit gaat zien en de relaties tussen de schermen is ook duidelijk. Hiervoor is een sitemap of navigatiestructuur-schema opgenomen.

Communiceren FO

Cruciaal

(0 of 1 punt)

Het FO wordt duidelijk toegelicht en er wordt om goedkeuring gevraagd.

Je moet minimaal 5 (van de 11) punten behalen en er zijn geen cruciale criteria.

Aanvullende bronnen

Boek: Applicatie- en mediaontwikkelaar door Hans van Rheenen, hoofdstuk 5.

Opdracht

Maak een FO van de case waarvan we ook een PvE en Pojectplan hebben gemaakt.