Τοποθέτηση κιτ UI - Το μέλλον των κινητών εφαρμογών επαυξημένης πραγματικότητας

Όταν η Apple κυκλοφόρησε το ARKit, ο σχεδιασμός για την επαυξημένη πραγματικότητα δεν καθορίστηκε ως πεδίο. Αλλά το φθινόπωρο του 2017 στο App Store εμφανίστηκαν πολλές εφαρμογές AR. Σχεδόν όλοι τους χρησιμοποίησαν το ARKit.

Στην αρχή, η ροή χρήστη των εφαρμογών επαυξημένης πραγματικότητας δεν ήταν ξεκάθαρη. Ήθελα να καθορίσω ποια μοντέλα αλληλεπίδρασης είναι τα πιο δημοφιλή στις εφαρμογές ARKit. Έτσι, έκανα εκτενή ανάλυση της διαδικασίας onboarding για σχεδόν όλες τις εφαρμογές που είναι διαθέσιμες στο App Store. Επίσης, έχω κάνει αναθεωρήσεις UX δωρεάν για να αποκτήσω εμπειρία και περισσότερες γνώσεις.

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

Μοιάζει με τα πρώτα demos που δημιουργούνται κυρίως από τους προγραμματιστές Unity και iOS. Προφανώς, δεν είχαν το χρόνο ή άλλους πόρους για να προσλάβουν έμπειρο σχεδιαστή UX. Εκείνες οι φορές δεν υπήρχαν διευθετημένες σχέσεις αλληλεπιδράσεων που θα μπορούσαν να ακολουθηθούν.

Έτσι, στο άρθρο μου "Να επιβιβαστώ στην κινητή εφαρμογή augmented reality" προσπάθησα να καλύψω τα βασικά βήματα και να διευκρινίσω τι να εστιάσω και τι να αποφύγω. Ελπίζω ότι θα έκανε τουλάχιστον μία εφαρμογή πιο φιλική προς το χρήστη.

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

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

Για εύκολη αναζήτηση ταξινόμησα όλες τις οθόνες στις ακόλουθες κατηγορίες:

Ερευνα:

Είναι η πρώτη και η πιο συγκεχυμένη στιγμή για τους πρώτους χρήστες. Μια εφαρμογή θα πρέπει απαλά (ή όχι) να αφήσει ένα χρήστη να γνωρίζει ότι χρειάζεται κάποια πληροφορία σχετικά με το περιβάλλον.

Τοποθέτηση:

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

Χειρισμός και συμβουλές:

Αυτό το βήμα είναι να παίζετε με εμπλουτισμένα αντικείμενα. Στο επίπεδο UI υπάρχουν πολλά σταθερά καλά γνωστά μοτίβα, όπως το δάχτυλο από την κορυφή στη σελίδα ενημέρωσης, και ούτω καθεξής. Στην AR είναι σαν το άγριο δυτικό. Η Apple και η Google προσπάθησαν να ορίσουν ορισμένες καταστάσεις. Αλλά μερικές φορές μια περίπτωση απαιτεί μοναδικές αλληλεπιδράσεις. Είναι σημαντικό να τα εισαγάγετε απαλά. Ανάλογα με τη σημασία που μπορεί να είναι μικρή καθαρή άκρη στο κουμπί ή σχεδόν πλήρης σελίδα αναδυόμενο παράθυρο.

Τοποθεσία:

Ίσως η πιο γνωστή εφαρμογή AR είναι η Pokémon GO, η οποία βασίζεται στη θέση. Ελπίζω ότι στο μέλλον θα έχουμε πολύ πιο ενδιαφέρουσες περιπτώσεις χρήσης της επαυξημένης πραγματικότητας βάσει τοποθεσίας

Κατάλογοι:

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

Προβολή κάμερας:

Όλος ο χρόνος του χρήστη ξοδεύει στην κάμερα. Μπορούν να υπάρχουν διάφορα στοιχεία UI που βοηθούν να αλληλεπιδράσουν με τον κόσμο AR.

Εικόνες:

Για να εξηγήσω γρήγορα μερικές χειρονομίες και ιδέες σε έναν χρήστη που δημιούργησα τη συλλογή εικονιδίων:

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

Κατεβάστε την πλήρη έκδοση στο Gumroad

Κατεβάστε τη δωρεάν έκδοση στο Gumroad

Ελέγξτε την πλήρη προεπισκόπηση στο Behance