DYNAMISCHE WEB-SITES
III
Ontwerpoverwegingen
IDEEEN, CONCEPTEN EN PROTOTYPEN
dr. ir. Rik Min
leermiddelen onderzoeker
Ontwerper / Ontwikkelaar
Universiteit Twente - Faculteit der Toegepaste Onderwijskunde
in samenwerking met ir. Jan de Goeijen, Dinkel-instituut
Postbus 217; 7500 AE Enschede
E-mail: Min@edte.utwente.nl
Web-site: users.edte.utwente.nl/min
Key-words: technologie, applets, Java, JavaScript, scripts, javascripts, (losse) elementen, (losse) componenten, hergebruik, libraries, sjablonen, templates, 'building blocks', events, 'intelligentie', smart, smart scripts, prototypes, doing-environments, working-environments, learning-environments, leermiddelentechnologie, spin-off, etc.
Abstract
Deze keer wil ik ingaan op zaken van algemene aard, namelijk ontwerpoverwegingen. De vorige keer hebben we voorbeelden gezien die gemaakt waren met 'WebLib' en 'SimLib' en waarbij we de kracht van losse applets en slimme scripts toonden. Nu willen we omhoog klimmen en dingen vanaf de top bekijken en bespreken.
Om te beginnen even iets vooraf / herhalen:
Voorbeeld (Gemiddelden berekenen en weergeven). Het voorbeeld laat zien hoe je kunt assembleren en web-sites modulair kunt opbouwen. Je kunt de berekeningen, zoals voor het gemiddelde, de afwijkingen of voor de deviaties, in javascript neerzetten en dus de hele techniek zelf onder controle houden. (Met 'WebLib'.)
Eerste serie voorbeelden
Vier introductie voorbeelden van vlakverdeling, etc.
Boek / collegediktaat (1997-2001). Een multifunctioneel boek met losse artikelen, hoofdstukken, paragrafen, etc. Een voorbeeld van de mogelijkheden van het web: actueel, dynamisch & interactief. Bevat dynamische onderdelen (gemaakt met 'WebLib' of 'SimLib').
- Zie paragraaf: 'regelsystemen' (hst. 2)
- Zie paragraaf: 'animatie' (hst. 5)
Vlakverdeling, een voorbeeld met twee soorten kleuren
Vlakverdeling, idem, in een tabel
Vlakverdeling, idem, met achtergrond
Vlakverdeling, idem, opgevuld
Vlakverdeling, een complex voorbeeld met het een tabel (en zonder frames)
Site map (gemaakt met het Fusion), een voorbeeld voor het besturen van een complexe web-site
Waar gaat het steeds om?
Het beeldscherm is te beperkt voor wat ik wil? De mens is te beperkt voor wat hij/zij wil? De ontwerper is te beperkt voor wat hij/zij wil? Het ontwerp is te beperkt voor wat men wil? Hypermedia zijn te beperkt voor wat we willen?
Wat is het probleem?
In een hypermedium verdwijnt iets (noem dat A) (denk aan iets belangrijks) steeds als je iets anders (noem dat B) (denk aan iets belangrijks) oproept of opzoekt? Een hypermedium vereist een goed of getraind kortetermijngeheugen? Een hypermedium moet minimaal werken als en boek? (Dat je opengeslagen moet kunnen laten liggen?) Je moet met een beeldscherm net zo kunnen werken als op je eigen bureau, op je eigen zolderkamertje, met allerlei opengeslagen boeken en verspreidliggende papieren?
Wat is (zijn) een oplossing(en)?
Alles in zicht proberen te houden? Grotere beeldschermen? Grotere beeldresolutie? Beter geheugen? Dingen opschrijven? Beter trainen? Dure cursus?
Tweede serie voorbeelden
Vier voorbeelden van functionele scheiding afzonderlijke delen.
Embedded simulatie (type a; prototype)
- Kijk hier voornamelijk naar de onhandige opbouw van het instructiegedeelte en de kern: het eigenlijke leergedeelte.
Embedded simulatie (type b; prototype)
- Kijk hier voornamelijk naar het aparte instructiegedeelte rechts. Links bevindt zich het eigenlijke leermiddel.
Embedded simulatie (type c; prototype)
- Kijk hier hoe het instructiegedeelte kan worden opgeroepen als het nodig is. De kern van de web-site is de krachtige, open leeromgeving.
Embedded simulatie (type d; prototype)
- Kijk hier hoe het instructiegedeelte centraal staat. Het leergedeelte kan worden opgeroepen en - naar gelang de behoefte - weg worden geschoven.
Waar gaat het steeds om?
Wat is het probleem?
Wat is (zijn) een oplossing(en)?
Instrumentatietechnologie
(de wetenschap van problemen, condities en oplossingen)
Als je met web-technologie wilt werken en als je dynamische onderdelen hebt en als ... , dan is het verstandig met .... te werken of te ontwikkelen.
Als er in het VWO leerlingen zijn van ... en als die overwegend visueel denken, dan .... (vanwege ....)
Als er een basisschool kinderen zijn van ... en als die aan het werk gezet moeten worden, dan .... (vanwege ....)
Als je .... en als je hele lange teksten hebt, dan moet je plaatjes en video ..... op ... manier aanbrengen (op straffe van het mislukken van je product)
Als ... en als .... of als ... , dan ....
Als ... en als .... , dan ....
Als ... , dan ....
Als een PhD-student zijn gegevens wil visualiseren en als ... , dan moet je niet meteen naar standaard pakketten, zoals SPSS grijpen, maar .... en ... (vanwege ....)
(door research: empirisch en ontwerpgericht onderzoek verkregen inzichten, concepten, veronderstellingen, wetmatigheden en theorieen)
(ISM-ers zijn probleemoplossers - wetenschappers - en leiden probleemoplossers op; balans tussen kunnen en kennen)
Libraries downloaden
Downloaden van Weblib en SimLib
Online courses
HTML, een korte cursus met voorbeelden hoe je een web-sites met losse mono multimediale elementen kunt opbouwen.
JavaScript en WebLib, een cursus met veel soorten voorbeelden van scripts en losse onderdelen.
Java, een korte cursus hoe je een applet kunt maken.
JavaTHESIS en SimLib, een cursus met voorbeelden hoe je simulaties kunt maken en in kunt bedden in web-sites.
Simulaties, een cursus met veel voorbeelden hoe je een leeromgeving, gebaseerd op open simulaties als leermiddel, kunt opbouwen.
Introductiecursus, een cursus over web-based methoden en technieken.
Parallellisme en de PI theorie, een lezing over onze ontwerptheorieen.
Conclusies & Discussies
Wanneer A-systemen (DreamWeaver, etc.)
Wanneer P-talen (JavaScript, Java, etc.)?
- o -
Kwaliteit versus tijd en tijdsinvestering:
A-systemen zijn belangrijk maar hogere programmeertalen ook. Let op de totaal verschillende korte- en/of lange-termijn-effecten.
- denk aan de 80/20 regel -
Referenties
Min, F.B.M., (1999). Interactive Micro-worlds on the World Wide Web. Int. J. of Continuing Engineering, Education and Long-life Learning, vol.9, no.2/3/4, p.302-314, ISSN 0957-4344.
Min, F.B.M., (1998). Digitale leermiddelen in een wereld van zappen en zoeken.
Proceedings van de Nationaal seminar 'digitalisering van
leermiddelen', in samenwerking met New Book Economy - Building
Informatica Society (NBE - BIS) en Hogeschool van Amsterdam,
Faculteit Economie en Informatie. ISBN 90 75064 06 3.
Min, F.B.M., en J. de Goeijen (2001). Javascripting en applet-gebruik.
Een cursus voor Toegepaste onderwijskundigen / leermiddelenspecialisten. Universiteit Twente.
Min, F.B.M., en J. de Goeijen (2001). Auteurssystemen versus hogere programmeertalen. Uit een serie sheets van een cursus voor Toegepaste onderwijskundigen / leermiddelenspecialisten. Universiteit Twente.
Min, F.B.M., (2001). Een voorbeeld van een simulatie: ECONOMY. Een prototype van de projectgroep 'computersimulatie als leermiddel'. Universiteit Twente.
Enschede; 27 apr 2001; updated 29 mei 2001
Home: users.edte.utwente.nl/min
(met toegang tot vele sites, o.a. site '21', deze site)
E-mail adres Rik Min: Min@edte.utwente.nl