Caffarel – Mobile Design
Year
2021The client
From a pioneering chocolate laboratory in Turin, Caffarel became a brand recognized in the world of "gusto" as an ambassador of Made in Italy. For 200 years, Caffarel has been a chocolate-manufacturing company, inventors of well-known "Gianduiotto".
Project requirements
- B2B platform Caffarel asked for a customer-facing application to strengthen B2B relationships. The mobile app allows customers: - to discover recipes and how to use the Caffarel products; - to visit the product catalog and its related info-commerce.
Design process
HLD Functional Architecture
Information Architecture
The mobile app organizational system has the same Caffarel website's contents hierarchy to address users' needs by providing only necessary information.
User flow
Navigation from the main view to pre-order
Navigation from the main view to video recipe
Wireframe
Look and feel
The Design System is related to the website already in use by Caffarel. The User Interface has the layout, colors, typography and interaction of the website to grant the same experience above all touchpoints.
Design System
Typeface
Colors
Icons
Feather Icons
(Some) Atoms and Components
Mobile App Caffarel
The B2B platform consists of an administration dashboard and a mobile app for tablets and smartphones. The mobile app can be downloaded from the most common app stores and users can use it behind authentication.
Info-commerce feature
The product catalog contains all the products divided into categories (Pastry, Chocolate, Ice cream), and for each of them there is a product detail page. Users can add to the shopping cart all the items they prefer and complete the checkout to generate a pre-order automatically. The pre-order is sent to the related supplier by email.
The University of Chocolate and video-recipes
Caffarel has founded the University of Chocolate to promote training courses for pastry chefs, create new recipes and experiment with new products. Videos organized into categories will be available to users of the application.
Push Notifications
A section on the app collects all the push notifications received by users. They may refer to new videos published, new products in the catalog and updates about the pre-orders.