Μενού

WebAR Παιχνίδι: Ocean Recovery AR Prototype

WebAR Παιχνίδι: Ocean Recovery AR Prototype

WebAR underwater game

Τι μπορεί να συμβεί όταν το WebAR, η επαυξημένη πραγματικότητα, η διαδραστική εικονογράφηση και το environmental storytelling συνδυαστούν απευθείας μέσα στον browser ενός κινητού τηλεφώνου;

Στη Fourthedesign πειραματιζόμαστε συνεχώς με νέους τρόπους αξιοποίησης των immersive technologies. Ένα από τα πιο πρόσφατα prototypes μας είναι το Ocean Recovery AR, ένα WebAR παιχνίδι που μετατρέπει τον πραγματικό χώρο του χρήστη σε ένα διαδραστικό υποθαλάσσιο περιβάλλον.

Η αρχική ιδέα ήταν αρκετά απλή: ο χρήστης επιλέγει ένα ψάρι, το χρωματίζει και στη συνέχεια το μεταφέρει μέσα στον πραγματικό χώρο μέσω επαυξημένης πραγματικότητας.

Στην πορεία, όμως, θέλαμε να προχωρήσουμε την εμπειρία περισσότερο.

Αντί να δημιουργήσουμε ακόμη μία εφαρμογή AR όπου ο χρήστης απλώς τοποθετεί ένα ψηφιακό αντικείμενο και το παρατηρεί, θελήσαμε να εξερευνήσουμε πώς μία WebAR εμπειρία μπορεί να συνδυάσει δημιουργικότητα, spatial interaction και gameplay.

Το αποτέλεσμα είναι ένα prototype όπου ο χρήστης μπορεί να δημιουργήσει το δικό του θαλάσσιο habitat σε augmented reality και στη συνέχεια να ξεκινήσει μία διαδραστική αποστολή καθαρισμού του ωκεανού.


ΔΟΚΙΜΑΣΤΕ ΤΟ OCEAN RECOVERY AR

Ανοίξτε την εμπειρία από το κινητό σας:
fourthedesign.gr/summer/index.html

Από ένα 2D ψάρι σε ένα περιβάλλον επαυξημένης πραγματικότητας

Το πρώτο μέρος του WebAR παιχνιδιού επικεντρώνεται στη δημιουργία.

Ο χρήστης μπορεί να επιλέξει ανάμεσα σε διαφορετικά εικονογραφημένα ψάρια, το καθένα με διαφορετικό σχήμα, χαρακτηριστικά και patterns.

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

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

Παράλληλα, υπάρχουν διαφορετικά υποθαλάσσια στοιχεία όπως θαλάσσια βλάστηση, κοράλλια, βράχια, κοχύλια και άλλα στοιχεία που μπορούν να χρησιμοποιηθούν για τη δημιουργία ενός μικρού ψηφιακού οικοσυστήματος.

Έτσι, μία απλή 2D δημιουργία μετατρέπεται μέσα σε λίγα δευτερόλεπτα σε μέρος ενός spatial περιβάλλοντος.

Το ψάρι που πριν βρισκόταν μόνο στην οθόνη μπορεί πλέον να εμφανιστεί μέσα στον πραγματικό χώρο του χρήστη.

Αυτού του είδους οι εφαρμογές αποτελούν μέρος του ευρύτερου πεδίου των VR και AR εφαρμογών που αναπτύσσουμε και εξερευνούμε στη Fourthedesign.

Τοποθέτηση ψαριών και υποθαλάσσιων στοιχείων στον πραγματικό χώρο

Αφού δημιουργήσει το ψάρι του, ο χρήστης περνάει στο περιβάλλον AR.

Σε συμβατές συσκευές Android, το Ocean Recovery AR χρησιμοποιεί WebXR και spatial tracking μέσω ARCore, ώστε να μπορεί να αναγνωρίζει σημεία και επιφάνειες στον πραγματικό χώρο.

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

Τα αντικείμενα μπορούν να τοποθετηθούν ανεξάρτητα σε διαφορετικές αποστάσεις και θέσεις.

Ένα ψάρι μπορεί να βρίσκεται αρκετά μέτρα μακριά, ενώ ένα κοράλλι, ένα κοχύλι ή ένα άλλο στοιχείο μπορεί να τοποθετηθεί πολύ πιο κοντά στο πάτωμα.

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

