08_interfata_grafica4iac_11.pdf

11
CAPITOLUL 8 Proiectarea interfeþei grafice cu utilizatorul elev Conceperea, proiectarea ”i realizarea interfeþei implicª luarea unor decizii privind: organizarea ”i aranjarea paginilor, prezentarea vizualª generalª a locaþiei disciplinei pe Web (imagini, culori...), utilizarea graficii, selectarea unei metafore corespunzªtoare ”i a programelor utilitare pentru navigaþie. Figura 8.1 Etapele de proiectare pentru sistemele multimedia ˛n figura 8.1 sunt ierarhizate (de la stânga la dreapta) etapele succesive de realizare a unei interfeþe grafice.

Upload: niculescu-elena

Post on 04-Jan-2016

212 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: 08_Interfata_Grafica4IAC_11.pdf

105REALIZAREA MATERIALELOR DE STUDIU PENTRU IAC

CAPITOLUL 8

Proiectarea interfeþei grafice cu utilizatorul elev

Conceperea, proiectarea ºi realizarea interfeþei implicã luarea unor decizii privind:organizarea ºi aranjarea paginilor, prezentarea vizualã generalã a locaþiei disciplinei peWeb (imagini, culori...), utilizarea graficii, selectarea unei metafore corespunzãtoare ºia programelor utilitare pentru navigaþie.

Figura 8.1 � Etapele de proiectare pentru sistemele multimedia

În figura 8.1 sunt ierarhizate (de la stânga la dreapta) etapele succesive de realizarea unei interfeþe grafice.

Page 2: 08_Interfata_Grafica4IAC_11.pdf

106 INSTRUIRE ASISTATÃ DE CALCULATOR

Interacþiunea dintre om ºi calculator este fundamentatã de mai multe disciplineteoretice (fig. 8.2).

Figura 8.2 � Fundamentarea teoreticã a interacþiunii dintre om ºi calculator

Antropologia examineazã experienþa umanã prin investigarea proceselor biologice,culturale ºi sociale ce caracterizeazã civilizaþia umanã. În raport cu alte discipline carestudiazã fiinþa umanã (de exemplu, psihologia, sociologia, economia, biologia), antro-pologia încearcã sã integreze într-un singur concept gândirea, comportamentul ºi biologicul.

Acumulãrile civilizaþiei umane � religia, mitologia, ºtiinþele economice, politice,juridice ºi tehnologia � primesc noi dimensiuni când sunt abordate holistic ºi comparativde antropologie.

Elementul esenþial care asigurã navigarea ºi interactivitatea în instruirea asistatã deun sistem informatic este interfaþa graficã (vezi fig. 8.3).

Figura 8.3 � Factorii care influenþeazã proiectarea interfeþei om-calculator

Page 3: 08_Interfata_Grafica4IAC_11.pdf

107PROIECTAREA INTERFEÞEI GRAFICE CU UTILIZATORUL ELEV

Aceastã secþiune conþine informaþii despre principiile generale care trebuie aplicate laproiectarea paginilor Web. Sunt furnizate câteva modele generale de proiectare a paginilorWeb, este discutatã utilizarea graficii ºi sunt prezentate modelele de realizare a navigãrii.

Proiectarea interfeþelor grafice cu utilizatorul elev

Proiectarea interfeþelor grafice utilizator (fig. 8.4) reprezintã una dintre fazele importanteale procesului de implementare a unui sistem de instruire informatic.

Figura 8.4 � Diagrama interacþiunii om/calculator

Interfaþa cu utilizatorul elev trebuie sã furnizeze toate facilitãþile necesare unui elevpentru a putea naviga în aplicaþie intuitiv ºi cât mai transparent posibil. Proiectareainterfeþelor reprezintã o activitate foarte importantã în dezvoltarea sistemelor informatice,chiar criticã din perspectiva acceptãrii sistemului de cãtre utilizatori. Acest lucru esteexplicabil dacã þinem cont de faptul cã interfaþa utilizator reprezintã partea din sistem pecare el o vede, cu care interacþioneazã pentru a-ºi realiza sarcinile de lucru cu ajutorulcalculatorului. Interfaþa dintre om ºi calculator constituie un mediu efectiv de comunicarepe baza cãruia utilizatorii pot interacþiona cu calculatorul pentru a transmite comenzileºi datele, precum ºi pentru a obþine informaþiile necesare realizãrii sarcinilor lor de

