How can you boost your e-commerce sales on mobile devices?
- 20 Jan 2021
Smartphone traffic is increasing regularly and can account for more than 70% of certain online traders’ overall traffic. Despite this, smartphone traffic doesn’t convert well into sales: the level is 3 to 4 times less than on the desktop. This figure seems to indicate that many customers switch from the smartphone to the desktop when they’re ready to order. And where there’s a break in the purchasing process, there are lost sales.
Why smartphone traffic converts so badly into sales
The main obstacles:
- Delays while pages are loading, either due to the slow speed of the mobile network or because of the smartphone’s poor hardware capacities.
- The barrier posed by the need to log in to the customer account and enter bankcard information, which is often perceived as being a nuisance on a small screen and a touchscreen.
- Missing information, which means that surfers will often use the desktop instead, in order to be sure of having all the information at hand.
The good news is that these obstacles are usability-related and technical in nature, and so it’s possible to take action on these different points.
The native application solution
An innovative and personal experience
The development of a native application offers convincing solutions. It’s possible to achieve first-class results on a smartphone in terms of usability and responsiveness.
The native application’s weak point is its capacity to generate traffic. You need to get people to overcome the barrier of visiting the store and installing the application. To attract traffic, you need to be able to propose sufficiently attractive services on the native application to encourage the customer to overcome this barrier. You therefore need to try and differentiate the native application from the website.
Two interesting ideas are waiting to be developed.
Using the smartphone’s physical capacities can help you propose an innovative and unique service. One example is the Ikea Place application, which makes it possible to view the product in augmented reality in your apartment, make-up applications which let you test the product on your face in augmented reality, visual search engines which use the camera, and applications which provide diagnostics/advice based on a photo or camera picture.
The native application can therefore be used to provide greater customisation. Unlike a website, the user actually possesses the application, initiating its installation locally on his device. He is therefore more naturally inclined to consider it as personal. It’s possible to always stay logged into the customer account, to provide fast access to the loyalty area and to reorganise the merchandising to adapt it to the customer’s preferences and purchasing habits.
The Progressive Web App solution
An experience offering continuity in relation to the desktop website
Forming a continuation of responsive websites, progressive web apps make it possible to offer an experience closer to the native application’s web experience.
However, unlike the native applications, there is no installation stage involved. The Progressive Web App is accessed directly from a web browser. It takes the place of the website and is therefore listed in the search engines. If you prefer, it’s still possible to install it on the smartphone’s home screen but this installation is optional and when you choose it this action takes place instantly.
When properly implemented, the Progressive Web App offers major time savings thanks to its architecture and the use of the cache. For example, you can propose to instantly go back to the previous page, the home page or shopping cart. These frequently-performed actions no longer involve contacting the server, so the page is available immediately. It’s also possible to create an “instant-loading” sensation for the product page by using data already available on the previous page (image, description, price) and loading the rest of the page subsequently (description, customer opinions, etc.). If it has been properly designed, the feeling of responsiveness is impressive and the navigation is less sensitive to unstable mobile networks.
But performance isn’t everything. A Progressive Web App can only achieve its full potential if the usability aspects are fully optimised for mobile devices. Most current websites don’t make full use of all the capacities of responsive design. With a Progressive Web App, you need to go further and bring the experience closer to that of a native application:
- Place the “add to shopping cart” button as a sticky element at the bottom of the page. In this location, the button is more visible and always accessible above the fold line. It’s possible to do the same thing for the confirmation buttons in the purchase tunnel and the customer account.
- Links which are too small to be clicked with fingers need to be redesigned: the pagination for example or the quantity selection buttons.
- Some information which does not form part of the standard purchasing process, such as filters for example, can be hidden by default in accordions or in a drop-down panel. These accordions and panels need not be visible in the desktop version of the website if there is no need for them to be there.
- Plan on including a guest mode in the purchase tunnel to engage the customer in the purchasing act more quickly
- Make payment simpler by using payment information stored on the phone (payment by touch id / face id)
- Move the menu bar to the bottom of the smartphone screen. This principle, which is particularly popular in native applications, is rarely used on responsive websites. However, on a smartphone the bottom of the screen is the easiest place to access! This idea means redesigning the navigation menu. You need to get rid of the all-purpose “hamburger” menu and replace it with navigation buttons specific to the smartphone. An e-commerce website for example may propose a navigation bar at the bottom the screen with 4 buttons: home page, catalogue, shopping cart and customer account.
Comfort zones on a smartphone
(source: Scott Hurf)
Different technical capacities
The Progressive Web App uses web technologies and is therefore limited by the implementation of the W3C standards in the various browsers. The following table compares each solution’s current capacities. Some of these limitations may be deal breakers depending on the user experience you’re looking to create.
|Installable and usable in fullscreen mode
|Connection to the customer account via touch id / face id||Yes||Yes, browser compatibility 80%|
|Payment via touch id / face id||Yes||Yes, browser compatibility 80%|
|Access to the camera||Yes||Yes|
|Access to the GPS||Yes||Yes|
|Access to the accelerometer and the gyroscope||Yes||Yes, but only on Android|
|Offline mode||Yes||Yes, but limited storage capacity|
|Extension on Car play & Apple watch||Yes||No|
|In-app purchase||Yes||Yes, but you can’t use your Apple/Google account|
|Augmented reality||Yes||Yes, but with limited storage capacities|
The budgetary factor
From a budgetary viewpoint, the Progressive Web App is highly attractive. It makes it possible to use a single solution for all devices, from the desktop through to the smartphone. Investments are therefore pooled to the maximum.
On the other hand, the native application requires dual development, for the smartphone (Android + iOS), as well as for a responsive website.
Two different approaches to implementing your mobile strategy
To sum up, the native application must be differentiated in order to attract traffic. It’s therefore well adapted when it comes to offering an innovative and different experience. On the other hand, the Progressive Web App offers an experience forming a continuation of that proposed on the desktop website, but fully optimised for mobile devices.
Why choose? Perhaps you need both?
The use of one solution does not exclude the other. It’s always possible to propose several experiences as long as these are complementary in nature!