Quantcast
Channel: Dtalks - Medium
Viewing all articles
Browse latest Browse all 88

DrovAR: AR experience for Drone Buyers- A UX Case Study

0
0
I joined Designerrs Academy as a UX designer, with an educational background in Accessories Design, and started learning, exploring and working with the Augmented Reality UI UX Design course.

I welcome you to my first Case study for designing AR experiences that I have created during my learning phase at Designerrs Academy, and I’d love to hear your feedback!

The Brief

DrovAR is an augmented reality app that assists users to comprehend the attributes of drones, experiencing the operations of a drone and having a clear understanding of the physical characteristic of drones. DrovAR allows users to choose and make a smart selection of a product as per their necessities.

The Problem

Using a Drone has become very popular for content creation and videography. Due to a lack of hands-on manner, most users don’t understand features or physical attributes before making a purchase as it is exclusive and mostly can be purchased online. Also, sometimes users can not find the right product as per their needs because of having no knowledge of its size, colour and other physical properties before purchase.

And the information they receive through videos or images does not cater to their in-hand experience of the product.

Photo by Towfiqu barbhuiya on Unsplash

Design thinking process

Starting with Empathize

User Interviews

I started by creating questionnaires that included questions based on users’ experiences and found two potential user groups that I thought were my audience.

A. Potential Drone buyers (Those who were new to the product with no experience)
B. Drone users (Those who already had the experience with the product and might want to upgrade)

Therefore, I created separate questionnaires based on their experience with the product.

Interview Insights

“Brands talk about product only but they should provide knowledge about accessories because we carry them also”
“What sizes are available, how to operate it and weren’t sure if it is going to be comfortable or how it affects. How big it is. Will it fit my bag or do I need any case for it.”

Making sense of interview data

Gathered users’ statements and analysed them to find the needs that they desired before making a purchase.

1. They need to see various folding states of the drone.
2. Interested to see all parts of the drone.
3. Need to give it a test flight basically/the amount of noise it creates.
4. Need to see it getting unboxed, assembled, and Disassembled.
5. Interested to know about the portability of the product.
6. Need to know if there are accessories that come along with the drone and how to use it.
7. Interested in Charging demo to understand its operation.

Affinity Mapping

While categorizing, I started to see insights from observing patterns during affinity mapping

User Personas

In order to understand the user better, I gathered insights from user interviews, this helped me further understand user needs and how they behave.

Then I observed there two personas that represent different behaviours, earlier I had found four different persons but due to current constraints of AR products, I had to select two of them that can be catered to.

User Journey Mapping & Scenarios

In order to understand the user’s emotion during a task, I created a user journey based on scenarios

Tech Explorer’s Journey

Vikram was invited to a friend’s wedding, they recorded the event with a drone and after watching their video he felt, he can also use it for his travel blogs.
But he wanted it to be compact so that he can easily keep it in his backpack wherever he was travelling. After getting enough feedback from various sources such as youtube, and websites, he asked one of his friends to get it from Dubai for a better price rate.
After unboxing he realized the size of the drone was bigger than it was shown in photos, also the controller was of unexpected size, he had difficulty keeping it in his bag due to its physical safety and now he needs to carry an extra bag that just holds his drone.

Travel Geek’s Journey

Technology is a crucial part of Rahul’s lifestyle. he loves handling technical products. 2 months ago he saw this new drone from DJI while scrolling reels on Instagram, he spotted one of the reels that were shot with the same drone and were amazed by its performance.
He went around on youtube watched product guides and read about user feedback. After making a few steps to understand the product, he decides to buy it.
During his business tour to California, he visited a flagship store and bought the drone, he wanted to see it physically before buying it but it was not possible due to its exclusiveness.
During his first use of the product, he made a mistake while installing the battery and ended up breaking the lock mechanism as he did not have any experience with such a task.

Analyzing the journey map, I can see at what points my user would feel angry or frustrated so I could find a way to improve the experience.

Story Flow

As the main feature of the experience is the Product Demo, I have created six different scenes in my experience to keep things simple and straight. When users click on explore button, they can see all four product demo experience buttons.

Storyline

Now I had to ideate how the particular scene would work by taking references from the “Logic of Narration”

Unboxing Scene
1. A big signboard appears and introduces the experience, and a Start button appears
2. The user presses the start button and the experience starts
The big drone brings the box and drops it on the floor
3. It releases the box and flies away from the ground
The 4. “Unbox” button appears and allows users to proceed to the next scene after getting tapped

Explore Scene
1.
The box opens up and contents are displayed through animation around the box
2. A new button appears “Explore Drone” which brings the drone to the centre and makes everything else disappear.
3. Drone hovers and zooms in the centre and four experience buttons appears that allows them to Experience certain feature.

