AR Shoppers – UX Research & Design

AR Shoppers – UX Research & Design

 

AR Shoppers

Enhancing people’s grocery shopping experience through Augmented Reality

THE PROBLEM

Grocery shopping can often be a time-consuming activity. With hassles of handling the grocery list in one hand, searching for the respective item, picking it up and examining it with the other hand, and then repeating the cycle. This can often turn into an uncomfortable experience. To make it worse, the stores provide many different varieties of products, this leads us to choice paralysis, making it difficult for us to make a quick decision about which food item is the best for our needs.

THE QUESTION

How can the introduction of technology make the grocery shopping experience an efficient and more enjoyable process?

THE SOLUTION

AR Shoppers – Augmented Reality Glasses to aid Food Purchasing

We introduced a design solution to enhance people’s grocery shopping experience while not only helping them make healthier food choices but also saving time and money.

iPhone 6
ar shoppers overview

THE DESIGN PROCESS

DISCOVERY STAGE – INTERVIEWS, OBSERVATIONS & PROBLEM SYNTHESIS

Interviews were conducted with people from different demographics like students, professionals, and working parents. People suggested that time, health and money are really important factors in prioritizing choices about what to purchase and what to eat.

Observations were made to understand the food purchasing pattern of people at a variety of grocery stores in the Indianapolis region. Most people shopped for grocery using a grocery list, while others spent a lot of time deciding what to buy after gazing for a minimum of 10 minutes at a section.

Fig. Observing people at a local grocery store

With the help of affinity diagrams and cognitive mapping techniques, we were able to narrow down our scope and find meaningful information from our research data. The needs of the users discovered were as follows:

  1. Make grocery shopping time efficient
  2. The need to locate food items quickly
  3. Finding the best option from a group of similar items

Fig. Affinity Diagramming & Cognitive Mapping techniques were implemented

INTERPRETATION STAGE – PERSONAS & USER SCENARIOS

Based on the synthesized research data, personas were created that corresponds to the needs of our target audience.

persona images

Fig. Lucy and Ryan’s personas 

IDEATION STAGE – BRAINSTORMING, SKETCHING & STORYBOARDING

Brainstormed ideas that would meet our user’s requirement on the whiteboard. Each team member came up with 10 different ideas and then we collaborated and voted the most novel and fitting idea.

brainstorming ideas

Fig. Brainstormed ideas on the whiteboard

We finalized on designing a solution using Augmented Reality glasses (eg. Google Glass) to make the grocery shopping experience hands-free. The augmented interface could not only help the users locate the items easily, but also the use of emojis could reduce the cognitive load to aid in decision making while purchasing groceries.

Fig. the use case of glasses and the benefits of emojis

Storyboards were sketched to visualize the scenarios in which our users would use the intended solution.

End to end Task Flow of the proposed solution
EXPERIMENTATION STAGE – LOW-FIDELITY PROTOTYPES, USER TESTING & HIGH-FIDELITY PROTOTYPES

Designing the prototype and testing it with users was a considerable challenge because our design uses augmented reality glasses. We designed two versions of the interface that the user will interact with. Photoshop, Photographs, and Balsamiq were the tools employed to design the prototypes.

Low-fidelity Prototypes
The grocery list from the phone gets transferred to the glasses memory system through Bluetooth connection. The list re-optimizes according to the nearby reach of the item in the store. The user views the grocery list on the glasses interface. The interface then directs the user where that particular item is placed in the store.
The information relayed next to the item is categorized into three parts, Health, Price & Quantity. The value of each category is depicted by the means of emojis which aids the user in decision making. The user can further interact with the interface to view detailed information of each category.
High-fidelity Prototypes
 

AFTER THOUGHTS

We believe that the use of Augmented Reality is a novel solution to enhance people’s grocery shopping experience. It is a relatively less explored application with glasses. In order to have a better-designed system, our next steps are as follows:

  1. Create an instructional demo which first time and experienced users can take a look at to understand what functions and gestures need to be performed to interact with the interface
  2. Since AR is a new, less adopted technology with limited users, evaluating the design would be a challenging process
  3. We believe that more usability evaluations and iterations are necessary to improve our device’s appearance and functionality

DoubleMap – Usability Evaluation

DoubleMap – Usability Evaluation

DoubleMap

Usability Evaluation of a mobile application that allows real-time tracking of shuttle services

OVERVIEW

We performed Usability Evaluation to assess the overall effectiveness and experience of the DoubleMap application for its target users. In this project, we identified pain points where users get confused and tasks which they were able to perform with ease. Evaluation methods like cognitive walkthroughs, think aloud observations, and heuristic evaluation was applied to measure the usability of the system. Design recommendations were suggested for all the usability issues discovered throughout the evaluation.

ABOUT DOUBLEMAP

