Wireframes - Alpro case study

Desktop and Mobile wireframes for Alpro website.

Definition of the basis of Alpro website's structure to make the online experience unique. The project involved the construction of the desktop and mobile versions of the skeleton of the website, with the implementation of some improvements after the analysis conducted in the Discovery project.

PROJECT GOALS:

• Based on the opportunities discovered in the previous Alpro projects, improve the User Experience of Alpro website starting with Wireframes.
• Design Desktop wireframes for Alpro website.
• Design Mobile wireframes for Alpro website.
• Define the User Wireflow. 
• Update the current sitemap.

WORKING METHOD:

The work has been divided into two phases. 

In the first phase: 

• ‍Preliminary exercise to gain confidence with the design tool and the task: creation of wireframes for PlantX.
• Recap of the opportunities emerged.
• Design of the Desktop Wireframes. ‍
• Design of User Flow and Wireflow.
• Update of the sitemap based on improvements.

In the second phase:

• Creation of the Mobile Wireframes.‍
• Update of the User Flow and Wireflow.

The creation of the wireframes has enabled to define the structure of the website. The following step was the design of the UI prototype to complete the redesign of Alpro website.

TOOLS USED:

• Figma
• Whimsical
• Keynote