Time frame: 4 days

Role: UX/UI Designer

Goal: Redesigning an app keeping all features

What is Simple Meal Planner?

Simple Meal Planner is an app designed to effortlessly organize your weekly meals—breakfast, lunch, and dinner—based on the recipes you’ve created, complete with their respective ingredients. Additionally, once your meal plan is finalized, it can generate a shopping list tailored to your selections.

EMPATHIZE

I carry out a heuristic analysis of the Simple Meal Planner app.

Thanks to this analysis I was able to detect the main problems that the application had by breaking with some heuristic principles.

HEURISTIC ANALYSIS

STYLE TILE

HI-FIDELITY PROTOTYPE

#3 User control and freedom

Often, people perform actions by mistake, and in such scenarios, it’s crucial to provide clearly defined emergency exits.

When users can easily back out of a process, it helps them feel more in control. To foster this sense of freedom, it's important to support "Undo" and "Redo" actions with a clear way to reverse decisions.

However, in this case, once a meal is included in the Week Planner, it cannot be removed. This design choice avoids consistency and provokes accidental changes and takes the control for users to have confidence in their initial selections.

#8 Aesthetic and minimalist design

Always remember that every piece of information you provide can diminish the visibility of others, which contributes to the overall lack of aesthetics and minimalism in the app.

Prioritize the content and features that support your primary goals, eliminating any redundant information, and ensure that unnecessary elements do not distract or clutter the user experience.

In this case, the overall design of the app lacks aesthetics and minimalism.

COMPETITIVE ANALYSIS

#4 Consistency and standards

People should not have to wonder whether different words, situations, or actions mean the same thing, especially in an era where most of their time is spent using digital products that follow established conventions.

For example, when icons like those for recipes, food plans, and shopping lists are unclear, it becomes difficult to understand their function.

To avoid this, it's crucial to adhere to industry standards and maintain consistency throughout the product, ensuring a more intuitive user experience.

I conducted a competitive analysis and found that most competitors tend to use flat colors, sans-serif typefaces, and place greater emphasis on imagery. I observed examples where visuals were presented as either realistic photographs or detailed illustrations.

Competitors tend to use plain color schemes with bright backgrounds, paired with sans-serif typography for a clean and modern look.

Additionally, many competitors use illustrations to represent different ingredients, enhancing the user experience by making meal planning more intuitive and visually engaging.

IDEATE

MOODBOARDS

I create a moodboard to find inspiration from other apps and designs. This helps me see different styles, colors, and features, giving me new ideas and insights. By looking at various design examples, I can better understand what works well and use those ideas to create a more effective and appealing design.

In selecting the color palette for the app, I drew inspiration from the Harvard Plate, a well-known visual tool used in nutrition to illustrate the essential nutrients needed for a balanced meal. This model categorizes the plate into distinct sections for proteins, vegetables, carbohydrates, and fruits. By reflecting these categories through carefully chosen colors, the design not only enhances visual appeal but also reinforces the concept of a balanced diet, making it intuitive for users to understand and engage with the nutritional aspects of their meal planning.

To create the app’s Style Tile, I developed a tailored color palette and selected Lexend Exa for headlines and UI elements due to its clarity and readability. For body text, I chose Raleway, which offers a dynamic, fresh look with a unique, handcrafted feel. Additionally, I integrated the Bitcoin icon family to ensure cohesive and thematic iconography throughout the app.

BEFORE AND AFTER

LEARNINGS AND NEXT STEPS

Next, I will present a detailed comparison of the Simple Meal Planner app before and after the redesign process. This will illustrate the transformation and improvements made, highlighting how the updates have enhanced the app's functionality, aesthetics, and overall user experience.

Before

During this process I have been able to observe the complexities of redesigning an existing app by being forced (in this case) to maintain and not add any features.

At the same time, this app, despite its usefulness, has a lot of room for improvement. It would be interesting to be able to add a section in which to include snacks during the day so that they can also be added to the shopping list, as well as being able to manually add items to the shopping list.

PROTOTYPE

After