DoubleMap is the web and mobile application designed to track the shuttle services and municipal transit systems across various campuses. Campuses include universities, corporate complexes, hospitals, and airports. The application is available on both Android and iOS platforms.

OUR STUDY OBJECTIVES

The goals of our evaluation study were as follows:

  1. Assess the overall effectiveness of DoubleMap for different types of users
  2. Identify features of the application which users easily learn
  3. Identify obstacles in the application where users struggle
  4. Determine opportunities for design improvements

THE EVALUATION PROCESS

UNDERSTANDING STAGE – TARGET USERS, APPLICATION TASKS & COMPETITIVE ANALYSIS

Target Users

The primary users of the application include students/staff, corporate/company employees, Hospital staff, Airports and Municipal transit users. Bus drivers and campus administrators who manage new and current routes or buses are secondary users of the system. We designed a persona that would sufficiently meet DoubleMap’s majority user base.

Fig. Susan’s Persona

Common Application Tasks

  1. Finding the nearest bus stop
  2. Add favorite stops
  3. Searching for relevant bus arrival timings
  4. Set up push notifications to get notified about bus arrival
  5. Checking for service announcements or any delay in bus arrival due to unforeseen conditions
  6. Provide feedback to the system (if any)

 

Fig. Typical user task flow

Competitive Analysis

Competitive analysis was conducted with the below competitors of DoubleMap

  1. Transloc Rider: It is a similar app that provides real-time bus updates and announcements. It is used by many transit systems and university campuses
  2. RideCell: It is a company that provides ride/car sharing applications. It also provides services for fixed routes fleet automation. Works similar to Transloc and DoubleMap

TESTING STAGE – CONTEXTUAL INQUIRY, COGNITIVE WALKTHROUGH & HEURISTIC EVALUATION

Contextual inquiry sessions were conducted with some students on the IUPUI campus and some were conducted in their individual apartment. The sessions followed a method where the user performed the tasks and the observer only interrupted in case the user was confused. The following things were recorded:

  1. Amount of time taken to perform a task
  2. Patterns of behavior, pain points, and places where users face difficulty
  3. Alternate approaches to performing a certain task

Fig. Contextual Inquiry sessions

The focus of the cognitive walkthrough session was on understanding DoubleMap’s learnability for novice users. In this session, we went through all the sequence of tasks involved and asked questions from the perspective of the user.
Fig. Cognitive Walkthrough session

For the Heuristic Evaluation, we judged the application based on Jakob Neilson’s ten usability heuristics of interface design. The heuristics can be found here. https://www.nngroup.com/articles/ten-usability-heuristics/

FINDINGS STAGE – QUANTITATIVE & QUALITATIVE RESULTS

Ten participants were recruited for the usability study out of which five were novice users and others were experienced users of DoubleMap.

 

The time taken by users performing basic application tasks were recorded and plotted on graphs

 

 

The overall success rates of novice vs experienced users was measured.

 

After completion of all the tasks,  we asked users a couple questions regarding DoubleMap in the post-task questionnaire. We received the following responses.

 

Does DoubleMap solve the purpose of real-time tracking of buses?

 

 

85% participants agreed that DoubleMap solves the purpose of real-time tracking of the bus locations while 15% disagreed with it.

 

Did DoubleMap meet your expectations?

 

 

85% of the participants agreed that DoubleMap meets their expectation level whereas only 15% of the participants disagreed on this.

 

Quantitative Insights

The following insights were discovered:

  1. Novice users completed 84% of all the tasks whereas experienced users completed 96% of all the tasks
  2. Finding the estimated arrival time of the bus (ETA) had the lowest completion rate of 70% as compared to all other tasks
  3. On average, new users took 20 seconds longer than experienced users to find the nearest bus stop from their location & selecting a bus route to the desired destination stop
  4. 100% success rate was observed for all the participants for finding the IUPUI campus system on the application, finding the nearest bus stop from the current location & tracking the location of their bus

Qualitative Insights

DoubleMap’s overall design was leveraging Google Maps APIs, so most of the users experienced resemblance with google maps quite useful. The following comments were noted:

  1. “App is good. Especially real-time bus tracking”
  2. “Bus Tracking feature is accurate”
  3. “Toggle buttons for selecting/unselecting routes  are clear”
  4. “Changing routes was easy”

System Usability Score(SUS)

Based on the calculations, the SUS for the application was determined as 81.25 where individual scores varied from 75 to 87.5. Overall, this score is a good usability score. DoubleMap is usable but has definite scope for improvement.

RECOMMENDATION STAGE – SCOPE FOR DESIGN IMPROVEMENTS

GPS enable prompt

Existing System Design

When GPS is disabled, system does not provide any prompt to enable it

Recommended System Design

GPS prompt to be shown to the user

Search Bar & Destination Stop

Existing System Design

In the current Home screen view, user cannot search for exact stop location

Recommended System Design

We introduce a search bar to search for stops and a new location to destination finder