Τα μακρινά αντικείμενα φαίνονται μικρότερα και τα κοντινότερα μεγαλύτερα.

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

Ο στόχος δεν είναι απλώς η προβολή ενός αντικειμένου σε AR.

Ο χρήστης καλείται να συνθέσει ο ίδιος το δικό του υποθαλάσσιο περιβάλλον.

WebAR σε Android και iPhone

Ένα από τα πιο ενδιαφέροντα τεχνικά κομμάτια της ανάπτυξης του prototype ήταν οι διαφορετικές δυνατότητες που προσφέρουν τα mobile browsers και τα λειτουργικά συστήματα.

Η λογική του WebAR είναι ιδιαίτερα ενδιαφέρουσα επειδή δεν απαιτεί απαραίτητα την εγκατάσταση μιας native εφαρμογής.

Ο χρήστης μπορεί να ανοίξει έναν σύνδεσμο ή να σαρώσει ένα QR code και να ξεκινήσει την εμπειρία απευθείας από τον browser του κινητού του.

Ωστόσο, Android και iOS δεν παρέχουν ακριβώς τις ίδιες δυνατότητες browser-based AR.

Στο Android, όταν υπάρχει η κατάλληλη υποστήριξη WebXR, το prototype αξιοποιεί spatial tracking και real-world hit testing.

Στο iPhone και στο iPad χρησιμοποιούμε μία διαφορετική προσέγγιση που βασίζεται στην κάμερα, στους αισθητήρες κίνησης, στο device orientation και σε ένα calibrated virtual floor.

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

Με αυτόν τον τρόπο μπορούμε να προσφέρουμε μία αντίστοιχη εμπειρία τοποθέτησης στοιχείων και σε συσκευές Apple, χωρίς να απαιτείται η εγκατάσταση ξεχωριστής εφαρμογής.

Η αντιμετώπιση τέτοιων διαφορών μεταξύ συσκευών είναι ένα σημαντικό κομμάτι της ανάπτυξης σύγχρονων immersive web experiences.

Για αυτό και το mobile και web development συνδέεται πλέον όλο και περισσότερο με τεχνολογίες AR, real-time 3D και spatial interaction.

Από το AR Habitat στο Ocean Recovery Game

Η δημιουργία του υποθαλάσσιου περιβάλλοντος αποτελεί μόνο το πρώτο μέρος της εμπειρίας.

Όταν ο χρήστης ολοκληρώσει τη σύνθεση του habitat του, μπορεί να επιλέξει:

Start Recovery Mission.

Σε αυτό το σημείο η εφαρμογή αλλάζει χαρακτήρα.

Από εργαλείο δημιουργίας και τοποθέτησης αντικειμένων σε augmented reality μετατρέπεται σε ένα μικρό AR παιχνίδι.

Ένα εικονογραφημένο υποβρύχιο εμφανίζεται μέσα στο περιβάλλον και διαφορετικά αντικείμενα θαλάσσιας ρύπανσης αρχίζουν να εμφανίζονται στον χώρο.

Ανάμεσά τους υπάρχουν:

  • πλαστικά μπουκάλια,
  • πλαστικές σακούλες,
  • καπάκια,
  • σαγιονάρες,
  • πλαστικές συσκευασίες,
  • μπάλες παραλίας,
  • και άλλα αντικείμενα που συμβολίζουν θαλάσσια απορρίμματα.

Ο παίκτης ελέγχει το υποβρύχιο και εκτοξεύει recovery projectiles προς τα απορρίμματα.

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

Το gameplay είναι σκόπιμα απλό και άμεσα κατανοητό.

Αλλά το ενδιαφέρον βρίσκεται στη σύνδεση ανάμεσα στη δημιουργία και την προστασία του περιβάλλοντος.

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

Ο συνδυασμός interaction, scoring και environmental objectives συνδέεται και με τη δουλειά μας στον χώρο του game design και game development.

Καθάρισε τα απορρίμματα χωρίς να χτυπήσεις τα ψάρια

Κατά τη διάρκεια της Ocean Recovery Mission τα ψάρια συνεχίζουν να κινούνται μέσα στο περιβάλλον.

Δεν εξαφανίζονται όταν ξεκινά το παιχνίδι.

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

