UX | Mobile App Design: Safe Delivery
September 04, 2020
User Integrated Design for Interaction
(CCT480 at University of Toronto )
User Experience Design
(CCT485 at University of Toronto )
Online grocery shopping mobile application
Figma | Sketch | Adobe Illustrator
During the COVID-19 pandemic , even the activities that we once considered daily could be difficult to do, and grocery shopping is one of them. Due to the rapid spread of the virus, the majority of people are afraid to go outside and buy daily necessities. Therefore, online shopping has become the prior way for people to purchase groceries and food during the pandemic time.
After our initial observation and ideation, we came up with a design for an online grocery shopping app that would help users purchase grocery more safely and conveniently and with a better online shopping experience.
For our group observation, we observed our friends, family, neighbors, and interviewees from social media platforms. We found that people have concerns about going out in public because of the pandemic. Also, most people reflect that they have encountered many issues while using online shopping websites and apps.
1.Background research: Our background research was mainly conducted online, and we only focus on the current situation of stores, the government policy about shopping during the pandemic, the number of positive cases discovered at the stores, the actions that stores take to keep people save from COVID-19, and the methods, concerns and frequency of people shopping during the pandemic.
2.Primary research methods and secondary research sources: Since we were trying to figure out the opinions of people who go shopping and employees at the stores, we interviewed and surveyed all adults. We used industry reports for the secondary research.
3.Stakeholders: We not only considered people at the stores, since they were more likely to visit that place, which might create a bias. We also considered people around us, adults from all age ranges. We would also consider employees at the stores since their work might also be affected by the pandemic
● One-on-one moderated usability test: We conducted one-on-one moderated usability tests with our participants via different online platforms such as Zoom and WeChat. We provided a case scenario and asked participants to complete a total of five tasks.
● Survey: Participants are identified via a snowball sample and selected according to different age ranges.
● Interview: We briefly interviewed the participants after the test to collect their feedback. The interviews are conducted via the same online platforms as the one-on-one moderated usability tests.
From the results of our interview, participants expressed different concerns that stop them from visiting grocery stores. The most common concern mentioned is health and safety issues during COVID-19, such as crowded stores, customers and employees not wearing masks or not following social distancing and increasing confirmed COVID-19 cases.
Other concerns include that products might be sold out and unwilling to go outside for some reason. Some shared their methods of dealing with health issues such as wearing masks and gloves, going to stores that disinfect, and avoid going shopping when too crowded.
In order to further understand the needs of our potential users, we designed a set of questions to ask on Google survey to collect responses online. We also used SurveyMonkey to collect the data of pre-study and post-study questionnaires.
From the participants surveyed, 43% of the participants would buy grocery once a week and 28% go 1-3 times a month. The majority of the participants reflected that they go grocery shopping less frequently compared to before COVID-19.
Distance (71%) and Safety (67%) are the two major factors that affect participants' decisions on choosing a grocery store.
Although grocery shopping is necessary, people are worried
about contacting infected people.
The shopping experience of the online website is boring and unsatisfying.
The navigation of online shopping websites is unnecessarily complicated.
When checking out online shopping apps, people are confused about payment methods.
Some products are not detaily described on the websites, and the image quality of the products is unexpectedly low.
The elders feel confused and uncomfortable using mobile devices and the process of online shopping.
After analyzing both user pain points and research, we came up with a design an application that can help people purchase the groceries online efficiently, which called "Safe Delivery". As a platform, the application can help people buy the products quickly and easily without interacting with others. In this way, it can reduce the risk of getting COVID-19 and prevent people from feeling anxious and scared of going out.
Design principles:
● Efficiency: Customers can save time on looking for products.
● Convenience: Provide both pick up and delivery services. Customers do not need to go outdoors to buy groceries in-store.
● Hygiene: Help with avoiding interactions with other people.
● Up-to-date Information: Customers can get the latest information of products.
1.Material: We used Zoom and Wechat to interview our participants. In order to conduct our contextual inquiry, participants are required to complete several shopping processes through the websites of Walmart and Metro.
2.Data: We aim to collect data that may help us understand the shopping habits and preferences of our participants. We are discovering problems or issues that often occur while shopping online.
3.Goal: Providing solutions that help to solve people’s pain points toward online shopping. Improving people’s online shopping experience and helping people to purchase groceries more safely and conveniently.
In order to visually predicts and explores a user's experience with Safe Delivery, we produced 3 storyboards.
Brief features and functions
● Users can see lists of available stores nearby and their sanitization status.
● Users can choose different payment methods and choose to pick up or deliver their product.
● Users can see the latest information for selected products.
● Users can search for the product and see the inventory in the main page or a specific store.
● Users can track their orders by viewing order history.
● Users can review and rate a grocery store.
Design changes
● Users can either login to an existing account or register a new account. If users do not want to create an account, then they can click the “Skip” button.
● If users choose to create a new account, they are required to provide username, password, and phone number. Users can also choose to login with their email, google account, and etc. (partnership with other companies)
● If users forgot their password, they can click the link at the bottom to reset or change their passwords.
● On the home page, users can choose search product, search store and view profile.
● If the users want to checkout store information. The page would show up closet stores information and a visual map that indicates all the nearby stores location.
● Providing information such as, rating, phone number, open hours, distance, sanitization and COVID status.
● Providing a search bar that enables users to input keywords.
● Product category page where users can view all the available products.
● Contain high-quality product image.
● Detailed product description.
● Consumers should be able to see the rate and review of the products.
● Add item to cart and change item's quantity.
● Order summary at the top of the page.
● Users can enter shipping addresses and select payment methods directly.
● Users can also make quantity changes at this stage.
● Users can choose between pick-up and delivery.
● Users can check their ongoing orders.
● Change delivery address and payment methods.
● Review and tip orders.
● Get help and contact the platform.
● Add order cancellation and recall functions.
● The payment method is too simple. Besides paying by credit card, users hope to pay by wechat, Alipay and ApplyPay.
● In addition to showing store ratings, users want to see feedback from reviews posted by other users to help them make better choices.
● Set up a "favourites list" option in the user page, you can add your favorite items to the list, the next time they purchase can be directly added to the shopping cart.