Fora d’Horas is an online store which allows clients to order supermarket products and cooked meals during nighttime.
This service allows the user to receive grocery, pharmacy, kiosk, or even ready-made meals at home. Online, besides being able to make orders at a “weird” time, the user can also access the information about each product and explore the menus of the partner restaurants.
Problems
1. Hard Usability
2. Lack of identity
3. Outdated Design
Goals
- Improve UX design, improving the user’s experience
- Redesign the visual look of the interface according to the current needs
- Implement extra resources to give the user useful information that’ll help him
- Connect with the user to make him loyal
Research
- Poor interface and usability
- Overlapping of the footer and the menu
- Non-coherent design
- Product categorization
Solution
We decided to redesign the whole product, starting with the brand, and also redesigning the website.
Brand
The brand we find on social media isn’t powerful or impactful. It’s too simple and too basic, and doesn’t show much credibility to the visitor.
So, defining the brand’s character and strength was our main focus. We created an identity that can be used in any platforms, anywhere, consistently.
Website
On the website, we worked in order to potentialize the brand’s services and products, always following the e-commerce best practices, and we developed and intuitive and easy-to-use platform, simplifying the user’s experience and making the final purchase much more accessible and desirable.
Home
The first page has to immediately captivate the user, so we chose to explore trends and space.
With trends, we wanted to captivate the user’s interest for the products and services, as they’re the audience’s favorites.
With space, we used it to create more monetization, allowing other brands to show features and promotions.
Categories/Menu
We had to restructure and reorganize the categories to make the menu and the product presentation more intuitive.
Now, the menu divides into several sub-menus. The main one is composed by the two main types of service: delivery of products, and cooked meals by restaurants. Then, we have the sub-categories in each main one, for example: Groceries, Drinks, Dairy, etc. And in a third level, we have another sub-menu that presents the type of product, which can also be divided into more specific layers.
This way, the user can direct it’s navigation towards what he really wants, finding the desired product much easier and faster.
Drinks
After selecting the Drinks category a page is shown with all the products in that category. To help the user choose, we have both subcategories and filters (brand and price), and the possibility to order the products in different ways.
Product presentation is also made in a different way. Before, the product was presented in every different flavor. Now, the products are grouped and are presented only once, but the flavors can still seen by swiping the image gallery or selecting them in either quick view or the product page.
Quick View
The quick product addition to the cart now has an intermediate step where the user can adjust the cart to his preferences and needs, as in flavor, size and quantity. This way, he doesn’t need to open the product page to select those details, making the purchase much faster.
Product
In the product page we added some functionalities. Now there’s a product description, as well as the possibility to choose other flavors, sizes or quantity.
We can also see other details like how many users favorited the product or share it on social media.
Shopping Cart
In conversion phase, we focused on simplifying the purchase completion, making it more direct and explicit, like informing the user of all additional fees.
Another one was adding some suggested products related to the ones in the cart, to try to make the user buy something more.
Conclusion
In short, this project allowed us to explore the duality between something aesthetically pleasant and at the same time extremely functional, focusing on the user experience as a whole.
On an online shopping site, it’s very important that the user trusts what and where he’s buying. And a strong brand, a nice experience and something that the user identifies with will definitely help him move forward with the purchase.
