Ορισμός μοντέλου πλοήγησης  Τα μοντέλα πλοήγησης απαντούν στο ερώτημα με ποιο τρόπο θα κινείται ο χρήστης ανάμεσα σε διαφορετικές οθόνες του συστήματος.

Slides:



Advertisements
Παρόμοιες παρουσιάσεις
Γραφήματα & Επίπεδα Γραφήματα
Advertisements

Δημιουργία μαθησιακού υλικού πολυμέσων και υπερμέσων
Διακρατική συνάντηση EQUAL Σάμος, 25 – 26 Σεπτεμβρίου 2003
Επιμορφωτής: Ονομ/νυμο Επιμορφωτή
ΔΗΜΙΟΥΡΓΙΑ ΜΑΘΗΣΙΑΚΟΥ ΥΛΙΚΟΥ ΠΟΛΥΜΕΣΩΝ ΚΑΙ ΥΠΕΡΜΕΣΩΝ Γνωριμία με τα πολυμέσα στα πλαίσια της διδασκαλίας και της μάθησης.
Εκπαιδευτικό υλικό Φωτογραφικές μηχανές και φωτογραφίες: Επεξεργασία φιλμ Επίπεδο γνώσεων: Προχωρημένοι χρήστες.
ΜοντελοποίησηΈργα ΜαθήματαΑξιολόγηση Αναστοχασμος Μαθήματα.
Copyright ©: SAMSUNG & Samsung Hope for Youth. Με επιφύλαξη κάθε νόμιμου δικαιώματος Εκπαιδευτικό υλικό Λογισμικό: Δημιουργία εφαρμογών Επίπεδο.
7.5.2 Αντικειμενοστραφής προγραμματισμός
Αξιολόγηση Προγράμματος Assessment and Evaluation 1Polina Stavrou Athens 29/11/2012.
Ανάπτυξη Διαδραστικών Συστημάτων
ΕΠΛ 435: Αλληλεπίδραση Ανθρώπου Υπολογιστή
Διαχείριση Έργου Οργάνωση, σχεδιασμός και προγραμματισμός έργων ανάπτυξης λογισμικού.
-Στοίβα-Ουρά - Πλεονεκτήματα πινάκων -Δομές δεδομένων δευτερεύουσας μνήμης -Πληροφορική και δεδομένα -Παραδείγματα-Προβλήματα ψευδοκώδικα.
Κεφάλαιο 1ο: ΒΑΣΙΚΕΣ ΕΝΝΟΙΕΣ ΤΩΝ ΛΕΙΤΟΥΡΓΙΚΩΝ ΣΥΣΤΗΜΑΤΩΝ
Χαρακτηριστικά συνθετικής κίνησης 1 Ελληνογαλλική Σχολή Καλαμαρί - Τίκβα Χριστίνα.
Τεχνολογία ΛογισμικούSlide 1 Τυπική Εξειδίκευση u Τεχνικές για σαφή εξειδίκευση λογισμικού.
Σελ. 1 Ε.2.2 Υπηρεσίες – Λειτουργία Helpdesk Καταχώρηση και παρακολούθηση αιτημάτων μέσω web Ε Καταχώρηση αιτημάτων υποστήριξης.
Οδηγίες Σχεδίασης Διαδραστικών Συστημάτων
Λογισμικο συστηματοσ Κεφάλαιο 4ο
ΕΠΛ 435: Αλληλεπίδραση Ανθρώπου Υπολογιστή
Εκτέλεση Αλγορίθμων σε ψευδογλώσσα
Μεθοδολογίες και Εργαλεία Ανάλυσης και Σχεδιασμού Π.Σ. Σπύρος Κοκολάκης ΠΑΝΕΠΙΣΤΗΜΙΟ ΑΙΓΑΙΟΥ ΤΜΗΜΑ ΜΗΧΑΝΙΚΩΝ ΠΛΗΡΟΦΟΡΙΑΚΩΝ ΚΑΙ ΕΠΙΚΟΙΝΩΝΙΑΚΩΝ.
Πτυχιακή εργασία των Κωνσταντίνου Κουρμούση (1604)
HMMY Τεχνολογία Λογισμικού Διδάσκων Κώστας Κοντογιάννης Αναπλ
Ανάλυση του λευκού φωτός και χρώματα
Copyright ©: SAMSUNG & Samsung Hope for Youth. Με επιφύλαξη κάθε νόμιμου δικαιώματος Εκπαιδευτικό υλικό Το Internet: Σύνδεση online Επίπεδο γνώσεων:
Εικονική πραγματικότητα ένας τρισδιάστατος κόσμος!!!
Κεφάλαιο 2ο Πεπερασμένα αυτόματα.
IT-SKILLS Διάλεξη Παρουσιάσεις (PowerPoint)
ΕΚΠΑΙΔΕΥΤΙΚΗ ΠΡΟΣΕΓΓΙΣΗ ΤΗΣ ΕΥΡΥΤΕΡΗΣ ΕΝΝΟΙΑΣ ΤΟΥ ΑΛΓΟΡΙΘΜΟΥ ΧΡΗΣΙΜΟΠΟΙΩΝΤΑΣ ΔΙΑΦΟΡΕΤΙΚΟ ΛΟΓΙΣΜΙΚΟ ΓΙΑ ΚΑΘΕ ΠΤΥΧΗ ΤΟΥ Κάππας Κων/νος Επιμορφωτής ΤΠΕ -
ΑΠΕΙΚΟΝΙΣΗ ΕΝΝΟΙΩΝ 1. 2 Χρήστης Στόχος Ταμίας διενέργεια πώλησης διενέργεια ενοικίασης εισαγωγή ταμείου εξαγωγή ταμείου * 1 Μοντέλο Πεδίου Προβλήματος.
Προγραμματισμός ΙΙ Διάλεξη #6: Απλές Δομές Ελέγχου Δρ. Νικ. Λιόλιος.
Center for Collaboration and Exchange (cce): Ένα εργαλείο για την υποστήριξη κοινοτήτων δράσης Χ. Κυνηγός, Ε. Τρούκη, Ν. Γιαννούτσου, Μ. Φουντάνα, Τ. Αθανασίου.
ΑΡΧΙΤΕΚΤΟΝΙΚΗ & ΟΡΓΑΝΩΣΗ ΥΠΟΛΟΓΙΣΤΩΝ Κεφάλαιο 1 Εισαγωγή
Ενιαίο Πλαίσιο Προγράμματος Σπουδών Πληροφορικής.
Για τη διδασκαλία των πολυμέσων 1/15 ΛΟΓΙΣΜΙΚΟ ΑΝΑΠΤΥΞΗΣ ΕΦΑΡΜΟΓΩΝ ΠΟΛΥΜΕΣΩΝ Ομάδα Ανάπτυξης Ομάδα Ανάπτυξης: Φίλιππος Δεληγιάννης, Παναγιώτης Κωστάκης,
Τεχνολογία ΛογισμικούSlide 1 Αλγεβρική Εξειδίκευση u Καθορισμός τύπων αφαίρεσης σε όρους σχέσεων μεταξύ τύπων λειτουργιών.
Συνδυαστικά Κυκλώματα
Μοντέλα Συστημάτων Παρουσιάσεις των συστημάτων των οποίων οι απαιτήσεις αναλύονται.
Προγραμματισμός ΙΙ Διάλεξη #5: Εντολές Ανάθεσης Εντολές Συνθήκης Δρ. Νικ. Λιόλιος.
1 Τμήμα Μηχανικών Ηλεκτρονικών Υπολογιστών και Πληροφορικής Πανεπιστήμιο Πατρών ΟΝΤΟΚΕΝΤΡΙΚΟΣ ΠΡΟΓΡΑΜΜΑΤΙΣΜΟΣ ΙΙ (C++) Κληρονομικότητα.
Ανάπτυξη Πρωτοτύπου Λογισμικού
Δομές Δεδομένων (Data Structures) 3o Εξάμηνο Σπουδών Διδάσκων: Απόστολος Παπαδόπουλος και
3 / 4 / 2002 μοντέλα ανάλυσης ενεργειών χρήστη
Επικοινωνία Ανθρώπου Μηχανής HTML CGI JAVASCRIPT Κουμπούλης Χρήστος Α.Μ. 921 Χαλαβαζής Βασίλης Α.Μ. 988.
Δέσποινα Μαγγίνα M1175 Κωνσταντίνος Γαργάνης Μ1172 Δήμητρα Μαρία Χαρακλιά Μ1206 Ιωάννης Παπαδάκης Μ1171 Αλέξανδρος Νικολόπουλος Μ1182 Δημήτριος Μπαϊρακτάρης.
Διδακτική της Πληροφορικής ΗΥ302 Εργασία :Παρουσίαση σχολικού βιβλίου Γ’ Λυκείου Τεχνολογικής Κατεύθυνσης «Ανάπτυξη εφαρμογών σε προγραμματιστικό περιβάλλον»
Βάσεις Δεδομένων Εργαστήριο ΙΙ Τμήμα Πληροφορικής ΑΠΘ
ΑΞΙΟΛΟΓΗΣΗ ΕΚΠΑΙΔΕΥΤΙΚΟΥ ΛΟΓΙΣΜΙΚΟΥ  Επιμορφωτής:
Ανάλυση Συστημάτων ( site) Υπευθ. Καθηγ.: Τσαλγατίδου Αφροδίτη.
ΘΕΜΑΤΙΚΗ ΕΝΟΤΗΤΑ 2: ΘΕΜΑΤΑ ΘΕΩΡΗΤΙΚΗΣ ΕΠΙΣΤΗΜΗΣ Η/Υ
ΣΧΕΔΙΑΣΗ & ΑΞΙΟΛΟΓΗΣΗ ΕΚΠΑΙΔΕΥΤΙΚΟΥ ΛΟΓΙΣΜΙΚΟΥ ΣΤ. ΔΗΜΗΤΡΙΑΔΗΣ – ΘΡ. ΤΣΙΑΤΣΟΣ Θέματα Σχεδίασης Μέρος 2ο Χρηστοκεντρική & Συμμετοχική Σχεδίαση.
Σχεδιομελέτη προϊόντων με τη χρήση Η/Υ
Τεχνολογία ΛογισμικούSlide 1 Τεχνολογία Απαιτήσεων u Καθορίζει τι θέλει ο πελάτης από ένα σύστημα λογισμικού.
ΕΝΟΤΗΤΑ 2 – Κεφάλαιο 5: Γνωριμία με το Λογισμικό
Ορισμός Έργου Δρ. Α. Ραφαηλίδης Τμ. Διοίκησης Επιχειρήσεων (Πάτρα) ΤΕΙ Δυτ. Ελλάδας.
Αρχές Τεχνολογίας Λογισμικού Εργαστήριο 1: Εισαγωγή.
Τα καινοτόμα χαρακτηριστικά του Διαδικτύου και η ευρεία του αποδοχή από τις νεαρές ηλικίες καλλιέργησαν την ιδέα της αξιοποίησής του ως ένα εργαλείο στην.
Χειρισμός Χρόνου και Μεθοδολογίες Προσομοίωσης
Θέματα Σχεδίασης ΕΛ Πληροφορική και Εκπαίδευση 2005
Wikis Ο Cunningham εμπνεύστηκε τον όρο wiki από τα "wiki wiki", δηλαδή τα "γρήγορα" λεωφορεία πυκνών δρομολογίων στον αερολιμένα της Χονολουλού.
ΤΜΗΜΑ ΜΗΧΑΝΙΚΩΝ ΠΛΗΡΟΦΟΡΙΚΗΣ Τ.Ε.
ΣΧΕΔΙΑΣΗ ΕΚΠΑΙΔΕΥΤΙΚΟΥ ΛΟΓΙΣΜΙΚΟΥ
Activity Diagrams.
Πληροφοριακό σύστημα Πληροφοριακό Σύστημα μιας επιχείρησης/οργανισμού είναι ένα σύστημα που αποτελείται από ανθρώπους, διαδικασίες και εξοπλισμό (Υλικό,
Εννοιολογική Χαρτογράφηση
Φόρμες Φόρμες χρησιμοποιούνται για να δημιουργήσουμε ένα φιλικό περιβάλλον για την διαχείριση των δεδομένων της βάσης. Επίσης δίνεται η δυνατότητα δημιουργίας.
Σκοπός Η συνοπτική παρουσίαση
Μεταγράφημα παρουσίασης:

Ορισμός μοντέλου πλοήγησης  Τα μοντέλα πλοήγησης απαντούν στο ερώτημα με ποιο τρόπο θα κινείται ο χρήστης ανάμεσα σε διαφορετικές οθόνες του συστήματος  Από την πλευρά του σχεδιαστή το μοντέλο πλοήγησης λειτουργεί ως «Πίνακας Περιεχομένων» 1 14/10/2014Τμήμα Πληροφορικής

 Πόσο σημαντικό είναι ο χρήστης να ακολουθήσει μια συγκεκριμένη διαδρομή από οθόνες;  Γραμμική πλοήγηση (κατάλληλο για αρχάριους και ευκαιριακούς χρήστες)  Δενδροειδής ή ιεραρχική πλοήγηση (κατάλληλη για σύνθετες εργασίες που μπορούν να αναλυθούν σε αυτόνομες υπο- εργασίες)  Χαοτική πλοήγηση (κατάλληλη για πεπειραμένους χρήστες με υψηλό βαθμό κατανόησης τόσο των εργασιών που επιτελούνται όσο και της ίδιας της διεπιφάνειας)  Πόσο αυτόνομες είναι οι εργασίες που υποστηρίζονται από τη διεπιφάνεια  Πόσο σημαντικό είναι ο χρήστης να γνωρίζει σε ποια από τις οθόνες τις διεπιφάνειας βρίσκεται;  Χρήση ή όχι χάρτη προσανατολισμού (site map) 14/10/ Για τον ορισμό του μοντέλου πλοήγησης πρέπει να διερευνηθούν οι επόμενες ερωτήσεις: Τμήμα Πληροφορικής

14/10/ Τμήμα Πληροφορικής

Παράδειγμα 4 14/10/2014Τμήμα Πληροφορικής

Επιλογή κυρίαρχης μεταφοράς  Η κυρίαρχη μεταφορά έχει νόημα εφόσον έχει επιλεγεί το στυλ αλληλεπίδρασης απευθείας χειρισμός  Αν έχει επιλεγεί στυλ αλληλεπίδρασης «φόρμες εισαγωγής στοιχείων» η «μενού επιλογών» η κυρίαρχη μεταφορά είναι προφανής:  Η επιλογή της κυρίαρχης μεταφοράς σε πολλές περιπτώσεις υποδεικνύεται από το αντίστοιχο φυσικό σύστημα:  Διαδικτυακό τηλέφωνο => κυρίαρχη μεταφορά τηλεφωνική συσκευή  Διαδικτυακό μάθημα => κυρίαρχη μεταφορά βιβλίο  Εντούτοις η επιλογή της κυρίαρχης μεταφοράς στην πλειονότητα των περιπτώσεων δεν είναι εύκολη:  Επιλογή θέσεων στο θέατρο ή κινηματογράφο => Γραφική απεικόνιση της φυσικής διάταξης θέσεων  Online ανθοπωλείο => ? (κατάλογος;)  Online ενοικίαση DVD => ? (κατάλογος ή αναζήτηση;) 5 14/10/2014Τμήμα Πληροφορικής

Ορισμός βασικών οθονών Οθόνη εισόδου ▫ Καλωσόρισμα χρήστη ▫ Ποιοι είμαστε ▫ Συνοπτική επεξήγηση συστήματος ▫ Ρυθμίσεις (γλώσσα επικοινωνίας, αλλαγή στοιχείων χρήστη, χρήση βοήθειας κλπ.) ▫ Σημαντικές ανακοινώσεις ▫ Εισήγηση επόμενης δράσης από το χρήστη ▫ Login Κεντρική οθόνη (home): ▫ Βασικό σημείο διακλάδωσης προς τις άλλες βασικές οθόνες (μέσω επιλογών προς αυτές) ▫ Επιστροφή σε αυτήν μετά από πάροδο συγκεκριμένου (ανενεργού) χρονικού διαστήματος ▫ Δυνατότητα επιστροφής σε αυτή από κάθε άλλη βασική οθόνη με μια μόνο επιλογή Βασικές οθόνες: ▫ Αντιπροσωπεύουν τις κύριες εργασίες που πρέπει να επιτελούνται από το σύστημα π.χ. αναζήτηση, περιδιάβασμα καταλόγου, πληροφορίες για τον χρήστη κλπ. ▫ Δεδομένης της ανθρωποκεντρικής σχεδίασης καλό είναι οι βασικές οθόνες να αντιπροσωπεύουν τις εργασίες που επιτελεί συχνά ο χρήστης και όχι εργασίες που έχουν να κάνουν με το σύστημα (π.χ. Ο χρήστης σπάνια θα χρησιμοποιήσει το ATM με βασικό στόχο την αλλαγή PIN) 6 14/10/2014Τμήμα Πληροφορικής

Το User-Centered Design or not to User- Centered Design ? Why user-centered design is important Prototyping and user centered design Prototyping methods 7 14/10/2014Τμήμα Πληροφορικής

System Centered Design What can I easily build on this platform? What can I create from the available tools? What do I as a programmer find interesting? 8 14/10/2014Τμήμα Πληροφορικής

User Centered System Design  Design is based upon a user’s  abilities and real needs  context  work  tasks  need for usable and useful product Golden rule of interface design: Know The User 9 14/10/2014Τμήμα Πληροφορικής

User Centered System Design ... is based on understanding the domain of work or play in which people are engaged and in which they interact with computers… From Denning and Dargan, p111 in Winograd, Ed., Bringing Design to Software, Addison Wesley Denning and Dargan, 1996 Assumptions –The result of a good design is a satisfied customer –The process of design is a collaboration between designers and customers. The design evolves and adapts to their changing concerns, and the process produces a specification as an important byproduct –The customer and designer are in constant communication during the entire process 10 14/10/2014Τμήμα Πληροφορικής

Participatory Design  Why need to meet Users? (Problem)  intuitions wrong  interviews etc not precise  designer cannot know the user sufficiently well to answer all issues that come up during the design  … The user is just like me Solution –designers should have access to representative users END users, not their managers or union reps! 11 14/10/2014Τμήμα Πληροφορικής

Participatory Design  Users are 1 st class members in the design process  active collaborators Vs passive participants  Users considered subject matter experts  know all about the work context  Iterative process  all design stages subject to revision 12 14/10/2014Τμήμα Πληροφορικής

Participatory Design  Up side  users are excellent at reacting to suggested system designs  designs must be concrete and visible  users bring in important “folk” knowledge of work context  knowledge may be otherwise inaccessible to design team  … Down side –hard to get a good pool of end users expensive, reluctance... –users are not expert designers don’t expect them to come up with design ideas from scratch –the user is not always right don’t expect them to know what they want 13 14/10/2014Τμήμα Πληροφορικής

Methods for involving the user  At the very least, talk to users  surprising how many designers don’t!  Contextual interviews + site visits  interview users in their workplace, as they are doing their job  discover user’s culture, requirements, expectations,… 14 14/10/2014Τμήμα Πληροφορικής

Methods for involving the user  Explain designs  describe what you’re going to do  get input at all design stages  all designs subject to revision  Important to have visuals and/or demos  people react far differently with verbal explanations  this is why prototypes are critical 15 14/10/2014Τμήμα Πληροφορικής

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

Μεθοδολογία LUCID (Logical User-Centred Interactive Design)  Φάση 1: Ανάπτυξη αρχικής ιδέας του συστήματος  Φάση 2. Ανάλυση αναγκών και απαιτήσεων  Φάση 3. Σχεδιασμός προϊόντος με πρότυπη βασική οθόνη  Φάση 4. Επαναληπτικός σχεδιασμός και βελτίωση πρωτοτύπου  Φάση 5. Ανάπτυξη συστήματος  Φάση 6. Υποστήριξη αρχικής λειτουργίας (από: 14/10/ Τμήμα Πληροφορικής

Εισαγωγή 18 what is wanted analysis design implement and deploy prototype interviews ethnography what is there vs. what is wanted guidelines principles dialogue notations precise specification architectures documentation help evaluation heuristics scenarios task analysis 14/10/2014Τμήμα Πληροφορικής

Ερώτηση  Δεν θα ήταν σημαντικό να ανακαλύψετε τι θέλουν οι χρήστες σας, πριν να ξεκινήσετε την επίπονη διαδικασία της συγγραφής του κώδικα;  Η πρωτοτυποποίηση σε χαρτί σας επιτρέπει να κάνετε ακριβώς αυτό. Ενώ μπορεί να φανεί σε κάποιον αντιφατικό να δοκιμάσει μια διεπιφάνεια χρήσης χωρίς τη χρήση υπολογιστή, η προτυποποίηση σε χαρτί είναι μια ενδεδειγμένη μέθοδος η οποία σας επιτρέπει να έχετε τη μέγιστη ανάδραση από τους χρήστες σας με ελάχιστο κόστος ανάπτυξης. 14/10/ Τμήμα Πληροφορικής

Πρωτοτυποποίηση  Σκοπός: μοντελοποίηση του τελικού συστήματος, καθιστώντας δυνατή την εξέταση των χαρακτηριστικών του, ακόμα και όταν αυτό δεν έχει ολοκληρωθεί.  Πότε: σε οποιοδήποτε στάδιο της διαδικασίας ανάπτυξης. Είναι δυνατό να εφαρμοστεί μια επαναληπτική, εξελικτική προσέγγιση στην πρωτοτυποποίηση, ώστε να αναπτύσσονται πρωτότυπα με όλο και περισσότερη λειτουργικότητα και πιστότητα στο τελικό σύστημα. 14/10/ Τμήμα Πληροφορικής

Πρωτοτυποποίηση ▫ Είναι λειτουργικά ημιτελής ▫ Δεν καλύπτει ολόκληρο το σύστημα ▫ Υστερεί σε επιδόσεις από το τελικό σύστημα Τα πρωτότυπα είναι γνωστά και ως “design mockup” (τεχνικά ομοιώματα σχεδίασης) Σε άλλα πεδία πρωτότυπο είναι ένα μοντέλο μικρής κλίμακας του τελικού συστήματος: ▫ Ένα αυτοκίνητο μινιατούρα ▫ Μια πόλη από σπίτια, δρόμους, γέφυρες και αυτοκίνητα μινιατούρες Τα πρωτότυπα αποτελούν βασικά συστατικά στοιχεία της επαναληπτικής σχεδίασης (iterative) που έχουν στόχο την ενεργοποίηση των χρηστών κατά τη διαδικασία σχεδίασης – ανάπτυξης του συστήματος /10/2014Τμήμα Πληροφορικής

Γιατί χρειαζόμαστε πρωτότυπα;  Για να πάρουμε πληροφορίες ανάδρασης (feedback) σχετικά με τη σχεδίαση μας νωρίτερα  Κέρδος σε χρόνο και χρήμα  Οι χρήστες και άλλοι ενδιαφερόμενοι μπορούν ευκολότερα να δουν, κρατήσουν και να αλληλεπιδράσουν με ένα πρωτότυπο παρά με ένα κείμενο ή ένα σχεδιάγραμμα.  Σταδιακή εξοικείωση με το σύστημα των χρηστών 22 14/10/2014Τμήμα Πληροφορικής

Γιατί χρειαζόμαστε πρωτότυπα;  Επιτρέπουν τον πειραματισμό με εναλλακτικές σχεδιάσεις  Η αξιολόγηση εναλλακτικών σχεδιάσεων μέσω των πρωτοτύπων τους επιτρέπει την απόρριψη αρκετών από αυτές από τα αρχικά στάδια της σχεδίασης  Διορθώνονται λάθη πριν την ανάπτυξη σε επίπεδο κώδικα ή υλικού  Η χρήση πρωτοτύπων διατηρεί τη σχεδίαση ανθρωποκεντρική στην οποία η αξιολόγηση και η ανάδραση είναι κεφαλαιώδους σημασίας  Επιτρέπουν στα μέλη της ομάδας σχεδιασμού να ομιλούν επάνω σε μια κοινή βάση 23 14/10/2014Τμήμα Πληροφορικής

Κατηγορίες πρωτοτύπων  Με βάση την πιστότητα  Χαμηλής πιστότητας (low fidelity)  Ενδιάμεσης πιστότητας (medium fidelity)  Yψηλής πιστότητας (high fidelity)  Με βάση τις υποστηριζόμενες λειτουργίες  Οριζόντια  Κάθετα  Με βάση τον τρόπο ενσωμάτωσης τους στο τελικό σύστημα  Αναλώσιμα (throw-away)  Αυξητικά (incremental)  Εξελικτικά (evolutionary) 24 14/10/2014Τμήμα Πληροφορικής

Ενσωμάτωση στο τελικό σύστημα Αναλώσιμα (throw-away) ▫ Το πρωτότυπο έχει στόχο απλά να εκμαιεύσει την αντίδραση των χρηστών ▫ Το πρωτότυπο πρέπει να δημιουργείται γρήγορα και σχετικά ανέξοδα αλλιώς επιβαρύνεται το τελικό κόστος του συστήματος Αυξητικά (incremental) ▫ Το τελικό σύστημα αναπτύσσεται ως ένα σύνολο από ανεξάρτητα τμήματα (modules) ▫ Κάθε τμήμα πρωτοτυποποιείται, ελέγχεται και στη συνέχεια προστίθεται στο τελικό σύστημα ▫ Είναι χρήσιμη και αποτελεσματική μέθοδος όταν οι διάφορες εργασίες που υποστηρίζονται από τη διεπιφάνεια είναι από τη φύση τους ανεξάρτητες μεταξύ τους Εξελικτικά (evolutionary) ▫ Το πρωτότυπο βελτιώνεται σταδιακά έως ότου καταλήξει στο τελικό σύστημα ▫ Οι αλλαγές στη σχεδίαση προκύπτουν από την ανάλυση απαιτήσεων χρηστών και τα διάφορα στάδια αξιολόγησης 25 14/10/2014Τμήμα Πληροφορικής

Υποστηριζόμενες λειτουργίες Οριζόντια ▫ Πρωτοτυποποιείται ολόκληρη η διεπιφάνεια χωρίς στην ουσία να υπάρχει καμία λειτουργικότητα ▫ Δίνει την συνολική εικόνα της διεπιφάνειας και είναι πολύ σημαντική στο ανθρωποκεντρικό σχεδιασμό Κάθετα ▫ Περιλαμβάνουν σχεδόν πλήρη λειτουργικότητα για επιλεγμένες εργασίες / χαρακτηριστικά ▫ Τα χαρακτηριστικά που πρωτοτυποποιούνται με αυτό τον τρόπο είναι συνήθως κοινές λειτουργίες της διεπιφάνειας (π.χ. λειτουργίες σε σχέση με διαχείριση αρχείων: open, save, …)  Εργασίες και σενάρια που σχετίζονται με τα παραπάνω χαρακτηριστικά μπορούν να ελεγχθούν εξονυχιστικά 26 14/10/2014Τμήμα Πληροφορικής

Οριζόντια και Κάθετα Πρωτότυπα (Συνδυασμός) 27 14/10/2014Τμήμα Πληροφορικής

Πιστότητα και πρωτοτυποποίηση Η πιστότητα (fidelity) αναφέρεται στο βαθμό λεπτομέρειας του πρωτοτύπου Υψηλή πιστότητα ▫ Τα πρωτότυπα ομοιάζουν με το τελικό σύστημα ▫ Είναι πλήρως διαδραστικά Ενδιάμεση πιστότητα ▫ Είναι κατασκευασμένα από κάποιο λογισμικό πρωτοτυποποίησης όπως Visual Basic, Smaltalk κλπ. ή από σχεδιαστικά πακέτα λογισμικού (Photoshop, Visio κλπ.) ▫ Είναι διαδραστικά όσον αφορά την διεπιφάνεια (πλοήγηση, διάλογοι, μηνύματα, βοήθεια) αλλά όχι όσον αφορά τη λειτουργικότητα 28 14/10/2014Τμήμα Πληροφορικής

Χαμηλή πιστότητα ▫ Είναι κατά βάση πρωτότυπα σε χαρτί με μειωμένη ή μηδενική διαδραστικότητα ▫ Στοχεύουν στην διερεύνηση εναλλακτικών σχεδιάσεων από τις αρχικές φάσεις σχεδίασης Υψηλή ή χαμηλή πιστότητα; ▫ Εξαρτάται … 14/10/ Πιστότητα και πρωτοτυποποίηση Τμήμα Πληροφορικής

Χαμηλή πιστότητα  Χρησιμοποιούνται μέσα αναπαράστασης τα οποία είναι διαφορετικά από το τελικό μέσο που θα χρησιμοποιηθεί στο σύστημα: χαρτί, κάρτες, εκτύπωση οθονών συστήματος κλπ.  Δημιουργούνται γρήγορα, κοστίζουν λίγο, αλλάζουν εύκολα και ενεργοποιούν τη φαντασία ως προς τη χρήση  Στόχοι  Συζήτηση και αξιολόγηση εναλλακτικών σχεδιάσεων  Εκμαίευση αντιδράσεων χρηστών  Εκμαίευση τροποποιήσεων / εισηγήσεων χρηστών  Παραδείγματα:  Σκαριφήματα (sketches of screens)  Κάρτες (cardboard)  Σειρά από σκηνές κινουμένων σχεδίων (storyboard) 30 14/10/2014Τμήμα Πληροφορικής

Πρωτοτυποποίηση σε χαρτί 14/10/ Τμήμα Πληροφορικής

Διαδικασία εφαρμογής  Πρέπει πρώτα να έχετε καταγράψει με σαφήνεια τις απαιτήσεις των χρηστών (συνήθως αναπαρίστανται με use case diagrams που μάθατε στο μάθημα της τεχνολογίας λογισμικού) που θέλουν να ολοκληρώσουν μέσα από το σύστημα.  Στη συνέχεια, φτιάχνεται στιγμιότυπα οθονών σκιαγραφώντας σχέδια που σχετίζονται με όλες τις πτυχές τις αλληλεπίδρασης όπως μενού, παράθυρα διαλόγου, σελίδες, popup μηνυμάτων, κλπ. που απαιτούνται για να την ολοκλήρωση κάθε στόχου του χρήστη. 14/10/ Τμήμα Πληροφορικής

Διαδικασία εφαρμογής (2)  Στη συνέχεια ελέγχουμε την χρηστικότητα των σχεδίων μας στα πλαίσια πειραματικής διάταξης στην οποία ένας ή δύο προγραμματιστές παίζουν το ρόλο του "υπολογιστή", προσομοιώνοντας την λειτουργία του συστήματος, αντικαθιστώντας κομμάτια των σχεδίων ανάλογα με τις επιλογές του χρήστη.  Οι χρήστες (που πρέπει να είναι αντιπροσωπευτικοί) εκτελούν συγκεκριμένες εργασίας αλληλεπιδρώντας άμεσα με το πρωτότυπο - "κλικ" αγγίζοντας το κουμπιά στο πρωτότυπο ή συνδέσμους και "τύπος" γράφοντας τα στοιχεία τους σε πεδία επεξεργασίας του πρωτοτύπου του. (Χρησιμοποιώντας μια διαφάνεια ή αφαιρούμενη ταινία μπορούμε να χρησιμοποιούμε τα πρωτότυπα με πολλαπλούς χρήστες μιας και αποφεύγουμε την εγγραφή πάνω του.) 14/10/ Τμήμα Πληροφορικής

Πότε και γιατί εφαρμόζεται η πρωτοτυποποίηση σε χαρτί (1/2);  Ορολογία: Καταλαβαίνουν οι χρήστες σας τους όρους και την ορολογία που έχετε επιλέξει; Υπάρχουν βασικά έννοιες που παρερμηνεύονται ή δεν είναι κατανοητές από τους χρήστες σας;  Πλοήγηση / ροή αλληλεπίδρασης: Υπάρχει κάποια αλληλουχία ή σειρά βημάτων που απαιτούνται για την ολοκλήρωση μιας εργασίας και δεν είναι κατανοητή από τους χρήστες; Μήπως οι χρήστες μου πλοηγούνται ανεξέλεγκτα για την ολοκλήρωση μιας εργασίας; 14/10/ Τμήμα Πληροφορικής

Πότε και γιατί εφαρμόζεται η πρωτοτυποποίηση σε χαρτί (2/2);  Περιεχόμενο: Παρέχεται στους χρήστες τις απαιτούμενες πληροφορίες με σκοπό να μπορέσουν να ολοκληρώσουν τις διεργασίες τους; Μήπως υπάρχουν περαιτέρω πληροφορίες που δεν χρειάζονται στον χρήστη και του αποσπούν την προσοχή;  Λειτουργικότητα: Υπάρχουν λειτουργικότητες που απουσιάζουν από την σχεδίασή σας, ή μήπως υπάρχουν λειτουργικότητες που δεν τις χρειάζονται οι χρήστες σας. 14/10/ Τμήμα Πληροφορικής

Πότε δεν ενδύκνυται  Η πρωτοτυποποίηση σε χαρτί δεν ενδείκνυται για τις παρακάτω διερευνητικού τύπου περιστάσεις:  αρτιότητα υλοποίησης,  χρόνο απόκρισης λογισμικού,  χρήση scroll bars,  αισθητική εμφάνιση (visual design & aesthetics). 14/10/ Τμήμα Πληροφορικής

Πρωτότυπα από χαρτί Paper prototype of typical forms-filling screen Paper prototype of a tabs-based design source: /10/2014Τμήμα Πληροφορικής

Πρωτότυπα από χαρτί User test of a high-fidelity paper prototype of a homepage Testing hardware user interfaces: mockup of a kiosk 38 14/10/2014Τμήμα Πληροφορικής

Πιστότητα πρωτοτύπου και φάση σχεδίασης Αρχικές φάσεις σχεδίασης Τελική φάση σχεδίασης Σχεδίαση εναλλακτικών επιλογών Επιλογή μιας από τις διαφορετικές προσεγγίσεις Χονδροειδής καθορισμός διεπιφάνειας Low fidelity paper prototypes Περιδιάβασμα διεργασιών και σεναρίων και επανασχεδίαση Λεπτομερής καθορισμός διεπιφάνειας, σχεδίαση οθονών Ευρετική αξιολόγηση και επανασχεδίαση Αξιολόγηση ευχρηστίας και επανασχεδίαση Medium fidelity prototypes Limited field testing Alpha/Beta tests High fidelity prototypes Working systems 14/10/201439Τμήμα Πληροφορικής

Storyboarding (I) Αποτελούν μια σειρά από αντιπροσωπευτικές οθόνες: Προέρχονται από τη λογική της σκηνοθεσίας στον κινηματογράφο Οι οθόνες αντιπροσωπεύουν σημαντικά χρονικά σημεία στην αλληλεπίδραση ανθρώπου -συστήματος Χρησιμοποιούνται για την οπτικοποίηση σεναρίων χρήσης με στόχο την αποσαφήνιση των: Διαδοχής υποεργασιών Ροής πληροφορίας Ενεργειών χρήστη Χρησιμοποιούνται σχετικά νωρίς στη σχεδίαση και συνήθως αμέσως μετά την καταγραφή των βασικών εργασιών και την ανάπτυξη σεναρίων χρήσης 14/10/ Τμήμα Πληροφορικής

Storyboard of a computer telephone Computer Telephone Last Name: First Name: Phone: Place CallHelp Help-> Computer Telephone Last Name: Greenberg First Name: Phone: Place CallHelp Dialling.... Cancel Call connected... Computer Telephone Last Name: Greenberg First Name: Phone: Place CallHelp Connected Hang up Call completed... Return Help Screen You can enter either the person's name or their number. Then hit the place button to call them Call by name-> Computer Telephone Last Name: Greenberg First Name: Phone: Place CallHelp Establishing connection-> Computer Telephone Last Name: First Name: Phone: Place CallHelp 14/10/ Τμήμα Πληροφορικής

Ενδιάμεση πιστότητα  Πρωτοτυποποίηση με χρήση υπολογιστή:  Χρήση λογισμικού πρωτοτυποποίησης όπως Visual Basic, Smaltalk, Macromedia Director κλπ.)  Χρήση σχεδιαστικών πακέτων λογισμικού (Photoshop, Visio κλπ.)  Χρήση λογισμικού προσομοίωσης (π.χ. Simulink, Toolbook, Spice, FPGA κλπ.)  Είναι διαδραστικά όσον αφορά την διεπιφάνεια (πλοήγηση, διάλογοι, μηνύματα, βοήθεια) αλλά όχι όσον αφορά τη λειτουργικότητα  Προσανατολισμός στον έλεγχο της διεπιφάνειας από τους τελικούς χρήστες 14/10/201442Τμήμα Πληροφορικής

Ενδιάμεση πιστότητα  Στόχοι  Έλεγχος λεπτομέρειας (π.χ. υλοποίηση περιπτώσεων χρήσης) από τους χρήστες  Δημιουργία διεπιφάνειας η οποία είναι πιο κοντά στο τελικό σύστημα  Δυνατότητα οικοδόμησης τελικού συστήματος επί του πρωτοτύπου μέσω αυξητικής ή / και εξελικτικής σχεδίασης  Κίνδυνοι  Επικέντρωση χρηστών σε ασήμαντες λεπτομέρειες  Δημιουργία ψευδαίσθησης πραγματικού συστήματος (τόσο στους χρήστες όσο και στους managers) 14/10/201443Τμήμα Πληροφορικής

Ενδιάμεση πιστότητα (ΙΙ)  Παραδείγματα:  Σχεδιαστικά πακέτα  Ο μάγος του Οζ (‘Wizard of Oz’)  Προσομοιώσεις με κώδικα  Λογισμικό καθορισμού της μορφής της διεπιφάνειας (layout) 14/10/201444Τμήμα Πληροφορικής

Σχεδιαστικά πακέτα  Οι οθόνες σχεδιάζονται με εργαλεία δημιουργίας γραφικών ώστε να δίνουν πιο σαφή εικόνα της διεπιφάνειας  Πρακτικά εφαρμόζονται σε περιπτώσεις οριζόντιας πρωτοτυποποίησης η οποία καλύπτει όλη τη διεπιφάνεια αλλά δεν υποστηρίζει πρακτικά καμία λειτουργικότητα  Δίνουν μειωμένη αίσθηση διαδραστικότητας 14/10/201445Τμήμα Πληροφορικής

Ο Μάγος του Οζ >Blurb blurb >Do this >Why? User  Ο χρήστης νομίζει ότι αλληλεπιδρά με το σύστημα αλλά στη πραγματικότητα ο σχεδιαστής:  Διερμηνεύει την είσοδο του χρήστη μέσω κάποιου αλγορίθμου  Ελέγχει το σύστημα ώστε να δημιουργήσει την κατάλληλη έξοδο  Η διεπιφάνεια μπορεί να πραγματική ή εικονική πράγμα που οδηγεί στην περίπτωση αόρατου ή ορατού μάγου (“pay no attention to the man behind the curtain!”) 14/10/201446Τμήμα Πληροφορικής

Ο Μάγος του Οζ (ΙΙ)  Πολύ καλή μεθοδολογία για:  Κατανόηση των προσδοκιών των χρηστών από το σύστημα  Οραματισμό και έλεγχο καινοτόμων προϊόντων  Πρόσθεση σύνθετων λειτουργιών (κάθετη πρωτοτυποποίηση)  Μειονεκτήματα:  Μεγάλο κόστος  Δυσκολία υλοποίησης  Καθυστέρηση στις απαντήσεις από τους σχεδιαστές σε σχέση με το πραγματικό σύστημα  Δημιουργία υψηλών προσδοκιών από τους χρήστες  Άλλο υπολογιστής άλλο άνθρωπος (υποσυνείδητες ενέργειες σχεδιαστή) 14/10/201447Τμήμα Πληροφορικής

Ο Μάγος του Οζ – Παραδείγματα  Intelligent Agents / Programming by demonstration  Ένας άνθρωπος είχε εκπαιδευτεί να μιμείται ένα “learning agent” (μαθητευόμενο πράκτορα). Ο χρήστης παρέχει παραδείγματα για το πως εκτελούνται κάποιες εργασίες και ο υπολογιστής πρέπει να μάθει να τις εκτελεί μόνος του  Η μεθοδολογία εφαρμόστηκε ώστε να αναγνωριστεί πως οι χρήστες καθορίζουν τις προς εκτέλεση εργασίες τους The Wizard 14/10/201448Τμήμα Πληροφορικής

Προσομοιώσεις με κώδικα (scripted simulations)  Στην ουσία αποτελούν υλοποίηση των storyboards σε περιβάλλον υπολογιστή:  Η επιλογή ενός πλήκτρου από τον χρήστη ενεργοποιεί μια νέα οθόνη (ή κάποια αλλαγή στην υφιστάμενη)  Είναι πολύ καλά για έλεγχο σεναρίων και περιπτώσεων χρήσης και χρησιμοποιούνται κατά κόρον σε κάθετες προσομοιώσεις  Εναλλακτική συμπεριφορά του συστήματος προσομοιάζεται με τη χρήση διαφορετικών scripts (μικρού τμήματος κώδικα)  Ο χρήστης βλέπει το προσομοιωμένο σύστημα να συμπεριφέρεται όπως θα συμπεριφερόταν το πραγματικό  Πολύ σημαντικό για τον έλεγχο διαλόγων, μηνυμάτων σφάλματος, και online βοήθειας 14/10/201449Τμήμα Πληροφορικής

 Βασισμένο στο υλικό από το κεφάλαιο 6 του βιβλίου και στο κεφάλαιο 8 του βιβλίου  Jennifer Preece, Yvonne Rogers, Helen Sharp, Interaction Design: Beyond Human-Computer Interaction, John Wiley & Sons, Second Edition, /10/ Καλή συνέχεια Τμήμα Πληροφορικής