MoAll is a multiple-device startup project. Letting the kiosk do the search job for you while you are passing by. It is a new way of shopping that brings the convenience of technology back to real life.
CHALLENGE
Creating multiple device experiences requires a thorough way of thinking about the user flow and creating a coherent design system.
ROLE
Facilitate User Research
Redesign User Experience
Conduct UX Audit
Create User Interface
SKILLS
App Redesign
Prototyping
User Research
When I was at the Mall of America, I had a really hard time finding what I want, only because of the number of shops and activities they have. When I was in Aventura Mall in Miami, I noticed a walking motion graphic displayed on a kiosk from far away. I realized how much power it can provide in that situation and it is currently not used best to its capability. I want to solve problems in this high-density area and help people have a better experience at the mall.
Just like what we can do with our computers at home, MoAll acts as a quick search function that has access to all the items in the mall using wireless communication between their phone and the kiosks. Giving users a seamless and uninterrupted experience of finding the things they need.
- The ability to view touch and interact with physical products.
- The overall experience that a physical location provides
- The immediacy in-location experiences provide.
Mobile App: mainly focuses on the needs of creating the shopping list, or putting in the keywords that need to be filtered and searched during their shopping experience. It acts like an in-pocket aid to the product.
Kiosk: its purpose is to provide guidance when users are walking by. It generates content based on the keywords users put on their phones. It also provides a quick virtual try-on function for the users before they walk all the way to that certain shop.
Shopping List
If there’s a specific item they are looking for that day, which could be a pair of boots, a present for a friend, or just a white shirt, users are able to add the keywords to their shopping list prior to arriving at the mall.
Item Recommendation
With the keywords in their shopping list, items will be recommended for easy access. It can be shown directly when users walk by the kiosk.
Store Recommendation
Based on the survey once users log in, there will be store recommendations based on their preferences.
Map Navigation
With the items you might want to find directly, the map will show you how to get to there easily.
Map Direction
Once the user has already scanned the QR code for the mall, without the need to look at mobile phone screens, users are able to interact with the kiosk within a certain distance and get personalized item recommendations based on their shopping list and current location.
Virtual Try-on
Once hit the virtual try-on button on the phone, users are able to try in front of the kiosk and get directions to the store.
Confusion on the shopping list page
- When searching the keywords of the item, users didn't understand immediately about further description.
- The sudden appearance of the category tab is not necessary.
- Users got confused when the instructional headline did not change according to their actions.
Filter redundancy
- Too much unnecessary steps on filters make it hard to exit the filter, not intuitive.
60% of users did not get the icons right away
Generic icon like bookmark does not tell what it does straight away. Using photographs in shopping lists creates confusion with actual products.
80% stuck on virtual try-on
- The arrow CTA did not suggest the next step to the users.
- The grouping of elements is hard to navigate.
- “Plus icon” was not intuitively seen on the left.
Considering the flow of using the app, the edit and scan icon does not need to be there all the time. So I removed the buttons at the bottom corners.
Users get confused with the image and mix it up with the actual product, so icon representations are the best option in this scenario. This color coding makes it easier to recognize after users scan the code and see the item recommendation.
I tried options on how items and stores recommendation can be provided on the same page, but it appears to be not clear to users.
Horizontal scrolling on the phone is not intuitive. Making separations on the navigation tab opens up the option to categorize each item and vertical scroll. The color coding from the shopping list gives a stronger link between each page.
For Merchants
-Attract more target customer
-Get more traffic to the store
For Customers
-A faster way to find their needs
-An experience to interact in the space
-Bring the convenience of technology to real-life
Statistics
Mall of America generates more than $2 billion in economic activity annually. According to Statista, the number of people who visit Mall of America each year—about 40 million in 2019.
Outcome
Attracting more target buyers to the stores can effectively increase the amount of revenue impact.
MoAll provides this experience of Near Field Communication (NFC) with a personal device at the public kiosk to create an intimate interaction for users. MoAll positions itself as a combination of search engines, AI, and directional apps compared to the traditional medium of map direction at malls.
How can we elevate the product to not just a directory but also make it help the shopping process and enhance entertainment?
- The CTA available on a page should be concise; considering the user flow, buttons don’t need to be presented simultaneously.
- The use of icon representation and photography can be very impactful in different circumstances and will cause confusion if not used correctly.
Creating a new experience using a unique platform is an extra challenge for me to think about user flow while designing between the screens. I noticed how users think differently when navigating the app and what I felt while creating. The iterations of the wireframes enhance the thinking of the user journey and improve the structure.
