Introduction
In this project, we explored the grocery shopping experience and aimed to create a refined in-store experience that maximizes positive interactions and empowerment for patrons. The COVID-19 pandemic has disrupted traditional patterns of in-person shopping, leading to an increased interest in online grocery shopping.
Our goal was to understand the needs of grocery shoppers and develop a shopping experience that is both immersive and enjoyable, while also making it easy for people to find what they need quickly and efficiently. We began by conducting research through interviews and observation to analyze our data using appropriate methods. We then started to sketch and prototype a solution using low-fidelity materials, creating multiple iterations of our design. Throughout our design process, we evaluated our solution at multiple stages to better understand and improve upon our design outcomes.
Our final deliverables included digital documentation of our entire design process, including the methods and rationale we used to arrive at our final design, along with multiple forms of representation that communicate our thought process and final outputs to an external audience. We also created a presentation video that explained the core functionality and user flow of our design to a layperson in the "Common Craft" style. Our team consists of two students majoring in animation, one student majoring in web design and one student majoring in UX design.
Initial design space
Our final deliverables included digital documentation of our entire design process, including the methods and rationale we used to arrive at our final design, along with multiple forms of representation that communicate our thought process and final outputs to an external audience. We also created a presentation video that explained the core functionality and user flow of our design to a layperson in the "Common Craft" style. Our team consists of two students majoring in animation, one student majoring in web design and one student majoring in UX design.
Preliminary Research
Purpose and Goal Research
This preliminary research phase gains a deep understanding of contemporary grocery shoppers and their needs in the physical store environment. The goals are to identify pain points, challenges, and opportunities that arise during the shopping experience, as well as to explore potential solutions that can improve the shopping experience for patrons. We hope to learn about shopping habits, preferences, and expectations, as well as the types of products and services that are most important to shoppers. We will also explore the role of technology in the shopping experience and how it can be leveraged to enhance the shopping experience for patrons. The ultimate goal of this preliminary research phase is to establish a foundation of knowledge and insights that will inform the later stages of the project, including ideation, prototyping, and evaluation. By gaining a deep understanding of contemporary grocery shoppers and their needs, we can create a more refined and engaging shopping experience that maximizes positive interactions in the physical store environment.
Our research results provide valuable insights into the shopping habits and preferences of grocery store patrons. We conducted interviews with a range of individuals and discovered that factors such as affordability, proximity, and promotions/sales played a significant role in their decision-making process. Time was also a crucial factor, with many interviewees preferring to shop at specific times to fit their schedules. Our observations in various stores such as Walmart, Indian grocery stores, Target, and Costco highlighted that more packaged foods are targeted towards consumers, while fresh foods are less emphasized. Unhealthy foods were positioned at the beginning and end of aisles, with healthier options in the middle. Self-checkout was also preferred over traditional checkout methods.These research findings can inform the design of a more refined and engaging shopping experience that maximizes positive interactions and empowerment in the physical store environment. By prioritizing fresh foods and changing the positioning of items, grocery stores can create a more engaging shopping experience that meets the needs and preferences of their customers.
During our interviews, we gained valuable insights into the shopping habits and preferences of grocery store patrons. The purpose of the interviews was to understand the user's needs, preferences, and pain points when it comes to accessing recipes and grocery store information, as well as to gather suggestions for improving the app. By conducting interviews, we were able to gather qualitative data that helped us better understand the user's perspective and make informed design decisions. Our sampling strategy was to ensure a diverse sample of potential users, we selected individuals who had interest in shopping but didn’t know how to cook, experienced cooks and people with different cultures. Our sampling strategy allowed us to gather feedback from a range of potential users, providing valuable insights that helped us refine our mobile app design. One interviewee reported shopping at Safeway and Costco because they are close and affordable. They typically shop for food and household items for a family of three to four people. Time was also a factor, with the interviewee preferring to shop around 1 pm so they could do other things at the same time, such as have lunch. When it comes to deciding what items to purchase, promotions and sales, as well as the freshness and packaging of items, were reported as the biggest factors.
Our observations in Walmart revealed that there were more people in the packaged food aisles compared to the normal food. It also positioned unhealthy foods towards the beginning and end of the aisles, while healthier options were located towards the middle, which most people skipped over. We also noted that there were more people shopping during the weekends, with fewer people in the store during weekdays.
In the Indian grocery store, we observed that the store mostly sells packaged foods that are quick and easy to make, which appeals mostly to college students. The store sells a variety of products, including packaged foods, dairy, toiletries, cooking utensils, and self-care products. The store was quite small, with just two people working when we visited. They also sold a mix of packaged goods from different countries, with a focus on American and Asian products.
During our observations in Target, we noticed that there were a lot of items near the checkout area, including a Starbucks. Self-checkout seemed to be faster than traditional checkout, and larger Target stores had many checkout points available.
At Costco, we observed that there were very long queues, but customers preferred to use self-checkout. It was also noted that a membership was required to enter the store.
Overall, our observations revealed that more packaged foods are targeted towards consumers, while fresh foods are less emphasized. These insights can help inform the design of a more refined and engaging shopping experience that maximizes positive interactions and empowerment in the physical store environment.
As part of our preliminary research, we conducted a contextual inquiry to gain a deeper understanding of the needs and pain points of grocery shoppers. We focused on several key factors, including grocery stores, groceries/food, coupons, price, mobile devices, and our app, as well as the audience or people who use these services.
Through our inquiry, we identified several potential partnership opportunities that could enhance the shopping experience for our target audience. These included options for recipes, access to store locations, product/food price range, serving size, and other nutritional factors.
To further refine our understanding of these opportunities, we focused on a specific group of individuals who like to cook or want to cook but don't have easy access to different recipes or focus on eating healthier. We conducted observations and interviews with this group to gain a deeper understanding of their needs and pain points.
The insights we gathered from our contextual inquiry will inform our later stages of the project, including ideation, prototyping, and evaluation. By focusing on convenience and health concerns, we aim to create a more refined and engaging shopping experience that maximizes positive interactions.
Ideation & Design
After research, observations, and initial interviews, our group decided that our goal was to create a product that would promote healthier foods in grocery stores as well as helping people expand their selection of foods. Our user group became targeted towards people that want to learn how to cook, want to be healthier, or already know how to cook and are looking for more recipes to create.
These sketches provide ideas about the initial idea of the UI of our app titled FoodChat. The logo includes the usual tools used in cooking and baking. The first page on the left showcases Recipes in a format similar to that of Instagram or Facebook, where either popular ones or ones that adhere to the likes of the user are shown and can be scrolled through by that user. There are also users on the top that can be clicked on to find other recipes or people to find ideas from.
The next page is titled Search, and when first designing this page our group thought it would be more of a page to find someone specific.
The Post/Create page is for a user to make a post of their own recipe. They would title the dish, show the ingredients, the serving size and how many people it serves generally, and then would add any additional tags of their choosing.
The fourth page is titled Message, and is used to just communicate with different users throughout the app.
The final page is another standard page showcasing a user’s account, allowing them to adjust any settings, posts, or security within the app.
Overall our initial idea of the app FoodChat was an app that could be used similar to Social Media apps, but geared towards recipes.
After coming up with the UI for the app, we decided to list a scenario in order to see the app in use. The purpose of this idea was to find out if the app would work as necessary, and would be an interesting and cool new addition to the grocery stores. We agreed that having a list before entering the store would be a big motivator in getting the correct foods and also sticking to healthier foods. We made the app list out the ingredients in order to let the users have a list of their own and to figure out what they need to get. We found that this doesn’t really help in deciding where to find the ingredients in general, and doesn’t help with comparing between different stores. This scenario inspired us to make the app a bit different in that it would include something called the Market, which would showcase where the ingredients could be found and also any substitutions in case a user has allergies or would like to make a recipe more customizable.
1) Shows an image of the store that the user is going to enter.
2) shows the user entering the store with their phone in hand in order to get their groceries.
3) shows the user using the app FoodChat. They are finding the recipe they want to use and looking at the ingredients in order to figure out what they need to get from the store.
4) shows the user retrieving ingredients such as eggs, bananas, flour, and butter.
Usability Testing
Before we advertised our product, we had to figure out who our audience would be and what our product should address. In order to figure this out, our team went to different grocery stores and made different observations. We noticed that most stores aimed packaged foods towards audiences compared to fresh produce, with most outer aisle being packaged, unhealthy foods and healthier snacks and options being towards the middle. We also noted how expensive physical and digital copies of recipe books were. Most basic books ranged between 15-30 dollars while more high-end recipe books were between 35-60 dollars. These observations helped develop an idea of who our audience would be, those wanting to cook and those wanting to eat healthier.
After we claimed our audience, our group gathered secondary research data to prove how harmful pre-packaged meals are compared to those that are homemade and fresh. As we done our research, we found articles online and from the Purdue library claiming the harm pre-packaged products are. One article written by Celynn Erasmus, from corporate wellness magazine, stated that “Unfortunately, most ready-made meals aren't properly balanced. They either provide too much starch or none at all, some are far too high in protein and fat and the majority of them do not contain enough nutrients in the form of vegetables or salad. To top it all off, most ready-made meals come in servings that are too big, so it is important to portion them correctly.” (Corporate Wellness Magazine). After gathering our secondary research, we began planning over how to create our design and conducted usability tests with those on our first phase of the product, and on our final phase of the product.
During the usability testing phase, the user found the mobile app to be convenient and easy to use. The app's user interface was intuitive, making it easy for the user to find what they needed quickly. The user appreciated the variety and quality of recipes available, as well as the ability to filter and search based on their dietary preferences. The ability to create and share their own recipes within the app was also a great feature. In addition, the user found it helpful to view grocery store reviews from other users, which helped them decide where to shop. The app's mapping and directions features were also useful for grocery shopping. Some insights that could improve the app was to personalize the app to the user so there can be recommendations based on where the user is and suggest recipes and grocery stores based on the user’s search history or dietary preferences.
Some users also expressed their confusion over the ingredients and post aspect of the app. They gave advice about adding some sort of list to choose from when posting about recipes to prevent people adding unnecessary items or items that are misspelled or don’t exist. Other than that aspect of the app, the user thought the idea would be well-liked by many and would be easy to use.
(The user diagram is divided into different categories: How the user thinks and feels, what the user sees and hears, and what the user says and does in the store There are also categories at the bottom of the diagram that list the pros and cons to the task, the goal overall, and the tasks users would do to achieve that goal.)
After finding more research, observations, and interview data, we created User Maps in order to highlight the users needs and wants when creating this product. Our two target audiences, people who want to learn to cook and be healthier as well as people who already know how to cook and are looking for new things to try, were evaluated with this method. These evaluations showed us what aspects of our app we needed to focus on, and the feelings of the user and how they would most likely want the app to be geared towards their needs and wants. The user group that consisted of people who wanted to learn how to cook wanted more healthy food, and so we tried to incorporate a wide variety of different recipes to make. The other user group of Experienced Cooks would be more inclined to already know what food to find in order to make good recipes, and so the app would once again contain multiple different recipes in order to widen the range of recipes that a person would make or try. These user maps helped our group realize the amount of options and different types of recipes that should be allowed, and this idea was highlighted with the social aspect of the app. The app will constantly be updated with all different types of people including their recipes or giving recommendations, which will in turn benefit both people who want to be healthy and learn to cook, and people that already know how to cook and would like something new.
Solution
When compiling our ideas from sketches, interviews, usability testing, and observations, we came up with our Final Storyboard. The Final Storyboard is meant to showcase our product, FoodChat, in action, and how it would be useful in the store interaction for a user.
Final Storyboard
(Pictured above: A college student wants to prepare ingredients to cook a healthy meal.However, she sees there is no food in her fridge. So she goes on her phone and opens the FoodChat app. There she finds a recipe to choose from and compares prices and location for the needed ingredients. After she chooses a recipe and has her list of items, she leaves to the grocery store. After that, the student grabs her groceries; she heads back home and follows the recipe to make her nutritious meal.)
Final UI Design
When compiling our ideas from sketches, interviews, usability testing, and observations, we came up with our Final Storyboard. The Final Storyboard is meant to showcase our product, FoodChat, in action, and how it would be useful in the store interaction for a user.
(Our final product design is an app called FoodChat, which helps users access an array of different ingredients and recipes easily. The app helps users locate ingredients, allows comparison in prices, and also establishes customizability. These features help users who want to cook and also want to eat healthier.)
Design Rationale
The goal of the mobile app is to provide a convenient and user-friendly platform for accessing recipes and grocery store information. Our design approach prioritizes ease of use and accessibility, with a clean and intuitive user interface that makes it easy to find what you need quickly. We also aim to provide a variety of recipe options that cater to different dietary preferences, as well as the ability to create and share your own recipes within the app.
Our decision to include grocery store information and reviews is based on user feedback that highlighted the desire for a comprehensive resource that includes both recipes and grocery store information. By integrating this information into the app, we hope to simplify the shopping process for users, making it easier to plan meals and find the ingredients they need.
In terms of visual design, we opted for a minimalist approach with a neutral color scheme that puts the focus on the content. We also made sure to include high-quality images and videos to make the recipe section more engaging and visually appealing.
Overall, our design rationale for the mobile app is centered around providing a convenient and user-friendly platform for accessing recipes and grocery store information. We believe that our design approach prioritizes ease of use and accessibility while also providing a comprehensive resource that meets the needs of a diverse range of users. The app is meant to encourage users to visit grocery stores to get their items because lists make shopping easier and more enticing.
Our design is meant to create a healthier environment for people who enter stores, and give them more options when picking out ingredients and foods to cook and eat, as well as providing new opportunities for those that want to cook. Both users and Grocery Stores will benefit from FoodChat as it will promote people to go out to stores and will help them find different things to buy, allowing them to buy items not usually bought that will help both the companies and the Supermarket.
After this step, we would most likely conduct more Usability Tests and Observations in order to find what else could be updated about the app. We would need to figure out how to make our app more appealing compared to other apps that already exist that attempt to accomplish the same goal FoodChat does. We also had originally thought about incorporating some sort of rewards system, and if we had more time we would talk with users about this idea and if it would be beneficial in creating a more effective product.
Team Contributions
Alexia Gil:
Gathered secondary research for data use
Edited script
Edited video
Created Video Visuals
Created Storyboard and Final Storyboard
Created and edited descriptions on Documentation
Did Usability Testing
Shruti Atitkar:
Conducted Interview
Gathered Observations at Indian Grocery Store
Created Final UI (Figma)
Created Scenario
Created Individual UI Screens (Drawn) (Found in Appendix)
Explained Functions of UI (Found in Appendix)
Worked on Documentation
Neo Agrawal:
Conducted interview
Gathered observations at Target and Costco
Helped designed preliminary presentation
Worked on script
Worked on documentation
Found article sources
Mackenzie Jacks:
Gathered secondary research for data use
Wrote and edited script
Created Design layout for app/products
Wrote and edited on documentation
Develop ideas and contribution within group
Did Usability Testing
Hall of Projects
2023
2023
2023
2023
PROJECT3: “fake out”
© 2023 All rights designed, developed and definitely owned