Skip to main content

5 Technisch 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 functioneeltechnisch 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 FOTO heeft een voorblad waarop de titel en jouw naam staat. Op de tweede pagina staat een inhoudopgave en de pagina's hebben paginanummers. Het FOTO 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 eenduidelilgeenduidig mogelijk beschrijft, zorg ervoor dat het zo duidelijk mogelijk is en dat jouw woorden niet verkeerd begrepen kunnen worden.

 

InleidingTechnische Specificaties

In
Functionaliteiten
dit

Laat functioneel ontwerp wordtmet een overzichtschema gegevenzien hoe de flow van de functionaliteiten(belangrijkste) waaraanfuncties is.

Bijvoorbeeld (de applicatiemeeste XYZTO's moet voldoen.

Functionaliteiten

(dit isbevatten een cruciaalhele criterium)serie van deze diagrammen, elk diagram komst vaak overeen met een Use Case):
Hier

vermeld
je
Gebruikersschermen
alle

Laat functionaliteiten.een Ditaantal magschermen inzien; 'useook casehier formaat'geldt en alsdat je een heelaantal duidelijkbelangrijke PvEschermen hebtmoet gemaakt dan  je daar veel uit kopiëren. Beschrijf de eisen duidelijktekenen en geeftmoet prioriteitenlaten aan. Zet alles duidelijk en netjes op papier gebruik bijvoorbeeld tabellen of schema's.

 zien.

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 vormgegevenimage-1599586579353.png

 

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.image-1599586703681.png

 

Eenimage-1599586787282.png

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. 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.

FormulierontwerpRelationeel Datamodel

Laat minimaal één invoer scherm zien (niet alleen de log-in). 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 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 minimaal 5 (van de 11) 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".

Toegpaste schematechnieken

(0 tot 3 punten)

 

De juiste schematechnieken zijn gekozen en verduidelijken de funcionaliteit.

User Interface

(0 tot 3 punten)

 

Communiceren FO

(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.

--

Back to top