My name is Ali Hoss. I’m a multidisciplinary designer and UX/UI designer.

Follow Me

Mise En Place, Grocery Shipping App UX/UI Design


Mise En Place is an online grocer that allows the user to purchase common grocery items pre-prepared. When a user purchases an item, for example, a sweet potato, they have the option to order it raw, baked, diced, or julienned. The preparation adds a small fee to the grocery item’s price.

Mise En Place also allows users the flexibility of preparing their own recipes with the efficiency of a meal kit service. Besides pre-prepared grocery items, Mise En Place offers pantry staples. Once purchased online, the user has the option of picking up the items from a central location or paying for local delivery.


Mise En Place, Grocery App, UX Design, Ali HossMise En Place, Grocery App, UX Design, Ali Hoss


Problem Defenition:

The options before Mise En Place were going to the grocery store and preparing a meal from scratch, buying a meal already prepared, or buying a partially-prepared meal kit.

The problem with preparing meals from scratch is the time and labor involved. A recent study (2016) by The Bureau of Labor Statistics found that the usual meal preparer for their household spends on average 51 minutes a day on meal preparation. Three-quarters of American women identify as the usual meal preparer for their household.

Buying pre-prepared meals from a deli, carry-out, delivery food, or fast food, can save the usual meal preparer 31 minutes on average, according to the same study. Over the course of the year, this is the equivalent of 7.7 days not spent in meal preparation, considerable time savings for outsourcing meal production. However, the cost of buying pre-prepared food is considerably higher and less nutritionally dense. A study by Price economics (2018) found on average, it is almost five times more expensive to buy prebreaded foods than it is to cook at home. Home-cooked meals were also associated with diets lower in calories, sugar, and fat.


Mise En Place, Grocery App, UX Design, Ali Hoss


Primary Persona:

Jessica is a 37 years old nurse in San Francisco, California. She is married with three children. Jessica works part-time at a hospital and occasionally has the night shift.

Goals: Future where her family can make more money and she can reduce her work hours, especially her overnight shifts. Spend more time with kids. Would like to get toned and eat healthier. She would love to have a bit more time for herself and her husband too.


Secondary Persona:

Peter is an architecture student at MIT in Boston, Massachusetts. He is 24 years old and single. He works part-time freelancing for architecture firms.

Goals: Finish school and he can reduce his work hours. More time for research and innovation, and less time spent on preparing meals for himself. In his spare time, Peter would like to volunteer in his community.


Mise En Place, Grocery App, UX Design, Ali Hoss


Heuristics Analysis:

What we learned through our heuristics analysis:

  • The Home page is clear of what the app does
  • CTA language is consistent
  • Not as consistent on screens
  •  The experience of using the app compared to real-world grocery shopping does replicate some actions but doesn’t fully match the real-world grocery experience

Areas we found to improve:

  • Access to personal info is somewhat easy to explore further
  • Work on the consistency of the language on the screen, maintain a similar tone
  • Attempt to match the real-world grocery experience by trying out a browsing/exploring option. I.E. in a physical realm shoppers sometimes browse through aisles and find products they hadn’t thought about before.


Mise En Place, Grocery App, UX Design, Ali Hoss

Mise En Place, Grocery App, UX Design, Ali Hoss

Mise En Place, Grocery App, UX Design, Ali Hoss


Our Team:

Ali Hoss, Emma Hazen, Ana Valencia


My Role:

– Logo and brand identity designer

– Product designer

– Wireframe and prototype designer

– Part of the heuristics analysis team