ΕΠΛ 435: Αλληλεπίδραση Ανθρώπου Υπολογιστή

Περιεχόµενα ΕΠΛ 435: Αλληλεπίδραση Ανθρώπου Υπολογιστή Τεχνολογίες και τεχνικές Αλληλεπίδρασης Ανθρώπου Υπολογιστή: Στυλ Αλληλεπίδρασης, ιεπιφάνεια WIMP Βιβλιογραφία Μοντέλα επικοινωνίας ανθρώπου υπολογιστή: επανάληψη; Ολισθήµατα (slips) Σφάλµατα (mistake) Εργονοµική ιάσταση Στυλ Αλληλεπίδρασης Γραµµή Εντολών Menu Επιλογής Φόρµες Φυσική Γλώσσα Απευθείας Χειρισµός Η ιεπιφάνεια WIMP Βιβλιογραφία Αβούρης [2000]: Κεφάλαιο 3, pp. 89-106, slides in [pdf] Dix [2004]: Chapter 3, slides in [pdf] Shneiderman [2004]: Chapter 6-8, [link] Metaphors and Direct Manipulation, by S. Greenberg, slides in [pdf] Visual Variables, by S. Greenberg, slides in [pdf] Γιατί µελετάµε τις τεχνολογίες αλληλεπίδρασης; Να διακρίνουµε τα διάφορα στυλ αλληλεπίδρασης που µπορούν να χρησιµοποιηθούν σε µια διεπιφάνεια χρήστη και να τα συσχετίσουµε µε τα γνωστικά µοντέλα και τα µοντέλα επικοινωνίας ανθρώπου υπολογιστή Να απαριθµούµε τα πλεονεκτήµατα και µειονεκτήµατα των διαφόρων στυλ αλληλεπίδρασης έτσι ώστε να τεκµηριώνεται η επιλογή του καταλληλότερου στυλ για τις απαιτήσεις του συγκεκριµένου χρήστη και της συγκεκριµένης εργασίας

Μοντέλα επικοινωνίας ανθρώπου υπολογιστή: Επανάληψη Μοντέλο Norman Ο χρήστης θέτει ένα στόχο Σχηµατίζει την πρόθεση Καθορίζει τις απαιτούµενες δράσεις στη ιαπροσωπεία Εκτελεί τις δράσεις Αντιλαµβάνεται την απόκριση του συστήµατος ιερµηνεύει την κατάσταση του συστήµατος Αξιολογεί την κατάσταση του συστήµατος σε σχέση µε τον αρχικό στόχο Το µοντέλο Norman επικεντρώνεται στην εικόνα του χρήστη για τη διαπροσωπεία. Μοντέλο εκτέλεσης / εκτίµησης execution Οχρήστης θέτει ένα στόχο Σχηµατίζει την πρόθεση Καθορίζει τις απαιτούµενες δράσεις στη ιαπροσωπεία Εκτελεί τις δράσεις goal system Αντιλαµβάνεται την απόκριση του συστήµατος ιερµηνεύει την κατάσταση του συστήµατος evaluation Αξιολογεί την κατάσταση του συστήµατος σε σχέση µε τον αρχικό στόχο Ηχρήση του µοντέλου Norman και η διαπροσωπεία Μερικές διαπροσωπείες είναι περισσότερο εύχρηστες από άλλες λόγω του: Χάσµατος Εκτέλεσης (Gulf of Execution) Ο καθορισµός δράσεων από το χρήστη επιτρεπτές δράσεις από το σύστηµα Χάσµατος Εκτίµησης (Gulf of Evaluation) Η αναµενόµενη από το χρήστη κατάσταση του συστήµατος πραγµατική εµφάνιση της κατάστασης του συστήµατος Το λάθος είναι ανθρώπινο: Ολισθήµατα και σφάλµατα Ολισθήµατα (slips) Είναι αποτέλεσµα αυτοµατοποιηµένης συµπεριφοράς Υπάρχει ορθή κατανόηση του ιδεατού µοντέλου του συστήµατος και σωστός καθορισµός δράσεων αλλά λάθος εκτέλεση των δράσεων Συµβαίνουν λόγω του ότι χρήστης κάνει πολλά πράγµατα ταυτόχρονα Καλύτερη σχεδίαση διεπιφάνειας οδηγεί σε µείωση των ολισθηµάτων Σφάλµατα (mistakes) Είναι αποτέλεσµα σχεδιασµένης συµπεριφοράς Υπάρχει λάθος ορισµός στόχου πιθανότατα λόγω λανθασµένου ιδεατού µοντέλου συστήµατος Συµβαίνουν: ιότι η ανθρώπινη σκέψη και η ικανότητα επίλυσης προβληµάτων βασίζεται στην εµπειρία παρά στη λογική και στη τεκµηρίωση Λόγω πίεσης από το κοινωνικό περιβάλλον Ορθότερα µοντέλα σχεδιαστή και ανθρωποκεντρικός σχεδιασµός οδηγεί σε µείωση των ολισθηµάτων

