Safe Shopper

UX, UI, User Research & Content Strategy
Course: IAT 334 - Interface Design
Team of 5: Len Huynh, Jasmeet Kaur, Andrew Tsui, Clayton Cheung, Peter Huang
Role: User Research, Interaction Design, Content Strategy & Video Editing
Tools: Figma, After Effects, Premiere, Photoshop
Time: 7 weeks (June-August 2020)
Deliverables: Video, Prototype + Presentation Slides
Safe Shopper is a mobile solution that tackles challenges brought on by COVID-19 that supports shoppers with making informed decisions on how to approach their essential shopping trips. Store data can be compared simultaneously in real time so shoppers can optimize their trip protect themselves and others in the community by supporting good health promotion initiatives.
DESIGN DOMAIN

Discovering The Problem Landscape

“Essential services are those daily services essential to preserving life, health, public safety and basic societal functioning. They are the services British Columbians come to rely on in their daily lives.” — gov.bc.ca (accessed June 2020)

Research

Finding Out Where To Intervene
We wanted to provide a solution to the above context, but needed to find out what has already been done, where and how we could intervene if their was an opportunity.

We conducted research using recent sources (at the time of the project) such COVID-19 news in broadcast media, local health authorities, social media discussions in our peer network, and any COVID-19 apps that were already made and served Metro Vancouver. We also took into account of the new updates from our local health authority on their progress of studying the virus's potential impact to public health too.
Results Findings
By analyzing online conversations on social media and the web, we found two themes dominating the discussions. The first is how commenters were expressing anger, fear and frustration towards fluctuating news on social distancing with people supporting and against it.

While not specific to any organization's social media, posts reporting about COVID-19 and its regulations had comments venting of the lack of accessibility of personal and public services. (Ex. Hours waiting for a customer service agent on the phone for assistance on claiming COVID-19 related financial support that they were eligible for or booking a specialist appointment.) Most of these comments were posted as a one-time input and not every comment generated a discussion for further analysis.

Three of our team members noticed that there were more sponsored posts and 'giveaways' from local businesses and creators in our Instagram feeds with the message of 'support local'. So we hypothesized that social distancing restrictions were pressuring them to find alternative ways to generate revenue and engagement.

Therefore, we narrowed down our possible intervention spaces to shopping, and recreation in larger shared spaces like transportation, dining, doctor offices and medical laboratories.
User Research
To find out who we could design for, we made a Google Form survey with questions asking for the participant's demographic data and how they were navigating public spaces. We also wanted to find out what other challenges social distancing were impacting in user's daily life as well. We also asked our survey participants for their participation in a 1-on-1 interview to discuss what other challenges social distancing has brought into aspects of their life, such as relationships, scheduling and mobility. (We also asked about what they were already doing to adapt to the situation.)
Results Summary
16 survey responses and 5 interviews. Our survey results showed that 31.25% to 53.85% of our participants had specified feeling additional stress that impacted their daily life, especially with tasks such as essential shopping and managing their existing health issues (e.g. routine checkups, testing).

Through our 1-on-1 interviews, stress was most significant to this group because of potential exposure to the virus amongst surfaces and within other's social proximity. This is due to the extra time they spent outside for necessary tasks, like essential shopping. (Ex. longer line ups, moving to different locations if stock had been sold out.)

Delivery apps/services were reported as a poor option because of lack of variety offered through apps or personal preference of the interviewee's shopping habits. (For example, a person whose lifestyle includes a dietary restrictions or cultural diet lack diverse options of goods in the online menu, such as fermented goods.) The additional fees that came with using theses apps also deterred some people from using it at all.

Overall, we concluded that the sudden need to adapt and facing health risks were causing the problems that could impact personal health and lifestyle for immunocompromised individuals.
Target Audience
Our research led us to create two kinds of people to design a solution for: the person who is in charge of house hold affairs and the person who lives an independent and practical lifestyle. They share 3 key pain points that impacted their autonomy, financial health and comfort toward ambiguity.


Building The Solution

Initial Design Opportunity

“How might we help our users plan their essential shopping trips according to the external COVID-19 environment while keeping safe within their local economy?”
Context: With the research and key insights done, we've asked 'how might we' questions to identified a design opportunity in our problem space.