Battery Change Scene
1.
If they tap the “Change battery” button it takes them to an experience which demonstrates the changing process of batteries.
2. Drone rotates 180 degrees and shows the complete process of changing a battery in a zoomed view, once this experience is over a “ back” button appears allowing them to go back to the previous scene.
3. A user can continue experiencing other features of the drone or else they may make a choice of buying by clicking on the buy button.

Compare Scene
1.
If they tap the “Compare” button it takes them to an experience which demonstrates the size comparison of the product with daily use objects.
2. Drone stays in the centre and daily life objects are arranged around and comparing the size of the drone with it, once this experience is over a “ back” button appears allowing them to go back to the previous scene.
3. A user can continue experiencing other features of the drone or else they may make a choice of buying by clicking on the buy button.

Fold/Unfold Scene
1.
If they tap the “Fold” button it takes them to an experience which demonstrates the folding and unfolding process of the product.
2. Drone folds and unfolds itself, once this experience is over a “ back” button appears allowing them to go back to the previous scene.
3. A user can continue experiencing other features of the drone or else they may make a choice of buying by clicking on the buy button.

Flight Scene
1.
If they tap the “fly” button it takes them to an experience which demonstrates the flight and sound of flight. If they tap the “fly” button it takes them to an experience which demonstrates the flight and sound of flight.
2. Drone flies around and lands on the ground, allowing users to experience the noise of whirring, once this experience is over a “ back” button appears allowing them to go back to the previous scene.
3. A user can continue experiencing other features of the drone

Storyboard

I created the storyboard on the basis of affordances and evaluation test results. My goal was to serve both the personas

Scene Layout

In Mobile/ Website we design within boxes, and it is a very static experience, all within a box. But in AR, There are multiple directions users can see and interact with the experience. I created asset cards and 360 layouts and placed the content as per storyline considering ergonomics and user POV

Content Strategy

During this stage, I followed the Storyboard and Scene Navigation to list all the assets required. These assets were sorted and grouped as per their asset categories as 2D buttons, 3D assets, and Audio.
I gathered a few and created the rest of the assets required using blender, Figma and spline.

Prototype

In this stage, I created a low-poly prototype for the DrovAR experience

Heuristic Evaluation

I evaluated the first prototype on the basis of Neilson and additional AR heuristics and worked on changes required to provide a more comfortable and meaningful experience.

Heuristic Violations & Corrections

User Control and Freedom

Before Evaluation

Users can experience the entire story only in a sequence that started from unfolding-flying-battery change-comparing, and they had no choice of going back and forth from any situation.

After Correction

Now users have a choice of going back to the previous scene by tapping the “back” button where they have the command to achieve other actions as per their necessity or interest.
Consistency and Standards

Before Evaluation

During unboxing, all the accessories were of random colours that were not harmonious with each other as multiple colours and textures were applied to them.

After Correction

All the assets were recoloured, textured and as per the main product’s(Drone) visual parameters, which helped in the uniformity of the accessories.
Match between System and the Real World

Before Evaluation

During the comparison scene, all the objects such as a backpack, laptop and phone were floating in the air, which made it look unreal and unrelated.

After Correction

Assets were placed on a surface to construct a more realistic experience that matches the user’s perception of reality.

Creating Final Scenes

A. Typeface

Considering AR text guidelines and legibility, I have used “Poppins Semi-bold” which is a Sans Serif typeface and provides a clean, minimal, modern style.

B. Text Colour

For Buttons — Black text with a white background is favoured for AR as white creates highlights and the Black colour becomes easier to spot, making it visible during different background light conditions that improve the readability

Buttons- Black text with a white background

For Secondary Texts — These texts are nonfunctional elements that only provide a description, therefore White text with a black and translucent background is used for differentiating it from buttons.

Secondary Texts- White text with a black and translucent background

C. Color

D. Asset Materials

Final Prototype

Preview

This is how my application looks working. You can also interact with the live prototype by scanning the QR Code

Conclusion

The design thinking process helped me a lot in understanding people. I learned how to empathize with people and how to always put the user’s needs first. Overall, I liked the challenge of working for the user and would be implementing this thought process in all of my projects.

Thank you for reading!

I would love to hear your thoughts, suggestions and feedback regarding this Case Study. Please comment down your views.


DrovAR: AR experience for Drone Buyers- A UX Case Study was originally published in DETAUX (Designers Talk UX) on Medium, where people are continuing the conversation by highlighting and responding to this story.


Viewing all articles
Browse latest Browse all 88

Latest Images

Trending Articles





Latest Images