What are the 3 design details that are worth pondering in mobile apps?

Today's translation of this article is a popular article on the Medium user first (The king) Part 1, the author from the user's perspective, summed up a series of current product design issues, and give their own insights and solutions. Enter the translation below.

"Download app→ open → start screen → reading tutorial → registration → wait → authorized app to send notifications → authorized app use location → invite friends → ..."

As a product designer who loves to research mobile apps, I have to download a lot of different app--every week to find novel interactive and visual design inspirations. Occasionally you can see some cool, interesting designs, but most of the time you will be frustrated because many apps don't respect their users.

Here are some basic design principles that can be introduced into your app to optimize your app and make it more fun for users.

In the first part of this series, I will mention the following points:

How to obtain a (user's) license

The problem of "registering"

Excellent loading interface

　　Request authorization

The first time you open an app, you are immediately asked to allow it to send you a notice-nothing is more annoying than that. When you do not see any related introductions, there is a window to hit your face directly-"I want to send you spam every day yo." Basically, once this happens, I immediately delete the app because I think "it doesn't really know what the user experience is, so I can't see anything interesting in it." 』

Imagine you have just entered a restaurant, the waiter suddenly appeared in front of you, said "Give me your email address, we will send you every day of the member newsletter." How rude is this? What would you do if you were the owner of a restaurant?

I haven't had a chance to get to know the restaurant or eat it, so why would I want to subscribe to his membership newsletter?

In app and in the real world, we need to use some means and time to request authorization from the user. Whether it's to send them a notification, subscribe to a service, or ask for credit card information, and so on.

I usually do this, and you should do it-first, using an interface that is consistent with the app design style, "politely" asks the user for authorization and "explains" why you need this authorization.

Some apps work entirely on the location of the user, such as Uber. And it does this:

The prompt interface after opening Uber for the first time

Allow "Uber" to access your location when you use the application?

Uber will arrive at your current location and take you to the car. If you start the ride, select Allow so the application can find your location.

This is the most basic iOS modal window. Now everyone knows what Uber is, but suppose I don't know? What happens when I don't allow it to use my geographic location?

Do not allow Uber hints when using geographic location

Location service is disabled

Please open the location service in the settings → privacy → location service.

I have to manually enter my location in the search box, or go to the settings to open the location service to continue to use. Whichever you choose, it is not a good user experience.

The actual problem can only be avoided by a simple step:

The optimization scheme of the original author

Translation: Uber

Everyone's personal driver.

In order to easily receive you and send you to where you want to go, please allow us to use your geographic location.

(Your information will not be shared to anyone, it is safe here for us)

Adding this window won't take much effort, and even if it's an extra step before using the app, it won't have any bad effects. Because it shows your concern for the user. It tells the user that their privacy is safe and that you want to bring the best possible experience to them.

　　The problem of "registering"

In my last startup product Whowanna, I was caught up in how to better attract new users and how to give new users the best initial experience. Because in Whowanna, users cannot continue to use them without registering and inviting a few friends.

Whowanna is a social app that allows users to present an activity proposal that attracts interested friends to attend. Therefore, it is meaningful to register and invite friends to use.

If you think that simply adding a "Facebook Login" button on the app, you can easily solve all the registration problems, you're just a keyboard man.

Admittedly, a Facebook/twitter/google account login is really good and useful. The problem is that not every user will use them. So how do you make sure users create a new account in your app?

　　The first thing to prove is the value of app

Our common registration process is a bit silly. Although it can solve the problem most of the time, if you think about it, you will find that its user experience is not good.

The common registration process

Launch Interface →app Introduction (Login & Facebook login) → Invite friends →app main interface

In most apps, there's an intro or a little tutorial that no one actually looks at seriously. Then you need to register to continue using it.

In such a virtual world, would you give your personal information to it before you have experienced the app?

The reason for the "register" process to be difficult is that many apps (such as Whowanna) work based on user personal information.

If you can, please add a "free browsing" feature to your app. You will find that once you have experienced the app, you will know that the app is valuable to them, and then you'll be able to register an account spontaneously. And users who have experienced this process will be the fans of your app, because they want to be registered entirely from the heart.

　　Just ask the user for a message at a time

Sometimes, you'll need a whole bunch of personal information in order for the user to get the best possible experience. But this sort of thing is most annoying. And the worse thing is that you find that there is no egg to fill.

For example, I open a shopping site and it doesn't immediately ask me for credit cards and personal information. It will wait and wait until I really "buy something" to avoid premature interference. In addition, until I paid the money, the website finally let me to create an account. (If this site is good enough, give me a discount code that I can use for the next shopping)

This is the same for all products. When I download an app that looks great, I just can't wait to try it quickly. If it is really necessary, I will provide my username and email address. But don't ask me about sex and birthdays at the beginning. Please wait a little while and tell me why you need this information.

　　Excellent loading interface

When you are talking to others, they will respond to you. It's not necessarily verbal, it can be body movements or eyes. The other side will always use some action to respond to your action. Similarly, this is true when people interact with machines. Once a user initiates an action, the software must do something to respond to him.

Today, most applications use the "Daisy" rotation animation when processing the loading process, which is ubiquitous and never stops.

"Daisy" Load animation

Have you ever been in a restaurant for a long time before serving a meal? And you have no idea if the chef is cooking your order? What's worse, there are no waiters to tell you how long it will take to wait. What a painful experience it is. You never want to go to this restaurant or recommend it to a friend.

Yes, using the "Daisy" loading interface is such a bad experience. I, as a user, are waiting for your app to serve me and convince me to keep using you. I don't owe you anything, nor do I have to use your app. The experience of app usage must be as smooth and enjoyable as possible. So what can we do about it?

　　Progress bar

The first step is to show the user the current progress of your app. The presentation of progress is not limited to percentages, circles, or straight lines-any form you can think of. This progress bar will give users timely feedback and guidance-"You need to wait" so long and you are now in "this position".

The various progress strips on the dribbble

I do not recommend a progress bar that, whatever happens, completely obscures the user's entire screen and forces the user to wait.

Depending on the type of content you are loading, you can use some tips to make certain usage scenarios more efficient.

In the 2013, YouTube began using a new progress bar-it was locked at the top of the window, 5 pixels high, and the color was YouTube red. This is one of the best progress bars of the moment, and many people have borrowed it for their ingenious design.

Youtube progress bar

This progress bar not only tells the user how long it will take to wait until the load is complete. At the same time, this loading method also allows the user to continue to operate while waiting.

Once your app uses the "Step-load" strategy, the experience you use will be greatly improved.

For example, you want to load a Web page, it contains a lot of pictures, text, links, video and exquisite graphics and so on. This page may look good after loading, but what if what I want to see is already loaded at the beginning? Why do I have to wait for the entire page to load? Suppose I wanted a search result that was the first thing to load when I searched, why would I wait for other results?

Never stop users from doing other things while loading a page, because you never know what the user is going to do on the page.

　　To please your users

In any case, there are always some situations that require a user to wait, such as the process of logging in and registering.

Do you remember when you were a little kid, waiting for dinner in a restaurant? How long and boring it is. Luckily, my mother had a bag full of pencils and white paper at all times. I used these waiting times to draw and play games, so the whole process was happy.

When a user waits in your app, he's holding a powerful, network-connected touch device. I'm sure you've thought of some good ideas. Let's learn video games. In order to load some cock-fried days of animated scenes (especially in the past), you have to wait a long time. So the game designers have designed some great games for you to play while you wait.

The loading interface of the Dragon Ball in the martial arts

　　Talk to the user

The best way to communicate between two people is to talk and exchange ideas. At some point, speech is the best and easiest way to communicate. and the interaction between the human machine design, communication is also the key. It's not complicated, you just need to add a description below the progress bar to tell the user what's happening right now. With this description, you can give users more accurate information and make your app look more humane.

Remember, don't just write "something awesome" because it's completely out of the egg. It's best to give the real message.

　　Skills and teaching

Sports games You should have played? Although there are a bunch of buttons on the handle, the right combination of skills is often difficult to press out. Thus, the game loading interface is often designed to showcase the "skills and teaching" content. Just imagine, when you start in the game, you have learned that "X + L1 + left" is cast curve shot, is not super cock?

The skill and teaching interface of a touch-screen football game

Translator's micro-faith public Number: