With the redesign of Avocado.lu our main focus was on the user friendliness and the user experience. Visitors should easily be able to discover Avocado’s products, buy single boxes or subscribe for weekly deliveries.
Eventhough the front was important for new users, the user inteface and basket got our main attention during our first brainstorms and while creating the very first wireframes.
The new design had to be simple and modern, yet show the visitor the healthy food world he was about to enter. Bright colors such as the Avocado green and orange used on light backgrounds as well as the use of beautiful food pictures welcome the user and guide him through the website.
The addition of white color splashes show the link between the different content areas and their appropriate images. The green and orange watercolor surfaces give the website’s front an additional depth and a feel good athmosphere.
Avocado food boxes
A lot of thoughts went into the ideal display of the different boxes and box variants in the shop part, Avocado’s main business.
We needed to combine a short description of the box, show the recipes for the upcoming week and of course give the visitor an easy possibility to immediately add the specific variant he wants, to the basket.
A filter, on top of the page, gives the visitor the possibility to look for specific food preferences or for specific person counts.
A quick hover over the image shows the different actions a user can make. If you want to discover the real user experience visit this link avocado.lu/boxes and feel free to use the filter and add a few boxes to your basket.
For the checkout process our main priority consisted in easy ajustments as well as a good overview for the end users.
A first step shows your current purchases with easy possibilites to adapt the delivery date or frequency.
Below logged in users get to see in an overview their current address and credit cards. If those have to change they can easily be replaced, if not, a simple confirmation at the bottom of the page submits the order.
New users can simply add their boxes to the basket and then easily create their account right in the second basket step.
An even simpler way, using the Facebook login, is, of course, also possible.
More than 50% of Avocado’s users visit the website via mobile devices. As a consequence, creating a good responsive website was our first priority.
The new subscription panel had a big importance in the new design. Users should be able to easily change their boxes, frrequency, delivery date and addresses.
To improve the user experience we based ourselves on google’s material design principals.
"All action takes place in a single environment. Objects are presented to the user without breaking the continuity of experience even as they transform and reorganise."
Different panels slide out and give you additional options. You can discover the types of panels by hovering over the image on the right.