Estimated Time of Arrival

Existing System Design

Confusing Routes and ETA information

Recommended System Design

A table based ETA and Bus route information for quick reference

Feedback

Existing System Design

The current feedback system pops up a bunch of options which confuses the user

Recommended System Design

A rating based feedback system for quick response

CONCLUSION

Overall DoubleMap does an effective job of creating a good impression on users by doing the following things:

  1. Real-time display of bus locations
  2. Provide timely announcements about the service to the users
  3. Display accurate estimated arrival times of the buses for each route
  4. Intuitive and minimal design – It’s easier for user to remember the task flow

Tag Along

Tag Along

TAG ALONG

Helping people find activities near them so they don’t have to disrupt their schedule just to have fun.

THE PROBLEM SPACE

Interaction between individuals is a basic human requirement. At some point in time, each individual has been seeking to interact with those with whom they share mutual interests, skills, or cultural background. For some, this comes easy, but others find it difficult to approach people and establish a mutual relationship. Even ignoring the different kinds of personalities, the act of finding people itself can be difficult. Tag Along is for those who are new to a community and are seeking others who share similar passions or activities.

tag along login page

SOLUTION OVERVIEW

Tag Along is designed to help people find activities near them, so they don’t have to disrupt their schedule just to have fun.

tag along search and events calendar page

CREATE & JOIN EVENTS INSTANTLY

Tag Along makes it easy to set up or join small events, getting users into contact with others who have similar interests.

tag along reviews

IT IS REVIEW BASED

User reviews help the users feel comfortable when meeting up, putting them at ease so they can have fun.

THE DESIGN PROCESS

PRIMARY RESEARCH

We conducted four interviews that provided unique insights into how we will design this problem space.

We identified the following three key aspects that our potential users find most important

TIME

The users we interviewed expressed difficulty in trying to make plans with others when each party had limited time available

TRUST

People will always be faced with the uncertainty, anxiety, and concern that comes with the unknown, or in this case, a stranger with similar interests

INTEREST

The users exhibited a strong desire to meet people with common interests / skills as a potential learning opportunity

TARGET USERS

The potential users of the system will be anyone who is new to a place/community or even the localities, but who are looking for someone who shares similar passions. Additionally, it would also work for anyone looking to socialize for recreational activity. This would encompass both, the young and the old.

tag along user persona

USER SCENARIO

David is a young adult from California. He loves to play chess. He recently moved to a different state and finds it difficult to find people interested in playing chess with him during the evening or weekends. Online chess sites do not attract him much since he loves to interact with people in-person. Also, the chess clubs near him are pretty expensive and David is unable to afford it for the time being.

 

HIGH FIDELITY PROTOTYPES

We performed usability testing on the low fidelity prototypes and designed the final UI for the high-fidelity prototypes using Sketch and Invision.

sign in and sign up screen

SKETCH DESIGNS

Sign in & Sign up screen

Event details & Notification Screens

Event details & Notification Screens

Categories & Sub Level Games Screens

 Categories & Sub Level Games Screens

Create Events Form & Home screen

 Create Events Form & Home screen

sign in and sign up screen

New User Welcome & Search Events Screen

Events Created & Joined Screens

Events Created & Joined Screens

Attendees List & Review Screens

Attendees List & Review Screens

AFTER THOUGHTS

The opportunities that Tag Along can bring is the promotion of socializing and getting the community together through the individual’s shared interests. It will be a step towards promoting diversity and would serve as an opening for people who find it difficult to socialize and might reduce social anxiety. Therefore, our future work includes the following:

  1. The user flow while joining an event needs to be reviewed further as it took more time for our users to join an event.
  2. Currently, Tag Along only offers basic text chat functionality. However, in the future, it would be good to add additional options such as voice and video chat.
  3. Companies like Uber or Lyft could be potential partners with integration worked into the navigation portion of Tag Along that offers to book a ride when you look up the directions.

TEAM MEMBERS

Andrew Lowery

Aziz Khilawala

Jack Phipps

Vishakha Kumari

MY CONTRIBUTIONS

Interviews

Cognitive Walkthroughs

High Fidelity Prototypes

Usability Testing

Documentation

 

METHODS

Interviews

Secondary Research

Prototyping

Cognitive Walkthrough

Think Alouds

 

DURATION

1 week

 

DO CHECKOUT MY OTHER PROJECTS

Design Space

Design Space

DESIGN SPACE

A collection of design artifacts

QUINNOX INC. INTRANET REDESIGN

Designed a web page concept for Quinnox’s intranet redesign project. The design was executed using an open source design tool called GIMP.

PRINT ADVERTISEMENTS

The following print ad was part of the Doodle Ad Fest competition organized by Manthan School of Creative Advertising & Art.

COVER DESIGNS

A collection of facebook cover photo designs

DO CHECKOUT MY OTHER WORK