High-Fidelity Wireframes:
The first thing the user sees is the home screen. Therefore, here we need to display what we would like to receive from the user - definetely some Action. Quick product description and Call-to-Action button. On this site, it is assumed that the button, when clicked, will open a Modal window with a calorie calculator, where the user will enter his parameters (height, weight, age, gender, goal)
Scrolling down and see a summary of what the site actually offers and in what form the final product will be received. The final product is a .pdf file with a personalized Meal plan (suggested meals for the day and their macro and micro nutrients, recipes and their cooking time, a list of products for shopping)
It was decided not to complicate the user's task when interacting with the site, so his path will be at the level of a Modal window (Entering parameters - Goals and preferences - The result of calculating calories - Choosing a Suitable Plan - Making a purchase via the card - Downloading the plan to the device or Entering an email to send the file to the mail).
At the bottom of the main page there is a transition to the secondary page How it works. On that page the user will review all his steps in detail and will also be able to download a Sample Meal Plan for one day to decide whether this product is suitable for him or not.
There are also a few secondary pages, one of them about the Diets on which the Meal Plan is based.
Adaptive design for IPhone 11 Pro:
Thanks for your attention, I'll be very grateful for the support of my work.