Εργονοµία Στυλ Αλληλεπίδρασης Εργονοµία: Η µελέτη των φυσικών χαρακτηριστικών της αλληλεπίδρασης Εργονοµία και ιαπροσωπεία ιάταξη οθονών και πλήκτρων ελέγχου: Ταξινόµηση πλήκτρων ελέγχου σύµφωνα µε τη λειτουργικότητα, συχνότητα χρήσης ή ακολουθιακά Περιβάλλον χρήσης Επιλογή συσκευών αλληλεπίδρασης Θέµατα Υγείας Χρήση χρώµατος Κόκκινο => προειδοποίηση, πράσινο => ΟΚ Συναίσθηση αχρωµατοψίας Γραµµή Εντολών Menu Επιλογής Φόρµες Πλαίσια διαλόγου Φυσική Γλώσσα Απευθείας Χειρισµός Στυλ Αλληλεπίδρασης = > Γραµµή Εντολών Στυλ Αλληλεπίδρασης = > Γραµµή Εντολών: Οδηγίες σχεδιασµού ιοχέτευση εντολών κατευθείαν στον υπολογιστή µέσω: Λέξεων, συντµήσεων, απλών χαρακτήρων ή συνδυασµού των προηγουµένων Παράδειγµα: Κέλυφος (Shell) Unix Πλεονεκτήµατα: Η δυνατότητα που παρέχει σε έµπειρους χρήστες να εκτελούν µε γρήγορο και αποτελεσµατικό τρόπο σύνθετες λειτουργίες. Πρωτοβουλία ενεργειών στο χρήστη. Μειονεκτήµατα: δεν είναι κατάλληλο για άπειρους ή ευκαιριακούς χρήστες, απαιτεί συνήθως µακροχρόνια εκπαίδευση και ικανότητα ενθύµησης των εντολών σε περιπτώσεις σφαλµάτων δεν είναι κατατοπιστικό Μικρό και απλό ρεπερτόριο εντολών: Το ρεπερτόριο εντολών πρέπει να είναι µικρό έτσι ώστε ο χρήστης να µπορεί να τις µάθει σε σύντοµο χρονικό διάστηµα Κάθε εντολή αναφέρεται σε µια και µόνη εργασία Οι εντολές να έχουν µνηµονικά ονόµατα που συνεπάγονται τη χρήση τους ώστε να γίνεται εκµετάλλευση της θεωρίας βάθους επεξεργασίας Είναι προτιµότερη περισσότερη πληκτρολόγηση παρά µεγαλύτερο πλήθος εντολών ή µη µνηµονικά ονόµατα (βλ. vi στο Unix) Χρήση εντολών µε το µικρότερο δυνατό αριθµό ορισµάτων Τα µηνύµατα λάθους όσον αφορά τη χρήση των εντολών πρέπει να είναι κατανοητά και να δίνουν ένα απλό παράδειγµα χρήσης της εντολής έτσι ώστε η επόµενη προσπάθεια εκτέλεσης της εντολής να είναι επιτυχηµένη Χρήση ιεραρχικής δοµής εντολών: Action Object Destination => Copy FileA DirectoryB, Print Page Printer Τήρηση ενιαίας λογικής όσον αφορά την σύνταξη των εντολών Εντολή Παράµετροι Αντικείµενο => chmod o+r Chap02*.htm