Page 4: 08_Interfata_Grafica4IAC_11.pdf

108 INSTRUIRE ASISTATÃ DE CALCULATOR

lucru. Altfel spus, în aceastã accepþiune interfaþa face referire la partea vizibilã asistemului din punctul de vedere al utilizatorilor.

Principiile care ghideazã activitatea de proiectare a interfeþelor utilizator sunt:

1. controlul aplicaþiei de cãtre utilizator;2. limitarea cantitãþii de informaþii pe care utilizatorul trebuie sã o memoreze;3. uniformitatea interfeþelor utilizator.

O interfaþã trebuie conceputã astfel încât utilizatorul sã simtã cã el este cel carecontroleazã aplicaþia, ºi nu invers. Altfel spus, derularea proceselor realizate cu ajutorulcalculatorului trebuie sã fie sub controlul utilizatorului prin operaþiunile pe care el leiniþiazã, utilizatorul jucând un rol activ, ºi nu unul reactiv.

Figura 8.5 � Modelul procesorului uman

Reducerea volumului de informaþii ºi cunoºtinþe pe care trebuie sã le memoreze utilizatoruleste o cerinþã obligatorie. Dupã cum demonstreazã cercetãrile psihologice (fig. 8.5), celedouã componente ale sistemului de memorare uman sunt limitate: prima componentã,memoria pe termen scurt, asigurã regãsirea uºoarã a informaþiilor reþinute, însã este limitatãîn ceea ce priveºte perioada ºi capacitatea de memorare; a doua componentã, memoria petermen lung, este nelimitatã în ceea ce priveºte capacitatea ºi perioada de memorare, însã elimitatã în regãsirea informaþiei.

Page 5: 08_Interfata_Grafica4IAC_11.pdf

109PROIECTAREA INTERFEÞEI GRAFICE CU UTILIZATORUL ELEV

Figura 8.6 � Modelul procesãrii informaþiei

Conform principiului degrevãrii memoriei pe termen scurt a utilizatorului, utili-zatorii nu trebuie forþaþi sã memoreze unele informaþii pe termen scurt atunci cândsunt obligaþi sã treacã de la o operaþiune la alta; aplicaþia trebuie sã facã acest lucrupentru ei.

Problema majorã în cazul memoriei pe termen lung este legatã de regãsirea infor-maþiei, iar aplicaþia trebuie sã sprijine utilizatorul în acest sens.

Existã douã metode principale de regãsire a informaþiei din memorie: recunoaºtereaºi amintirea. Recunoaºterea presupune regãsirea informaþiei pe baza unei sugestii, întimp ce amintirea implicã regãsirea informaþiei fãrã existenþa vreunei sugestii. Evidentcã este mult mai comod pentru utilizator dacã are posibilitatea sã recunoascã o informaþiedecât sã încerce sã ºi-o aminteascã. De aceea, este preferabilã furnizarea unei liste dincare utilizatorul sã recunoascã ºi sã selecteze elementul dorit în loc sã fie obligat sã-ºiaminteascã ºi sã introducã elementul respectiv într-o cãsuþã de text; este mai bine sãselecteze o comandã din meniu decât sã o introducã de la tastaturã.

Proiectarea concentratã asupra utilizatorului uman impune interfeþei caracteristicilecare îi permit utilizatorului sã controleze procesul de instruire.

Psihologia memoriei umane studiazã modelul procesorului uman (vezi fig. 8.6).Memoria umanã ºi procesul memoriei sunt esenþiale pentru interacþiunea dintre om ºi

calculator. Utilizarea calculatorului depinde de proprietãþile sistemului uman de memorie.Gândul uman poate fi descris, mai mult sau mai puþin, ca un proces conºtient almemoriei. Conform teoriilor din domeniu, existã trei tipuri de memorie:

