Κατασκευή διαδραστικού πρωτοτύπου υψηλής πιστότητας

Η κατασκευή ενός διαδραστικού πρωτοτύπου είναι ένας βασικός πυλώνας του προγραμματισμού της διάδρασης που συνδέεται με την αναζήτηση εναλλακτικών σχεδίων και την αξιολόγηση με τους χρήστες. Η κατασκευή διαδραστικών πρωτοτύπων μπορεί αρχικά να φαίνεται μια δύσκολη δουλειά που θα πρέπει να κάνουν μόνο οι προγραμματιστές ή οι ηλεκτρονικοί αφού τους στείλουμε τα σχέδια και τις προδιαγραφές που θέλουμε να έχει το πρωτότυπο (το οποίο θα δοκιμάσουμε στη συνέχεια με τους χρήστες). Αν και σε μεγάλες ομάδες και έργα ανάπτυξης ο καταμερισμός της εργασίας σε εξειδικευμένο προσωπικό και η γραμμική διαδικασία ανάπτυξης είναι αναγκαίες συνθήκες για την καλή οργάνωση και τον συνεχή έλεγχο της προόδου, στην πράξη μπορούμε να φτιάξουμε διαδραστικά πρωτότυπα υψηλής πιστότητας χωρίς πολλές εξειδικευμένες γνώσεις και χωρίς βοήθεια από άλλους. Όπως θα δούμε σε αυτήν την ενότητα, η κατασκευή ενός διαδραστικού πρωτοτύπου υψηλής πιστότητας απαιτεί κυρίως τη δημιουργική επαναχρησιμοποίηση και σύνθεση έτοιμων επιμέρους στοιχείων. Συνολικά, η κατασκευή ενός διαδραστικού πρωτοτύπου είναι περισσότερο θέμα θέλησης παρά δεξιοτήτων ή εξοπλισμού, αφού όπως θα δούμε στη συνέχεια, το υλικό και λογισμικό της διάδρασης είναι πλέον ευρέως διαθέσιμο.

Κατασκευή μιας φωτογραφικής μηχανής

Το λογισμικό και υλικό που περιγράφεται σε αυτήν την ενότητα είναι ενδεικτικό και σίγουρα υπάρχουν πολλές εναλλακτικές. Ο βασικός στόχος είναι να χρησιμοποιήσουμε υλικό και λογισμικό που είναι άμεσα διαθέσιμο και εύκολο να αλλάξει, έτσι έχουμε γρήγορα ένα πρώτο διαδραστικό πρωτότυπο και μπορούμε να το αλλάξουμε χωρίς να λυπόμαστε τον κόπο που έχουμε επενδύσει. Αν ένα πρωτότυπο σαν αυτό που περιγράφεται σε αυτήν την ενότητα χρειάζεται περισσότερο από μία ώρα για να το αναπτύξουμε, τότε δεν έχουμε επιλέξει τα κατάλληλα αρχέτυπα για την κατασκευή του. Για την κατασκευή της φωτογραφικής μηχανής μπορούμε να χρησιμοποιήσουμε έναν επιτραπέζιο υπολογιστή με κάμερα και λογισμικό που να μπορεί να διαβάσει την εικόνα της κάμερας. Για αυτό το παράδειγμα θα χρησιμοποιήσουμε έναν φορητό MacBook και το λογισμικό Processing.

Προσομοίωση του λογισμικού

Για το λογισμικό της φωτογραφικής μηχανής χρειαζόμαστε εύκολη πρόσβαση στην κάμερα, η οποία μας δείχνει ζωντανά εικόνα και μας δίνει τη δυνατότητα να συλλάβουμε και να αποθηκεύσουμε σε ένα αρχείο την εικόνα που βλέπουμε, όταν το επιλέξουμε με το πάτημα ενός κουμπιού. Επίσης, αν θέλουμε να προσθέσουμε επιπλέον δυνατότητες στην ψηφιακή φωτογραφική μηχανή, όπως πλοήγηση και επεξεργασία με φίλτρα στις εικόνες, τότε χρειαζόμαστε λογισμικό που μπορεί να επεκταθεί με τις αντίστοιχες βιβλιοθήκες για την επεξεργασία εικόνας. Ακόμη, θέλουμε τη δυνατότητα για αναπαραγωγή ήχου, αφού είναι χρήσιμο να ακούμε τον χαρακτηριστικό ήχο του κλείστρου μιας παραδοσιακής φωτογραφικής μηχανής, ως επιβεβαίωση ότι βγάλαμε μια φωτογραφία. Για τον σκοπό αυτό μπορούμε να χρησιμοποιήσουμε το λογισμικό προγραμματισμού της διάδρασης και των πολυμέσων Processing, το οποίο καλύπτει όλες τις παραπάνω προδιαγραφές.

Για να προετοιμάσουμε το λογισμικό της διάδρασης θα βασιστούμε όσο γίνεται περισσότερο στην τεκμηρίωση, στα έτοιμα παραδείγματα, στη δημιουργική σύνθεσή τους, και κυρίως στις συνεχείς δοκιμές κάνοντας μικρές κάθε φορά αλλαγές. Το περιβάλλον του Processing είναι ιδανικό για αυτόν τον σκοπό, γιατί παρέχει πολλές βιβλιοθήκες και έτοιμο κώδικα ως μέρος του συστήματος. Τα παραδείγματα τα βρίσκουμε στο μενού File>Examples, το οποίο ανοίγει ένα νέο παράθυρο με τα παραδείγματα οργανωμένα στους φακέλους των αντίστοιχων βιβλιοθηκών. Για επιπλέον έτοιμο κώδικα, εκτός από αυτόν των παραδειγμάτων, αρκεί να πατήσουμε το δεξί κουμπί του ποντικιού πάνω σε μια λέξη στον κώδικα για να δούμε τη λεπτομερή τεκμηρίωσή της. Σε κάθε περίπτωση, το περιβάλλον του Processing επιτρέπει να εκτελέσουμε και να δούμε το αποτέλεσμα του κώδικα, καθώς και των μικρών αλλαγών που δοκιμάζουμε αμέσως.