Στυλ Αλληλεπίδρασης = > Menu Επιλογής Στυλ Αλληλεπίδρασης = > Menu Επιλογής => Κατηγορίες Menu Είναι ένα σύνολο επιλογών οι οποίες εµφανίζονται στην οθόνη. Στη πραγµατικότητα είναι µια περιορισµένη µορφή ενός πλήρους συστήµατος WIMP Οι επιλογές είναι ορατές: Αναγνώριση αντί Ενθύµησης Τα ονόµατα επιλογών πρέπει να υποβοηθούν την διαδικασία της αναγνώρισης Οι επιλογές µπορούν να γίνουν µέσω: Πληκτρολόγησης αριθµών ή γραµµάτων Χρήσης δεικτικών συσκευών ή πλήκτρων πλοήγησης Συνδυασµού των ανωτέρω Οι επιλογές είναι οµαδοποιηµένες Η οµαδοποίηση πρέπει να γίνεται µε κάποια λογική Προσοχή στα ολισθήµατα (slips) υαδικά Menu (Binary Menus) Μνηµονικά γράµµατα (Mnemonic letters) Β => Black and White C => Color Radio Buttons Επιλογή πλήκτρου (Button Choice) => Cancel Done Menu πολλών στοιχείων (Multiple-item Menus) Menu πολλαπλής επιλογής (Multiple-selection menus or check boxes) Pull-down or pop-up menus ισδιάστατα menu (two-dimensional menus) Ενσωµατωµένες συνδέσεις (Embedded links) Menu εικονιδίων (Iconic Menus, toolbars, or palettes) Στυλ Αλληλεπίδρασης = > Menu Επιλογής => Οδηγίες σχεδίασης Στυλ Αλληλεπίδρασης = > Menu Επιλογής => Πλεονεκτήµατα - Μειονεκτήµατα O αριθµός των επιλογών σε κάθε µενού: 4 έως 12. Αν είναι µεγαλύτερος πρέπει να γίνεται µια εικονική οµαδοποίηση εντός του menu. Η οµαδοποίηση των επιλογών πρέπει να γίνεται µε θεµατικά κριτήρια. Είναι προτιµότερες πολλές επιλογές και µικρότερο βάθος (breadth vs. depth) παρά το αντίστροφο: Ο χρόνος Τ για µια επιλογή από menu δίνεται από τη σχέση Τ=D*(k+c*log 2 b) b το πλήθος των οριζόντιων επιλογών, και D το βάθος στην ιεραρχία (k και c εµπειρικές σταθερές) υνατότητα πλοήγησης στην ιεραρχία των µενού, µε πρόβλεψη για αναίρεση (undo), ακύρωση (abort) και υποχώρηση (backtrack). Χρήση menu map για προσανατολισµό του χρήστη και σχηµατισµό συνολικής εικόνας του συστήµατος Ta στοιχεία στα menu (εφόσον συσχετίζονται) πρέπει να παρουσιάζονται µε βάση Χρονική αλληλουχία (π.χ. σε ένα ηλεκτρονικό diary) Αριθµητική αλληλουχία (αύξουσα, φθίνουσα) Φυσικές Ιδιότητες (αύξουσα ή φθίνουσα ταξινόµηση µε βάση µέγεθος, βάρος, µήκος κλπ.) Για ασυσχέτιστα στοιχεία ταξινόµηση Αλφαβητική Συχνότητα χρήσης Σηµαντικότητα Πλεονεκτήµατα ο µικρός αριθµός πληκτρολογήσεων που απαιτούνται από τους χρήστες και συνεπώς ο µικρός αριθµός σφαλµάτων, οι µικρές απαιτήσεις µνηµονικού φορτίου χρήστη, η δυνατότητα που παρέχουν στον σχεδιαστή για καλή δόµηση των επιλογών και του διαλόγου του χρήστη. Μειονεκτήµατα η καθυστέρηση που συνεπάγεται η επιλογή µέσω µενού σε σχέση µε γλώσσες εντολών η κατανάλωση πολύτιµου χώρου οθόνης ιδίως σε περιπτώσεις σχοινοτενών υποµενού, η δυσκολία που παρουσιάζουν στην εισαγωγή δεδοµένων από τον χρήστη.

