M-Commerce How to create the perfect shopping experience on mobile devices

Let’s imagine the following scenario: You are standing on the platform, waiting for the train and while you are looking at an advertising board. The only concert of your favorite band will be advertised here. By scanning the QR code on the poster, you will be redirected to the e-shop to buy the ticket there. And now the journey begins!

User (customer) journeys – learn from marketing

The first contact with the product has taken place. By opening the scanner app and pressing the “Scan” button, an initial interaction with the product has arisen. Let’s leave the world of the user again and dive into that of marketing. The customer journey method is used there to collect information about this very first contact through to the purchase decision. The needs, expectations and development of a customer are analyzed and evaluated during the purchase process. Based on the information obtained, decisions about the platform, campaign or channel can be made more easily. The method successfully used there can be perfectly transferred to the world of user experience design. It is used there in order to gain knowledge about the handling of a product from the user’s perspective. But: how do you apply them? What are the pros and cons? And finally, how do you achieve the perfect shopping experience on mobile devices?

The travelers – the target group analysis

Before the journey begins, the target group is determined. For example, with the help of interviews, you can specifically ask about likes, dislikes, expectations or experiences. Statistics also provide information about age, device type or the operating system used. Personas, i.e. prototypical users, are created from these findings. For example, it could be Pia, 34 years old. She is the owner of a Nexus 4 running Android 4.2. Pia is going to travel for us.

Itinerary – User Journey Map

The user journey map clearly shows how the user handles the application. Scenarios are used to describe how this interacts with the application. These scenarios are divided into phases and the points of contact are noted. Pia’s journey through the mobile application looks like this:

  • Pia opens a scanner app on her smartphone.
  • She scans the QR code.
  • Pia calls up the stored link with the browser.
  • Pia is looking for information about the start of the concert and the venue.
  • She also wants to know how much the ticket costs.
  • Since she wants to go to the concert with two friends, she changes the number of tickets.
  • She puts the three tickets in the shopping cart.
  • Pia would like to have the tickets sent to her home by standard delivery, as well as the invoice.
  • Since Pia does not want to create an account, she selects the option “Continue without registration”.
  • She enters her contact details in the form.
  • She also selects “direct debit” as the payment method.
  • And accept the terms and conditions.
  • In the last step, she checks the order.
  • Since everything is to her satisfaction, she taps the “Buy now” button.
  • In the order confirmation, she sees that everything worked.
  • She then uses the “Save appointment” function to save it in her calendar on the smartphone.
  • And share the concert on Facebook.
  • After four days, Pia receives a letter with the tickets.
  • Two weeks later she attended the concert with her friends.

In this process, Pia goes through the following phases: Scan – Information – Checkout – Further actions – Incoming goods.

The points of contact: poster campaign, smartphone, customer center, shipping service provider and ticket inspector.

Based on this list, you can see the areas that are of particular relevance for both the user and the company, the so-called Key Moments of Truth. It is important to make these particularly user-friendly in order to achieve the best possible conversion rate, i.e. so that as many shop visitors as possible complete the ordering process and actually buy the product. Because, as Jakob Nielsen, usability expert, puts it:

“If Users Can’t Buy, You Don’t Make Money.” (Jakob Nielsen’s Alertbox: August 19, 2001 Did Poor Usability Kill E-Commerce?)

Make the trip as pleasant as possible – usability tips

In order to avoid high abandonment rates during the ordering process, there are the following recommendations as a checklist:

  • Reduce text input: Offer the user a login before the checkout process. This saves already registered users from entering text.
  • Saving data that has already been filled in: A missing network should always be taken into account for mobile applications. So that the user does not have to start the process from the beginning in this case, it is advisable to save the data that has already been entered and the steps that have been completed in the ordering process. It is important to make this project transparent to the user and to inform him that the session will be saved.
  • Show current progress or order status: Show the user where he is and which steps he still has to go through to complete the order.
  • Use visible area: Place the most important information at the top of the page so that it is visible without scrolling.
  • Observe the law of proximity: place important information, such as the price, near the product.
  • Show appropriate keypad: Show the numeric keypad for numbers such as postcodes. This makes the entry easier.
  • Feedback on success and failure: In the scenarios (user journey map) you can see how many steps have to be completed in a buying process. For example, when submitting a form, show the user whether this step was successful.
  • Provide assistance: In the event of failure, tell the user why an error has occurred. A preventive measure for forms is to automatically validate and correct “incorrect” entries. In addition, the user can be informed of the error in the form of an explanatory text.
  • Communicate security: The aim should be to integrate the mobile shop into the complete application from the first to the last step. Even if the shop solution is from an external service provider, it has to match the rest of the design and wording so that the user does not get the feeling of having “accidentally” landed on a third-party application.
  • KISS (= Keep it short and simple): Make the buying process as easy as possible. Avoid graphic disruptions such as “10% cheaper” and gimmicks in the checkout so that the focus remains on the essentials.

After the trip, is before the trip.

The knowledge gained must be collected, analyzed and used to find out whether and to what extent the process needs to be optimized. Therefore, the User Journey Map can also be compared to planning an optimal travel route in order to get from A to B as quickly and directly as possible. Applied to our case, in the concept, design and development of an order overview page (compare scenario 13) the information should be arranged in such a way that the user sees all the important information and only has to press the “buy now” button. In short: the customer should be able to send the order without having to take detours.

Out and about when traveling …

But what happens if the user takes detours, gets lost? How do you deal with special cases? Unfortunately, the user journey is not suitable for answering detailed questions. To do this, you should fall back on a potpourri of methods from the user experience area, for example interviews with the resulting personas and subsequent field studies. Another disadvantage is the simulation of the user perspective, since the user journey is based on stereotypical assumptions and an ideal travel route.


Even if the traveler only presents an excerpt from the target group as an example, it still helps to uncover the critical points at a very early conception phase. If you evaluate the routes and “travel reports” (feedback) of the users correctly, you gain important information about the points at which and why the user cancels the ordering process. And this is how you ultimately get the perfect shopping experience on mobile devices, sometimes via detours. In this sense: have a good trip!

Leave a Reply

Your email address will not be published.