Η απομάκρυνση ενός απορρίμματος αυξάνει το score.

Το χτύπημα ενός ψαριού δημιουργεί penalty.

Η βασική ιδέα είναι απλή:

Καθάρισε το περιβάλλον χωρίς να βλάψεις το οικοσύστημα που προσπαθείς να προστατεύσεις.

Κινούμενα ψάρια, bubbles, underwater ambience, ηχητικά εφέ, submarine controls και visual impact effects μετατρέπουν το αρχικό AR environment σε ένα lightweight spatial game.

Η συνολική εμπειρία ακολουθεί ουσιαστικά μία απλή διαδρομή:

Δημιουργία → Τοποθέτηση → Εξερεύνηση → Παιχνίδι → Προστασία.

Γιατί δημιουργήσαμε ένα WebAR παιχνίδι;

Ένας από τους βασικούς στόχους του Ocean Recovery AR είναι να εξερευνήσουμε πόσο μακριά μπορεί να φτάσει σήμερα μία immersive εμπειρία που λειτουργεί απευθείας μέσα από έναν mobile browser.

Παραδοσιακά, μία εφαρμογή που περιλαμβάνει augmented reality, spatial placement, animated content, sound, interaction και gameplay θα οδηγούσε σχεδόν αυτόματα στην ανάπτυξη μίας native εφαρμογής.

Η native εφαρμογή μπορεί φυσικά να προσφέρει πολύ μεγάλες δυνατότητες, αλλά δημιουργεί και ένα επιπλέον εμπόδιο ανάμεσα στον χρήστη και στην εμπειρία.

Ο χρήστης πρέπει συνήθως να:

  • βρει την εφαρμογή,
  • την κατεβάσει,
  • την εγκαταστήσει,
  • την ανοίξει,
  • δώσει τα απαραίτητα permissions
  • και μόνο τότε να ξεκινήσει την εμπειρία.

Το WebAR μπορεί να προσφέρει μία πολύ πιο άμεση διαδικασία:

Scan QR Code → Open Website → Allow Camera → Start Experience.

Αυτό κάνει την τεχνολογία ιδιαίτερα ενδιαφέρουσα για προσωρινές εγκαταστάσεις, events, εκθέσεις, branded activations και χώρους όπου ο επισκέπτης δεν θέλει απαραίτητα να εγκαταστήσει μία εφαρμογή που θα χρησιμοποιήσει μόνο μία φορά.

Στη Fourthedesign έχουμε ήδη εξερευνήσει αυτή τη λογική και σε άλλα projects, όπως το Green Cola WebAR experience, όπου το AR περιεχόμενο ενεργοποιείται απευθείας μέσα από έναν mobile browser.

Το Ocean Recovery AR επεκτείνει αυτή τη λογική προσθέτοντας customization, spatial placement και game mechanics.

Πού θα μπορούσε να χρησιμοποιηθεί μία τέτοια WebAR εφαρμογή;

Παρόλο που το Ocean Recovery AR είναι αυτή τη στιγμή ένα prototype, η βασική λογική του μπορεί να προσαρμοστεί σε πολλούς διαφορετικούς τομείς.

Μουσεία και πολιτιστικοί οργανισμοί θα μπορούσαν να επιτρέπουν στους επισκέπτες να τοποθετούν ιστορικά αντικείμενα, χαρακτήρες ή ανακατασκευές μέσα στον πραγματικό χώρο.

Περιβαλλοντικοί οργανισμοί μπορούν να χρησιμοποιήσουν αντίστοιχες εφαρμογές για καμπάνιες σχετικά με τη θαλάσσια ρύπανση, τη βιοποικιλότητα, την ανακύκλωση ή την κλιματική αλλαγή.

Εκθέσεις και events μπορούν να χρησιμοποιούν QR codes για να ενεργοποιούν διαδραστικές εμπειρίες χωρίς να απαιτείται εγκατάσταση εφαρμογής.

Η εκπαίδευση μπορεί να συνδυάσει spatial visualization, παιχνίδι, quizzes και interactive challenges.

Ο τουρισμός μπορεί να συνδέσει πραγματικές τοποθεσίες με ψηφιακό περιεχόμενο, ιστορικές πληροφορίες και interactive storytelling.

