What is this project?
Due to the novel COVID-19 pandemic, grocery shopping has become stressful and time-consuming. Although this experience is difficult for everyone, elderly people and individuals with underlying health conditions specifically, may not be able to get the resources they need to sustain themselves through this pandemic.
As a solution to this issue of accessibility and independence, our team proposed a mobile application that allows affected individuals to order items from a variety of grocery stores, to be delivered to people's homes. COVIDcart is a shopping app designed to facilitate the order and delivery of various grocery store products, whether it is directly to customers’ doorsteps or for pick-up in-store. This app is designed for individuals who are unable to shop at an in-person grocery store during the COVID-19 pandemic. The app’s simple design and easy-to-navigate features provide accessibility to older populations (45+) who may typically struggle with the learning curve of mobile devices.
Overview
Home
Start off the app's navigation with sign-in or single-use account options. The app also offers accounts via social media.
Category-based interface
Users can order their groceries by searching through various categories like special offers, store-based items, or types of items.
Search and Filter Options
Users can search for items using the separate search page which also has options to filter and sort according to the shopper's preferences. The user can use tags like "vegan" or "gluten-free" to filter out results.
Easy Ordering
The app includes a straightforward interface to help older populations effectively order groceries. The icons and layouts are larger than usual to cater to people with weaker eyesight and visual impairment.
Quick help
The app offers access to immediate help and resources via the FAQ page. It includes solutions to questions and concerns shoppers may have throughout their app experience.
User Research
Goals
What we hope to gain from this process
1
2
3
Test our product concept with a specific user audience
Since our app targets a unique audience, we wanted to gain insight into the challenges faced by this specific age range and how we can help alleviate the stress caused by these challenges.
Reveal necessary functions and experiences to be incorporated
Using this research, we hope to find any holes in our thinking and better develop our concept to fit a universal need. We also wanted to make sure we create a product that caters to an older audience in terms of technological comfort and convenience.
Identify specific problems to target for the development of the app
Other than the issues we considered, we hope to reveal any important factors that we could not identify, and consider incorporating solutions to these issues.
Personas
How, where, why would users use my product?
This product is geared towards people who are unable to or require assistance for grocery shopping, specifically adults over 45 years old. Another target audience is individuals with pre-existing medical conditions like asthma, diabetes, heart disease, etc., to help them through this pandemic without putting stress on their health. This group of individuals includes a wide range of age groups and individuals may be of varying cultural backgrounds.
Though this product is intended to prioritize and help individuals who may have a higher risk of being affected by COVID-19, this service can be used by a variety of audiences. Reducing the number of people making physical trips to supermarkets can slow the spread of COVID-19 and keep people healthier.
SWOT Analysis
Existing products comparisons
-
Several mobile applications, with a similar premise, exist for free download on iOS devices, such as InstaCart and InstaShop.
-
Popular chains such as Walmart, Target, Safeway, Pavilions, and Publix also offer “curbside pick-up” for their customers via mobile application.
While these applications have undoubtedly provided benefits for their users,
common issues with these apps include:
-
Lost items
-
Mis-deliveries
-
High demands causing massive delays in customer service
Technical issues like
-
Glitches
-
Issues with payment
-
Items quickly going out of stock
-
Lack of communication between customer and delivery driver.
Mobile applications also pose difficulty, confusion, and frustration within the senior citizens age group or with people who are unfamiliar with navigating a mobile device.
Technical Requirements
Product specifications
This product is designed to run on a mobile device, particularly one with iOS capabilities. Accessibility restrictions to create media and functionality for older age groups and individuals with disabilities include.
-
Visual impairment including color blindness
-
Larger buttons and functions to ensure smooth use
-
Straightforward interface for functions and menus
-
Sufficiently large text with contrasting colors
Storyboarding
How, where, why would users use my product?
Person 1
Current Situation
-
An elderly citizen with underlying health issues making her at-risk for severe COVID-19 infection
-
Does not have accessible, private transportation to local supermarkets
-
She does not have a caretaker who can grocery shop on her behalf
-
Even if the risk of infection was nonexistent, traveling to the market would be difficult due to old age.
How would they use my app?
-
Help her grocery shop online and have the items delivered directly to her home
-
The delivery driver would leave the items on her doorstep for her to retrieve
-
Moreover, once the quarantine is lifted, she can still use the app to order groceries at her convenience
Person 2
Current Situation
-
A 45 year old, working individual
-
Struggling with financial issues due to the COVID-19 pandemic
-
His business, a clothing store, had to be closed down, since it was not considered an essential business
-
Regardless of his savings, not earning is causing an extra burden on his finances
-
To save in every way possible, he tries to look for affordable food and resources but is unable to find cheaper options due to constant out-of-stock items
-
Sustaining himself and his family by resorting to expensive options is not feasible and is concerning for the long term.
How would they use my app?
-
Using COVIDcart, he will be able look for affordable options through a range of different supermarkets and local stores
-
Alleviate the stress on his finances
-
He will also be able to keep himself and his family safe by ordering the items to be delivered to his doorstep. This also saves money on gas
-
This app can be a resource keeping his family safe, sustained throughout the pandemic and after.
User Survey
Collecting statistical data
Through this survey, we hoped to gain specific insight on user behavior towards grocery shopping during the pandemic. For this, we formulated a set of specific questions based on age, location, difficulties with transportation, etc. to understand our users’ concerns and effectively address them in our product. The following are some of our results:
Wireframes & User Flows
Site Map & User Flows
Creating a map of my app's navigation
Wireframes
Creating a basic idea of the layout of my app
Color scheme
An initial palette of colors for the design
We used a color palette which had bright, bold colors so people with visual impairments would be able to distinguish elements of the interface without strain.
User Testing
Overall Design and Functionality
Goals for testing
1
2
3
Test the product concept and prototype with specific tasks given to users.
Figure out the gaps in functionality causing confusion and frustration.
Identify additions that the users would like to see in the app interface or concept.
First Prototype
Specific changes
Isn't distinguishable as a button, seems 2D
Buttons are inaccessible with a large, scrolling list
Menu is not as visible as the bottom function bar
Text colors and sizes are slightly hard to see
Buttons are too small for large fingers
"Continue" button is not bold enough
Testing Summary
Testing Scenarios
Users will begin off at the start screen and home page and make their way through the app, trying to fulfill their tasks. They will have to use various buttons and navigation to be able to complete the given task.
Tasks
1
2
3
4
5
6
7
Browse products to find a new brand of dish soap.
Order 3 Deli items, pickup in store
Make a list and check off a list item
Get gluten-free flour delivered
Learn how to use the app through FAQs
Make an account and edit your delivery address
Re-order items from your order history.
Participant Profiles
Testing the product with a varying participant profiles
Some Testing Results:
Task 1: Browse products to find a new brand of dish soap.
User 1:
Started at: Start
Process: Browse as guest > Enter address > “See More” Nearby Stores > Search Bar > Searched for “dish soap” > Added to cart > Checkout process > Confirm Order
Ended at: Order Confirmation Page
Difficulties: Search bar too small for her to see what she was typing, difficulties finding the Submit/Enter button on search bar; confusion when clicking on Nearby Stores page because the links weren’t active yet
Suggestions: N/A
Task 3: Make a list and check off a list item
User 2:
Started at: Start
Process: Home > categories > *confused* list button > added items one by one > checked off Ended at: List page
Difficulties: Couldn't find the list page
Suggestions: The text boxes should be empty when typing
Iterating the design with feedback
User testing provided valuable feedback regarding COVIDcart’s navigation, functionality, and design. It also allowed us to predict how future users might interact with the mobile app.
During testing, our participants generally experienced difficulty with navigating the interface. When told to search for a particular page, the many options on both the home screen, footer toolbar, and hamburger menu would confuse older audiences. Certain buttons were also “too small” for older individuals to see without strain, including the search bar and the checkout buttons. Form boxes were filled with default text and it was a nuisance for users to delete this text before typing their own responses. A few links were also broken or led to the wrong page.
To improve our app, we repaired any broken links and interactions. The revised interface will also feature a more prominent “Pick up in store” button. Form buttons and boxes will now display as blank until a user types their responses into the given space; this improvement is specifically noted in the Shopping List page, the Edit Profile feature, and the general checkout process. However, because COVIDcart offers such a diverse range of features, it would be difficult to make buttons any larger without compromising the overall design of the interface. Thus, aside from any minor edits, the navigational features will remain primarily the same. Aside from the initial learning curve, the app remains primarily accessible to those who are willing to explore the interface.
Final Design
Hi-fi Mockups
Final Design
Final Thoughts
Challenges
-
Thinking about elements that would be difficult for elderly people was one of the most vexing tasks.
-
We started off making an interface that was so boxy and plain that the app seemed almost unappealing. Once we had the overall navigation down, we focused on making the app accessible but aesthetically appealing.
-
Even though we used universal icons and elements used on a variety of platforms, some elements were still indistinguishable for our testing participants. We changed these icons early on after receiving initial feedback from our users.
Future Steps
-
A design is never perfect so keep iterating and learning!
-
I hope to develop this design concept into a real application to be used in the online shopping industry.