Page 6: 08_Interfata_Grafica4IAC_11.pdf

110 INSTRUIRE ASISTATÃ DE CALCULATOR

� memoria senzorialã, care primeºte informaþii de la cele cinci simþuri (vãz, auz,pipãit, miros ºi gust);

� memoria de scurtã duratã, memoria de lucru, care primeºte percepþii selective cepot fi reasamblate în ceea ce numim �conºtienþã�;

� memoria de lungã duratã, care stocheazã selectiv informaþii ºi care poate sã fie activatãgradual ºi sã continue lucrul asupra impresiilor.

Memoria senzorialã tampon stocheazã momentan stimulii de la senzori. Dacã nu estestocatã în memoria de scurtã duratã, conþinutul se pierde rapid.

Modelul unui ecran cu informaþii

Fãrã o structurã de organizare solidã ºi logicã, locaþia Web nu va funcþiona eficient chiardacã conþinutul de bazã este corect ºi bine redactat (scris).

Pentru a organiza informaþia, profesorul trebuie sã parcurgã urmãtoarele patru etape:1. divizarea informaþiei în unitãþi logice;2. stabilirea unor ierarhii pentru importanþa ºi generalitatea informaþiei;3. utilizarea ierarhiilor pentru structurarea relaþiilor (conexiunilor) dintre segmentele

de disciplinã;4. analizarea implementãrii estetice ºi funcþionale a sistemului.

Figura 8.7 � Exemplu de model pentru ecran

Observaþie: Dimensiunile sunt în puncte, respectiv pixeli, milimetri.

În figura 8.7 este prezentat un model simplu de ecran care conþine graficã, text, film,repere de orientare ºi butoane pentru navigare.

Page 7: 08_Interfata_Grafica4IAC_11.pdf

111PROIECTAREA INTERFEÞEI GRAFICE CU UTILIZATORUL ELEV

Figura 8.8 � Structurarea ierarhizatã ºi distribuirea informaþiilor sub forma paginilor HTML

Orice paginã Web trebuie sã conþinã legãturi active care sã faciliteze navigarea.

Figura 8.9 � Conexiuni dinamice ataºate unui conþinut dinamic

Tot în IGU (interfaþa graficã cu utilizatorul elev) pot fi indicate modurile de navigare:în reþea, liniar, ierarhizatã, structuratã în reþea (fig. 8.8).

Page 8: 08_Interfata_Grafica4IAC_11.pdf

112 INSTRUIRE ASISTATÃ DE CALCULATOR

În mod sigur, dacã profesorul nu are o idee clarã asupra modului în care o secþiuneeste corelatã cu locaþiile altor secþiuni sau dacã nu are un mod clar de organizare înordonarea materialului, cititorii sãi vor observa acest lucru foarte repede ºi mulþi vorcãuta pe Internet un material mai bine organizat.

Dacã se considerã o diagramã pentru o structurã Web ierarhizatã, locaþia Web estecaracterizatã de spaþiul informatic ºi de structura de navigaþie în spaþiul informatic(fig. 8.8).

În concluzie, un program de instruire (interactiv, cuprinzãtor ºi explicit) are caelemente definitorii urmãtoarele noþiuni:

� predare: procesul oferirii direcþionãrii individuale a elevului;� învãþare: procesul acumulãrii de cunoºtinþe privind un subiect prin studiu, instruire

sau experimentare;� instruire: procesul oferirii, într-un mod sistematic, a informaþiilor sau cunoºtinþelor

despre un subiect.

Cum poate un pachet de programe sã intensifice aceste procese?În primul rând, prin utilizarea în clasã, integrat în discuþiile la lecþii despre subiectul

predat, i se oferã instructorului posibilitatea ilustrãrii într-o manierã sistematicã a unuinumãr de exemple concepute sã consolideze conceptele subiectului studiat (predat).

În al doilea rând, se faciliteazã interacþiunea instructor-elev în contextul derulãriiunor exemple concomitent cu desfãºurarea lecþiei.

