Responsive UX/UI Project

Project Concept

The concept behind Food Carriage was to create an online shopping service that helps users pick out groceries and find the best prices available by comparing different supermarkets. We also developed a group shopping feature that lets users add friends and shop together. This is ideal for families, couples, and roommates. In addition, we wanted our users to learn about cooking. Another major portion of Food Carriage is a guided recipe section that lets users learn about new recipes and how to make new dishes. The overall theme of our project is to create a digital space that allows users to learn about healthy eating and food availability. Everyone should have the right to a healthy life.

User Research - Qualitative / Quantitative / Interviews

Before my team embarked to create an all in one food experience, we first had to find the needs and wants of consumers. We know healthy eating is a challenge for a majority of the population, otherwise obesity and other health problems wouldn’t be an issue. But why is this? If we are going to really help people, we need to find the best solution that will solve the problem. Or at least give people the option to solve their problems. Overall, we had to figure out who we were designing for.

We began our research with surveying our peers around us to find critical issues that surround them when it comes to food. We handed out a digital form for people to fill out that surrounded the following questions:

• How many hours per week do you work?
• How many people do buy/cook food for?
• How much money do you spend on groceries a week?
• How often do you eat out within a week?
• On a scale of 1-10, how healthy do you eat? (1 being not healthy at all and 10 being always healthy)
• Do you think eating healthy is expensive, why or why not?
• What do you struggle the most with when deciding what to eat?

Developing this questionnaire helped my team narrow down our target audience and figure out what to focus on. From gathering our research, we found that 50% of our users agreed that healthy eating is a problem. This helped confirm our initial idea that people have a problem making healthy choices, with 66% of our test subjects saying they are too preoccupied to make healthy decisions. We also discovered that 50% of our test population felt eating healthy is too expensive. And 100% of those people also stated that they spend 50+ dollars a week on groceries, and that pricing affects the quality of food they buy. After synthesizing our research, my team and I came to the conclusion that our research subjects felt they are too busy to make healthy decisions. This affects the quality of food they buy and what they make for breakfast, lunch, and dinner. This led us to focus around helping people find groceries fast to save time and to help people make their meals.

‍

Personas

Following our user research, we created user-personas to help visualize our demographic and to create a reference that we can look back to when designing.

Competitive Analysis - Subscriptions and Meal Plans

From our personas, my team and I looked around at the top 3 most popular online grocery shopping apps to get a better idea of how to differentiate Food Carriage.

Feature Design - Online Shopping Experience

I was tasked to develop the online shopping experience of Food Carriage. This was a crucial part of the app as I needed to develop a friendly interface that was quick and easy to use. In order to do this, I looked at other shopping experiences such as Amazon and Nike in order to see the steps it takes to find products and check out quickly.

The interface needed to be streamlined as much as possible, this was evident from our research. I had to create a process that was both thorough and easy to understand. For this, I created a layering system from the top down that would get more specific as your shopped for food. This would allow people to shop for exactly what they were looking for in the wide variety of options at a grocery store. I also created a filter section where people could narrow down options by brands and pricing.

Lastly, I developed a price comparison section at the end. From our research, people thought shopping for healthy groceries was too expensive. If letting people shop online saved them time, now we wanted them to have the option of finding the lowest price. By giving the users the competitive pricing of stores around them, it gives them the power to save money and find new store options. This also fit well into our demographic of college students who were new to their school.

Low Fidelity Designs

High Fidelity Designs

‍

Mobile

Tablet

Desktop

Prototype Presentation

Project Retrospective

The most challenging part of this project was designing in a group virtually. Communication is key when creating a product as a team, and when one or two people have issues communicating due to outside forces, then the whole project can be at risk. Especially when it’s all done virtually. But having this challenge helped develop my skills of managing expectations and reaching out on a consistent basis. I’ve learned that over communicating is best when working on a team project virtually.

At first, our initial idea for this project was centered around finding food deals for people. But after discovering that people have issues making it to the grocery store and picking the right food options, it became evident that we needed to shift focus. Instead of finding food deals for people, we need to streamline the food buying process. We made it our goal to help people find food quickly and deliver recipe options that helps our users make good food choices.

A major portion of this project was to create a responsive product that is available across all devices. I think responsive design is extremely important as it helps to create inclusion. Some people don’t have access to specific types of devices. For example, people may not have access to a computer, it’s not a feasible option financially so they have a tablet. By designing for one specific device, you are alienating others from your product. It’s extremely important to have a responsive digital product across all screens so that everyone can benefit from your product.

The most valuable lesson I learned from this project is how to communicate with others when you don’t see them in person. It can be easy to let time slip and forget to hold others responsible for their end of the project, constant communication is key when everyone in your group is remote. Too much communication can help fight this, and progress things along on the project timeline. This is something I’ll take with me and do more of moving forward.