Στυλ Αλληλεπίδρασης = > Φόρµες Στυλ Αλληλεπίδρασης = > Φόρµες => Οδηγίες σχεδίασης Χρησιµοποιούνται βασικά για εισαγωγή και ανάκτηση δεδοµένων Μορφή: όπως οι έντυπες φόρµες Τα δεδοµένα εισάγονται σε προκαθορισµένα πεδία Απαιτεί: Πολύ καλή σχεδίαση Έλεγχος συµβατότητας ιδιοτήτων πεδίου και δεδοµένων που εισάγονται σε αυτό. Τα λογιστικά φύλλα είναι µια γενική µορφή φόρµας η οποία παρέχει µεγαλύτερη ελευθερία αλλά και δυνατότητες στο χρήστη Ο χρήστης πρέπει να είναι εξοικειωµένος µε: τη χρήση πληκτρολογίου χρήση του TAB key ή του mouse για κίνηση του cursor διόρθωση σφαλµάτων τις ετικέτες των πεδίων Επιτρεπτά περιεχόµενα στα πεδία Ο τίτλος κάθε φόρµας πρέπει να είναι σαφής και κατατοπιστικός Η προτροπή προς τον χρήστη πρέπει να είναι λιτή και περιεκτική, προσωπικός τόνος πρέπει να αποφεύγεται. Πληροφορίες για νέους και ευκαιριακούς χρήστες πρέπει να παρέχονται σε ξεχωριστές οθόνες µε εύκολη πρόσβαση. Λογική διάταξη πεδίων Κάλυψη οθόνης µε οµοιόµορφη πυκνότητα. Οµοιοµορφία στη σύνταξη των βοηθητικών φράσεων, µηνυµάτων σφάλµατος και στην ορολογία σε όλες τις οθόνες. Να γίνεται σαφές στους χρήστες το µέγεθος των πεδίων εισαγωγής Πρέπει να παρέχεται η δυνατότητα αλλαγών ή διόρθωσης σφαλµάτων Έγκαιρος έλεγχος εσφαλµένων τιµών. Πρέπει να αναφέρονται σαφώς τα προαιρετικά πεδία αν υπάρχουν Σαφής ένδειξη για την ολοκλήρωση. Στυλ Αλληλεπίδρασης = > Φόρµες => Πλεονεκτήµατα µειονεκτήµατα Στυλ Αλληλεπίδρασης = > Πλαίσια ιαλόγου Πλεονεκτήµατα Μεταφορά διαδικασίας συµπλήρωσης έντυπης φόρµας: απευθύνεται σε όλες τις κατηγορίες χρηστών και απαιτεί ελάχιστη εκπαίδευση. π.χ. εφαρµογές ιαδικτύου. δοµηµένη αλληλεπίδραση του χρήστη µε τον υπολογιστή δεν απαιτεί µνηµονικό φορτίο από τον χρήστη. ο χρήστης έχει εποπτεία µεγάλου τµήµατος της φόρµας που συµπληρώνει και συνεπώς αισθάνεται ότι ελέγχει την όλη διαδικασία. Μειονεκτήµατα η χαµηλή ταχύτητα απόκρισης, η µεγάλη απαίτηση για χώρο οθόνης, η µη καλή του προσαρµογή στην εκτέλεση εντολών απαιτεί την ύπαρξη µηχανισµού ελέγχου δροµέα στην οθόνη, που δεν υφίσταται σε πολλές µη-γραφικές διεπιφάνειες. Παράθυρα πληροφοριών τα οποία ενεργοποιούνται (pop up) για να πληροφορήσουν το χρήστη για ένα σηµαντικό γεγονός ή για να ζητήσουν επιπλέον πληροφορίες από το χρήστη: Για παράδειγµα κατά την αποθήκευση ενός αρχείου για πρώτη φορά ένα πλαίσιο διαλόγου ενεργοποιείται έτσι ώστε ο χρήστης να µπορεί να καθορίσει το όνοµα του αρχείου και τον κατάλογο στον οποίο θα αποθηκευτεί. Αποτελούν συνδυασµό φορµών και menu επιλογής Οι κανόνες σχεδίασης σχετίζονται µε τους αντίστοιχους της σχεδίασης φορµών Πρέπει να λαµβάνεται ειδική πρόνοια για την προδιάθεση του ανθρώπου προς ολισθήµατα