În al treilea rând, i se permite elevului sã exploreze în ritm propriu ºi de unul singurexemplele ºi astfel sã întãreascã învãþarea a materiei, fãrã sã fie inhibat de atmosferaclasei.

Astfel: a) se simplificã noþiunile dificile, prezentându-se multe exemple într-un timpscurt; b) se vizualizeazã uºor procese dinamice greu de reprezentat pe tablã; c) i sepermite elevului sã participe la instruire; d) se pot efectua rapid multe calcule dificile lalecþie, rãmânând mai mult timp pentru procesul de predare.

Cele patru modele fundamentale de organizare a materialului sunt:

1. Secvenþa sau structura liniarã

Figura 8.10 � Secvenþa sau structura liniarã

Cel mai simplu mod de organizare a informaþiilor este secvenþa sau prezentarea narativãlinearã. Ordonarea secvenþialã poate fi cronologicã, o serie logicã de subiecte prezentatede la general la particular (sau specific) sau chiar o prezentare alfabeticã (aºa cum se faceîn indexuri, enciclopedii ori glosare). Organizarea secvenþialã este utilã pentru locaþiimici; pentru secvenþe narative lungi, acest mod de structurare devine însã complex ºi,astfel, o mare parte din structurã poate rãmâne insuficient înþeleasã de cãtre elev;

Page 9: 08_Interfata_Grafica4IAC_11.pdf

113PROIECTAREA INTERFEÞEI GRAFICE CU UTILIZATORUL ELEV

2. Structura de tip grilã

Figura 8.11 � Structura de tip grilã

Multe manuale procedurale, listele de discipline ºcolare sau descrierile unor cazurispecifice de proiectare (sau standarde tehnice) sunt cel mai bine organizate sub formaunor grile (reþele). O unitate individualã dintr-o reþea trebuie sã ofere o structurãsuperior organizatã ºi uniformã de subiecte. De cele mai multe ori, subiectele nu suntorganizate ierarhic dupã importanþa noþiunilor prezentate. Ca dezavantaj trebuiemenþionat faptul cã reþelele pot fi greu înþelese de un utilizator (elev) care nurecunoaºte interconexiunile categoriilor de informaþii; deci aceste structuri în reþeasunt recomandate unei audienþe avizate, care posedã cunoºtinþele fundamentale aledomeniului prezentat privind subiectele ºi clasificarea noþiunilor.

3. Structura ierarhizatã

Figura 8.12 � Structura ierarhizatã

Structura ierarhizatã se aplicã în lecþiile care conþin interdependenþe ºi legãturi de tipcauzã-efect.

Page 10: 08_Interfata_Grafica4IAC_11.pdf

114 INSTRUIRE ASISTATÃ DE CALCULATOR

4. Reþeaua de tip pânzã de pãianjen sau reþea Web

Figura 8.13 � Reþeaua de tip pânzã de pãianjen sau reþea Web

Pentru lecþii recapitulative sau de sintezã se recomandã reþeaua tip pânzã de pãianjen.

Conexiuni dinamice ataºate unui conþinut dinamic

Grafica documentelor distribuite într-o reþea Web este proiectatã astfel încât sã conþinãindicatoare pentru facilitarea navigaþiei (fig. 8.14).

Figura 8.14 � Orientarea utilizatorului în spaþiul informatic

Fiecare paginã trebuie sã conþinã indicatori cu ajutorul cãrora elevul sã se poatãorienta în spaþiul de studiu (instruire, cunoºtinþe învãþate).

Page 11: 08_Interfata_Grafica4IAC_11.pdf

115PROIECTAREA INTERFEÞEI GRAFICE CU UTILIZATORUL ELEV

Dacã se analizeazã diagrama bazei de date în hypermedia, se observã cã celula�conexiuni� indicã faptul cã nodul respectiv este deschis (fig. 8.15).

Figura 8.15 � Noduri ºi conexiuni în documentele de tip hypermedia

În orice document hypermedia, cu conexiuni active ºi conþinut multimedia, existãnoduri, conexiuni, diagrame, programe utilitare pentru identificarea informaþiilor. Cone-xiunile au atribute, marcaje ºi sunt clasificate (ierarhizate).