It's been a long time and I stop working on this material.
Later in 2016, Feltrinelli commissioned the creation of the same virtual store on the iOS and Android mobile platforms. In keeping with new and recent technologies, in 2019, Feltrinelli launched a bubble app, inStore , for use by customers and shop assistants to facilitate payments on the go inside Feltrinelli stores. Restyled laFeltrinelli home page and some of inner sections as well with a new and modern user interface based on card system either for android and ios device, among smartphones and tablets. It supply the readers with endless and detailed items such as books, cinema, games and music. Later on, designed the upgrade version InStore.
InStore is a "Bubble" app inside the official laFeltrinelli app and allows you to take advantage of the innovative purchase service without having to go to the cashier. Technological advancement has in fact given the opportunity to build an interface aimed at both the public and internal staff, one aimed at searching for items and the other to proceed with the purchase of the same.
Instore app concept was conceived to help Feltrinelli customers to buy any kind of items right away inside any Feltrinelli store upon QRCode recognition. It's like having a cash desk on your hand that produce a Receipt ready to show to the cash desk or any assistant around the store. This way Customers don't wait on the boring line!
The iterative production of the interface aimed at the public has expressed the most common use experience through sections of Profile, Events, Bibliographic suggestions Scanning of articles via QRCode, Cart of selected articles and details of these with information on which department and shelf to find them with guided InDoor navigation. The processing followed a Ux study carried out in parallel for the generation of this concept and thus in order to pursue the real needs of customers and the operating group of laFeltrinelli salesmen.
With the brand new Design System I developed so far, I could create an overall document including a first step presenting the viewers an Introduction to Material Design and a Foundation concepts along with Building Blocks overview
The prototypes have been handled in the Style Guide 3.1 document.
Overall, new techniques and drawing methods were explored with advanced prototyping in order not only to facilitate the development process, but also to make the interactions between the customer and the Feltrinelli clerks understandable in the moment of exploration and purchase outside the shop. cashier. The customer-side application provided for a very immersive interactive experience: starting from the entrance to the shop, scanning and viewing the desired items, up to the purchase together with the clerk ... anywhere in the shop. In other words, without having to queue at the cashier. In particular, the prototyping focused on making the experience pleasant and usable and setting the interface with the search and scan in the first place.
Motion design guides the user to understand the application between the various sections made available to him, such as the detail page of an item just scanned in the store, the search for a free text, the result of a filtering performed on the search itself, the map of the store with augmented reality or the hierarchy relationship between the sections of your profile. The interface is available at any time to help the user complete all kinds of tasks related to the purchase of laFeltrinelli items
Instore app access point is included onto main app navigation. As the customers approach the store they can either enter the store itself and virtually enter the digital store
Once they're logged in, users can navigate the home page with its main features
The app provide the customers with the main functions, searching any item available in the store
and of course scanning items to get relative infos and buy it quickly
In case customers didn't applied to laFeltrinelli fidelity card, well they can do it through this section as well editing their favourite payments and check their latest receipt ready made to be presented either to the shop assistant or to the traditional cash desk
Once the items are located onto the cart, users can finally proceed to the checkout. With this given, an Assistant would receive the notification to help the customer to complete the payment ... like it would be a real cash desk
Giving a micro animation sample of how could it look like, coz I care about details
Subsequently, the interface, for use and consumption by internal staff, was developed on the basis of PAX technology. The QRCode scanning function to associate customer and items allows entry into the virtual cash desk to proceed with the payment and the issuance of a receipt.
The idea behind the Assistant app is to provide the shop assistant with an app installed in that would replicate the function of a normal cash desk on the go. This way the shop assistants would be helping the customers to achieve their shopping actions as they're walking around the store. This User Interface was built according to the popular device PAX Technology which is the world's leading provider of Point of Sale payment terminal solutions
Overall, new design techniques and methods were explored with advanced prototyping in order both to facilitate the development process and to center the final result of the product as expected. The clerk side application, in turn, allows you to complete the in-store experience: from scanning and associating customer cards, collecting items in the shopping cart and completing the payment process with a receipt and even an attached history. As for customers, the animations of the Assistant interface are also designed to guide the clerk to complete all his operations
Easy way concept to access the app with codes given to each shop assistant. As they're logged, they're provided with a simple interface in order to help customers achieve their shopping on the go
The cash desk process was conceived to replicate the function of a tradizionale cash desk. All the information were produced to keep the shopping running as smooth as possibile
Giving a micro animation sample of what could it be in case of many items included in the cart
The Feltrinelli app is a virtual area where you can explore all the articles offered by the publishing house
The design involved the Wireframing phase, the so-called wire drawing, for the exclusive purpose of laying the necessary foundations of the laFeltrinelli virtual shop. A similar design was possible thanks to the Wireflow Library that I have personally developed and perfected over the years with the result of breaking down the interactive patterns to the smallest detail and thus visible in a visual map.
On the occasion of the new creation, laFeltrinelli was educated in the mobile world through the correct execution of the mobile guidelines, thus finding ample scope in innovative and usable components.
The combination of the Style Guide, in accordance with the design of the services via Wireframe, guided the Ui iteration with visual results distributed on both the iOS and Android mobile platforms with the target smartphone in mind. The Ui iteration also produced interfaces related to the world of tablets and thus optimizing the interactive experience to take advantage of the laFeltrinelli service
The innovation involved the study and Ui production also of all those new native and advanced functions of mobile systems, such as widgets external to the app and, not least, the transposition of the app into smartwatches informs reduced and functional to the use of all laFeltrinelli customers