Στυλ Αλληλεπίδρασης = > Φυσική Γλώσσα Στυλ Αλληλεπίδρασης = > Φυσική Γλώσσα => Πλεονεκτήµατα µειονεκτήµατα Αλληλεπίδραση ανθρώπου υπολογιστή µέσω φυσικής γλώσσας ορίζεται ως ο χειρισµός υπολογιστών µε χρήση γλωσσών που χρησιµοποιούνται στην επικοινωνία µεταξύ ανθρώπων (π.χ. Αγγλικά). υνατές εφαρµογές: Υπαγόρευση κειµένου Υπαγόρευση εντολών µικρού ρεπερτορίου στον υπολογιστή Ανάκληση δεδοµένων από βάσεις δεδοµένων Ηλεκτρονικά παιχνίδια Πλεονεκτήµατα η φυσικότητα της, η ευελιξία του διαλόγου η υποστήριξη µεικτής πρωτοβουλίας, απαλλαγή από την εκµάθηση της σύνταξης µιας γλώσσας (περίπτωση εντολών) Μειονεκτήµατα η ασάφεια και η περιττολογία που χαρακτηρίζει την φυσική γλώσσα, οι τεχνικές δυσκολίες ανάπτυξης συστηµάτων Φυσικής Γλώσσας, συχνά απαιτείται επικοινωνία άλλης µορφής για διευκρινίσεις συχνά απαιτεί αρκετή πληκτρολόγηση Στυλ Αλληλεπίδρασης = > Απευθείας Χειρισµός Στυλ Αλληλεπίδρασης = > Απευθείας Χειρισµός => Πλεονεκτήµατα Τα αντικείµενα ενδιαφέροντος του χρήστη αναπαρίστανται στην οθόνη Οι ενέργειες του χρήστη πάνω στα αντικείµενα αυτά έχουν άµεσο αποτέλεσµα, είναι αυξητικού χαρακτήρα και είναι αντιστρεπτές Αντί για εντολές ο χρήστης χειρίζεται απευθείας τα αντικείµενα του ενδιαφέροντός του Η αποδοχή του απευθείας χειρισµού από τους χρήστες υπολογιστικών συστηµάτων και η διάδοση του υπήρξε µεγάλη και σήµερα είναι το κυρίαρχο στυλ αλληλεπίδρασης. immediate feedback direct manipulation in office: system Ο χρήστης αλληλεπιδρά µε ένα εικονικό κόσµο indirect manipulation in industry: Ο χρήστης αλληλεπιδρά µε τον πραγµατικό κόσµο µέσω µιας διεπιφάνειας χρήστη interface plant Η εκµάθηση γίνεται εύκολα, µέσω παραδειγµάτων χρήσης από πιο έµπειρους χρήστες, αφού ο χρήστης απαιτείται να αναγνωρίζει χειριστήρια αντί να θυµάται εντολές Παρέχεται η δυνατότητα στους έµπειρους χρήστες να ενεργούν γρήγορα εκτελώντας σύνθετες λειτουργίες Οι ευκαιριακοί χρήστες µπορούν να θυµούνται τη χρήση του συστήµατος Απαιτούνται ελάχιστα µηνύµατα σφάλµατος Το άµεσο αποτέλεσµα των ενεργειών, συνεπάγεται επιβεβαίωση της προόδου, ή έγκαιρη διάγνωση σφαλµάτων. Η αντιστρεψιµότητα των ενεργειών περιορίζει το άγχος για τις συνέπειες εσφαλµένων χειρισµών, Οι χρήστες έχουν εµπιστοσύνη στο σύστηµα αφού αισθάνονται υπό έλεγχο και σε θέση να προβλέψουν τα αποτελέσµατα των ενεργειών τους instruments