Τα brands μπορούν να μετατρέψουν προϊόντα, συσκευασίες, stands ή φυσικούς χώρους σε interactive digital touchpoints.

Όλα αυτά αποτελούν μέρος μιας ευρύτερης μετάβασης προς τις immersive digital experiences, όπου το κοινό δεν παρακολουθεί απλώς ένα περιεχόμενο, αλλά συμμετέχει ενεργά σε αυτό.

Το WebAR ως εργαλείο Interactive Storytelling

Για εμάς, ίσως το πιο ενδιαφέρον στοιχείο του WebAR παιχνιδιού δεν είναι μόνο η τεχνολογία.

Είναι η σειρά με την οποία εξελίσσεται η εμπειρία.

Αρχικά, ο χρήστης δημιουργεί ένα ψάρι.

Στη συνέχεια το φέρνει μέσα στον πραγματικό του χώρο.

Προσθέτει περισσότερα ψάρια και στοιχεία και δημιουργεί σταδιακά ένα μικρό θαλάσσιο οικοσύστημα.

Μόνο όταν το περιβάλλον έχει δημιουργηθεί εμφανίζεται η ρύπανση.

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

Αυτή η μετάβαση από τη δημιουργία στην ευθύνη δίνει στο περιβαλλοντικό μήνυμα περισσότερο νόημα από μία απλή στατική ενημέρωση σχετικά με τα πλαστικά στη θάλασσα.

Η interactive technology μπορεί να μετατρέψει την πληροφορία σε συμμετοχή.

Ένα prototype για το μέλλον του browser-based AR

Το Ocean Recovery AR παραμένει ένα prototype και αυτό είναι σκόπιμο.

Μας προσφέρει ένα πραγματικό πεδίο δοκιμών για διαφορετικές τεχνολογίες και interaction concepts.

Μέσα από το project εξερευνούμε:

  • WebAR και WebXR,
  • mobile augmented reality,
  • cross-platform AR interaction,
  • spatial placement,
  • 2D assets μέσα σε 3D περιβάλλον,
  • browser-based game mechanics,
  • mobile camera interaction,
  • touch controls,
  • audio και environmental effects,
  • AR photo creation,
  • gamification,
  • environmental storytelling.

Τέτοιου είδους prototypes μάς επιτρέπουν να κατανοήσουμε όχι μόνο τι μπορεί να προσφέρει σήμερα το browser-based immersive technology, αλλά και ποιοι περιορισμοί εξακολουθούν να υπάρχουν.

Για οργανισμούς ή εταιρείες που εξετάζουν την ανάπτυξη AR, VR, WebAR ή real-time interactive εφαρμογών, μπορείτε επίσης να δείτε τις VR & AR υπηρεσίες και εφαρμογές της Fourthedesign, καθώς και τα FAQs για VR, AR και real-time development.

Δοκιμάστε το Ocean Recovery AR

Ο καλύτερος τρόπος για να καταλάβετε το Fish WebAR Prototype είναι να το δοκιμάσετε.

Ανοίξτε το παρακάτω link από ένα συμβατό smartphone, δημιουργήστε τα δικά σας ψάρια, στήστε το θαλάσσιο περιβάλλον σας και ξεκινήστε την Ocean Recovery Mission.


ΔΟΚΙΜΑΣΤΕ ΤΟ OCEAN RECOVERY AR

Fish WebAR Prototype
https://fourthedesign.gr/summer/index.html

Στη Fourthedesign συνεχίζουμε να εξερευνούμε πώς η επαυξημένη πραγματικότητα, η εικονική πραγματικότητα, το real-time 3D, τα games και το web μπορούν να δημιουργήσουν νέες μορφές interaction.

Μία immersive εμπειρία δεν χρειάζεται πάντα να ξεκινά με την εγκατάσταση μιας εφαρμογής.

Μπορεί να ξεκινήσει με κάτι πολύ πιο απλό:

Ένα link. Μία κάμερα. Και ένας πραγματικός χώρος που περιμένει να γίνει διαδραστικός.

Αν σχεδιάζετε ένα WebAR, Augmented Reality, immersive installation ή interactive game project, επικοινωνήστε με τη Fourthedesign για να συζητήσουμε την ιδέα σας.

0 Comments Leave a reply

    Leave a comment

    Your comment(click button to send)