New Visuals Design for Fnac on the App Store & Google Play

Working on good visuals for any store listing is a determining factor when it comes to catching the users interest and generating organic app downloads.

From PICKASO, we redesigned the visuals of the app of Fnac to boost its visual impact and generate a good first user impression, highlighting the main characteristics of the app in a striking way and respecting the brand’s visual identity.

How we worked on the new screenshots design for Fnac

The wide range of categories and products and the ease of finding information to boost purchases were the main characteristics and functionalities we wanted to highlight in the new screenshots design and in the video preview. Taking it into account, we will now see the most important design concepts we followed when designing:

1. Impacting from the first screenshot: the claim

We went from “Todo pasa en Fnac” (in english: “Everything in Fnac!”) to “AHORA TODO FNAC CABE EN TU MÓVIL” (in english: “NOW ALL OF FNAC FITS IN YOUR PHONE”), and with that change, we are conveying the insurance that the user will find everything he knows from Fnac (products, services, discounts, advantages) from his phone.

2. Highlighting the main functionalities with a good design

We know that the app user interface must be shown the most extensively possible in the screenshots and video preview, but according to our experience in PICKASO, the users show more interest when the information they are shown is easy and quick to understand.

In the case of Fnac, we wanted to focus on showing and getting users to know the products and categories that Fnac wanted to promote and, most importantly, so that the user could see it easily. Saying it and showing it in a small mockup was not enough, so we designed a grid in the full second screenshot with the products mentioned earlier, with the same idea that they can be visualized easily from all the user interfaces.

As for the product scanning functionality to get additional info through the app, we simulated a real product, the scanning zone and the barcode, thus avoiding a boring scanning screen. The user needs almost no effort to understand what’s happening in this screenshot, which means that this way, we maximize the impact and the users’ interest in knowing the feature.

3. Working with catchy copies

When we redesigned the visuals for Fnac’s app, we focused on the aspects that did not work well and we tried to improve them. In that case, we maintained the same typography and, respecting the brand’s style, we decided to use capital letters for all the texts. This way, it’s much easier to read and it offers a safe sensation and stature that we think are necessary for a shopping app like Fnac.

People do not read much and lose interest quickly, so this is why we kept the texts short, clear and with an adequate size so that they can be read easily from any user device (do not expect users to zoom because they won’t). This way, we make sure to offer the same experience of Fnac to all the users.

4. Adding a human touch to the images

Nowadays, human personal attention and participation is more and more reduced in these new shopping platforms, but we know that human behavior follows other humans’ behavior patterns, and this is why we decided to focus the 1 screenshot on a woman holding a product available on Fnac’s app. This could catch users’ attention and make them want to get the same result (i.e. to buy a product).

5. Creating a balance between colors

As you can see, the colors drastically changed between the old and the new version. The use of black as the main color, yellow for the details and highlights, and white for the texts enabled us to create a balance and a much more powerful and interesting visual dynamic.

Before, the mockups and the background did not have an ideal contrast to help the user differentiate the different elements. For this reason, and also because the user interface in the app is mainly white, we decided to use the color that brings the most contrast (black) for the background and thus, minimize the effort that must be done by the users to understand what he sees.

6. Adding shapes and visual elements

The shapes and elements are used in the design to characterize and differentiate the brand from other brands. Fnac already had visual elements in its brand guidelines, so what we did from PICKASO is that we used them and distributed them all along the design as a visual support and filling for the user to always recognize the app.

7. Fnac’s screenshots: Before and after

The first impact always comes with the first three screenshots on Google Play Store and the first two on Apple App Store. Usually, users tend to decide if they want to download the app or not after this first impression.

However, some users go beyond the average and decide to investigate more, and this is why we try to maximize the available screenshots number to show the biggest quantity of characteristics, features and services that the app offers.

For Fnac’s new design, and as it is an app with a lot of functionalities and advantages, it was not difficult to add an extra screenshot from the old design. It enabled us to add the product barcode scanning functionality and show more details about the app.

In short…

When working on the new design of the visual assets for a brand like Fnac, from PICKASO we had to be extra-careful with the objectives that were to be reached and to design according to them. We also had to work on a good design that was in line with the brand and its design guidelines, and always keep in mind all the users types that navigate through the stores to try to please the majority of them.

As usual, if you need a hand with your visual assets design or the brand identity of your mobile app or game, feel free to get in touch with us. We would be pleased to learn from and with you while making your mobile business grow!