Από τα έτοιμα παραδείγματα του Processing, μπορούμε να χρησιμοποιήσουμε από τη βιβλιοθήκη Capture το παράδειγμα GettingStartedCapture, το οποίο μας δίνει μια βασική σκαλωσιά για τον κώδικα που απαιτείται για να δούμε την είκονα που καταγράφει η κάμερα του υπολογιστή. Επίσης, από τη βιβλιοθήκη ήχου Minim, μπορούμε να χρησιμοποιήσουμε το παράδειγμα PlayAFile, το οποίο μας επιτρέπει να ακούσουμε τον ήχο από ένα αρχείο μουσικής. Επιπλέον, θα πρέπει να γράψουμε κώδικα για τον εντοπισμό του πατήματος ενός πλήκτρου, την αποθήκευση της τρέχουσας εικόνας σε ένα αρχείο, καθώς και τη μικρή παύση της εικόνας, έτσι ώστε να υπάρχει και οπτική επιβεβαίωση της λήψης της φωτογραφίας. Η βασική φωτογραφική μηχανή είναι πλέον έτοιμη, ενώ μπορούμε να συνεχίσουμε τις επεκτάσεις της λειτουργικότητάς της με το ίδιο σκεπτικό: εντοπισμός κώδικα που κάνει την δουλειά που θέλουμε από έτοιμα παραδείγματα και τεκμηρίωση, σταδιακές αλλαγές, και πολλές δοκιμές.

Προσομοίωση του υλικού

Για το υλικό της φωτογραφικής μηχανής χρειαζόμαστε, εκτός από τον υπολογιστή όπου εκτελείται το λογισμικό, μια κάμερα, κουμπιά και μια μικρή εξωτερική οθόνη. Για την κάμερα μπορούμε να χρησιμοποιήσουμε την ενσωματωμένη κάμερα του υπολογιστή, αλλά είναι καλύτερη μια εξωτερική κάμερα η οποία θα μας επιτρέψει στις επόμενες φάσεις της κατασκευής να την τοποθετήσουμε σε ένα πλαστικό ή χαρτονένιο κουτί. Για τα κουμπιά της κάμερας (π.χ., λήψη φωτογραφίας, πλοήγηση, επιλογή, κτλ.) μπορούμε να χρησιμοποιήσουμε το πληκτρολόγιο του υπολογιστή, αλλά είναι καλύτερα να χρησιμοποιήσουμε μια συσκευή όπως το MakeyMakey, το οποίο επιτρέπει να φτιάξουμε τα δικά μας εξωτερικά πλήκτρα, κάτι που θα κάνει περισσότερο ρεαλιστική την προσομοίωση στις επόμενες φάσεις. Στην πρώτη φάση της προετοιμασίας και ανάπτυξης του λογισμικού μπορούμε να χρησιμοποιήσουμε τα ενσωματωμένα πλήκτρα και την κάμερα, αλλά αν θέλουμε να προχωρήσουμε σε περισσότερο ρεαλιστικές δοκιμές με τους χρήστες είναι σκόπιμο να περάσουμε σε εξωτερικές συσκευές. Επίσης, στα τελευταία στάδια ανάπτυξης του πρωτοτύπου, είναι σκόπιμο να αντικαταστήσουμε τον υπολογιστή ανάπτυξης με έναν μικρό υπολογιστή, όπως το RaspberryPi, ο οποίος θα μας επιτρέψει μια εύκολη τοποθέτηση σε ένα μεγάλο αλλά φορητό, χαρτονένιο ή πλαστικό κουτί, το οποίο θα έχει ενσωματωμένη τη μικρή οθόνη και ακριβώς τα κουμπιά που χρειαζόμαστε.

Σχετική βιβλιογραφία

Buchenau, M., & Suri, J. F. (2000, August). Experience prototyping. In Proceedings of the 3rd conference on Designing interactive systems: processes, practices, methods, and techniques (pp. 424-433). ACM.

Pering, C. (2002). Interaction design prototyping of communicator devices: Towards meeting the hardware-software challenge. Ιnteractions, 9(6), 36-46.

Δραστηριότητες

Προσθήκη βιβλιοθήκης αφαίρεσης υποβάθρου

Οι τουρίστες συνηθίζουν να βγάζουν φωτογραφία τον εαυτό τους ή την παρέα τους μπροστά από γνωστά τοπόσημα. Να επεκτείνετε το παράδειγμα αυτής της ενότητας ώστε να μπορεί το υπόβαθρο της φωτογραφίας να αλλάξει με μια εικόνα που βρίσκεται αποθηκευμένη τοπικά.

Τοποθέτηση της κάμερας σε εξωτερικό κουτί

Κατασκευάστε ένα χαρτονένιο ή πλαστικό κουτί και τοποθετήστε εκεί μέσα την εξωτερική κάμερα, την οθόνη και τα πλήκτρα.

Τοποθέτηση μικρού υπολογιστή

Αντικαταστείστε τον επιτραπέζιο ή φορητό υπολογιστή ανάπτυξης με έναν μικρό υπολογιστή (π.χ., RaspberryPi) που χωράει μαζί με τις μπαταρίες μέσα στο κουτί που φτιάξατε στο προηγούμενο βήμα.