Στυλ Αλληλεπίδρασης = > Απευθείας Χειρισµός => Μειονεκτήµατα Στυλ Αλληλεπίδρασης = > Απευθείας Χειρισµός => Οδηγίες Σχεδιασµού υσκολία εικονικής αναπαράστασης αφηρηµένων ή σύνθετων εννοιών. Πολλά εικονικά σύµβολα δεν είναι εύκολο να γίνουν άµεσα κατανοητά Η έννοια που συνεπάγεται µια εικόνα διαφέρει ανάλογα µε το πολιτισµικό και γνωστικό υπόβαθρο του χρήστη, σε αντίθεση µε µια λέξη που είναι πιο σαφής. υσκολία αναπαράστασης σύνθετων εικόνων στον περιορισµένο χώρο της οθόνης του υπολογιστή. Ταχύτητα χειρισµών: οι πιο έµπειροι χρήστες πολλές φορές επιτυγχάνουν µεγαλύτερες ταχύτητες µέσω εντολών που πληκτρολογούν παρά µε χειρισµό εικονιδίων µέσω δεικτικών συσκευών Πρέπει να τηρούνται οι κανόνες δηµιουργίας σωστών ιδεατών µοντέλων στους χρήστες: Χρήση κατάλληλων µεταφορών Affordance: Τα αντικείµενα πρέπει να υπαινίσσονται τη χρήση τους (οπτικοί υπαινιγµοί, ακουστικοί υπαινιγµοί (χαρακτηριστικοί ήχοι), ακολουθίες υπαινιγµών) Περιορισµοί: Να τηρούνται οι φυσικοί - σηµασιολογικοί περιορισµοί που αφορούν τα αντικείµενα, Ταύτιση: Να υπάρχει σαφής αντιστοιχία µεταξύ χειριστηρίων-λειτουργιών, Αιτιατότητα Να παρέχεται ανάδραση ως προς την κατάσταση του συστήµατος όταν αυτή δεν γίνεται άµεσα αντιληπτή από το αποτέλεσµα του απευθείας χειρισµού. ιεπιφάνεια WIMP = > Η ιεπιφάνεια WIMP Παράθυρα (Windows) Windows Icons Menus Pointers ή Windows, Icons, Mice, and Pull-down menus Αποτελεί την εκ προοιµίου (default) επιλογή, όσον αφορά το στυλ αλληλεπίδρασης, για την πλειονότητα των διαδραστικών υπολογιστικών συστηµάτων και ειδικότερα των PCs. Περιοχές στην οθόνη οι οποίες συµπεριφέρονται ως ανεξάρτητες οντότητες: Περιέχουν κείµενο, εικόνες ή γραφικά Μπορούν να µετακινηθούν Μπορούν να αλλάξουν µέγεθος Μπορεί να επικαλύπτει το ένα το άλλο ή να παρατίθενται το ένα δίπλα στο άλλο (tiled) Μπάρες κύλισης (scrollbars) Επιτρέπουν στο χρήστη να έχει εικόνα στα περιεχόµενα του παραθύρου µετακινούµενος πάνω ή κάτω, δεξιά ή αριστερά Μπάρες τίτλου ίνουν το όνοµα του παραθύρου

ιεπιφάνεια WIMP = > Εικονίδια (Icons) ιεπιφάνεια WIMP = > είκτες (Pointers) Είναι µικρές εικόνες, σχήµατα ή φωτογραφίες: Αναπαριστούν αντικείµενα στη διεπιφάνεια Μπορούν να είναι παράθυρα κλειστά ή δυνατές ενέργειες (δράσεις) Υπάρχουν πολλά και διαφόρων ειδών σε µια διεπιφάνεια Αντιπροσωπεύουν ρεαλιστικές αναπαραστάσεις του φυσικού κόσµου µε βάση τη µεταφορά που έχει υιοθετηθεί στη διεπιφάνεια. Αποτελούν σηµαντικό στοιχείο της διεπιφάνειας WIMP δεδοµένου ότι αυτή στηρίζεται στη λογικής της υπόδειξης και επιλογής αντικειµένων. Επιλογές και υποδείξεις µπορούν να γίνουν µε οποιαδήποτε δεικτική συσκευή Υπάρχει µεγάλη ποικιλία συµβολισµών για τους δείκτες καθώς και πλήθος παραλλαγών όσον αφορά το σχήµα τους ανάλογα µε την εκτελούµενη δράση (αλλαγή µεγέθους παραθύρου, σύρσιµο αντικειµένου κλπ.)