Solving Design Opportunity
  • Give users a platform to see recent updated information about their destination during their shopping trip(product availability, real-time occupancy etc.)
  • Enable community engagement through health-centered reviews on stores and encourage behaviors that support health promotion guidelines
  • Increase visibility of stores (small grocery shops) nearby users location for local shopping
  • Incentivize both users and businesses to support health promotion initiatives

User Testing Methods

Remote Observation Method
We conducted 30-45 min remote observation sessions through video calls (ex. Zoom). The research team observed how the tester went to complete tasks on the Safe Shopper interface. An interview was conducted afterward with qualitative based questions before sending a survey for the users to provide their final comments.
User-Managed Method
A questionnaire with suggested tasks was offered to our testers to record their first impressions.  This method was only applied when we dealt with connectivity and time constraints. This method helped us capture our tester's thoughts that could have been missed if we relied only on ideal methods.

Feedback Results

Improve Branding Throughout User’s Journey With Content/Copy
Our testers’ expected that Safe Shopper was an ecommerce app and sought for similar features like InstaCart. Most of them realized later in the session that our solution was not intended to be for ecommerce but a safe navigation component to their physical in-person shopping trips. Some examples of what our users expected to do were finding how to purchase items or where to put their payment information.
Solution
Our apps intention is to support health promotion behaviors while users are shopping in-person. To support our narrative, we added more health-promotion content at critical touchpoints such as the onboarding phase and home page to explain how the app should be used. We've eliminate empty sentences in the copy and revised our tone as straightforward and conversational.
Visual Design Needs To Provide Directional Clarity For The User
70% of our users had significant delays when interacting with our CTAs and navigation elements. For example, a horizontal menu tab on a Store Page was designed to be swiped but our users had spent time figuring out whether they should click or scroll. 20% of our testers commented that this part of the app was not working and moved on to other parts of the app.
Solution
We needed to evaluate the app’s holistic experience and define directional clarity, specifically the journey it takes the user to complete a goal. The visual and interaction designer worked closely to add consistency and cohesion to the experience than work separately after meeting. Other team members tested the revised iterations, provided more feedback and helped the duo-designers present this iteration to the teaching team for additional feedback.

Reframed Design Opportunity

“How might we help our users make informed choices with consideration of their personal and community’s well-being as they navigate the external COVID-19 environment during their essential errands?”
With the feedback we received and the iteration process we reframed our design opportunity to clearly articulate the user's problem, and define the solution's value.
Design Guidelines
These are the design principles created for a visual consistent experience.


Final Solution

Safe Shopper

Safe Shopper is a mobile app that helps users make informed decisions on their essential shopping trips by simultaneously comparing store data, product availability and COVID-19 safety plans at multiple destination points while keeping themselves and their communities safe.


Context: With the research and key insights done, we've asked 'how might we' questions to identified a design opportunity in our problem space.
How Does Safe Shopper Help The User?
Users save time during their shopping journey by informing them of updates on their destination points.
Enable community engagement through health-centered reviews on stores and encourage behaviors that support health promotion guidelines
Increase visibility of stores (small grocery shops) nearby users location for local shopping
Incentivize both users and businesses to support health promotion initiatives

Key Takeaways + What I'd Do Differently

Listening includes the things that are spoken and not spoken
The user research, testing and critique sessions was an important lesson to build on my listening skills- specifically towards the words that were and were not spoken during our design process. Thinking of the holistic user experience helped with maintaining integrity in solving our user's problem.
Fail fast, learn fast
Since the project was conducted during a time of relevance it helped me recognize how design is essential to solve problems and improve situations of users because of how others were responding to the situation.
Considering product life cycle
I would consider incorporating feedback from business owners and further develop their side of the app as well. In addition, my team and I would spend some time to consider other features that could extend the lifecycle of the product, than just a temporary solution to solve the ongoing pandemic.

After The Semester...

Our project won the Student Category in theVancouver UX Awards 2020!

So, what’s your story?

Let’s see if our conversation can lead to a new chapter, I prefer to listen. 😉
You can find my contact below!