Embed Size (px)
Citation preview
1 / 19
Reasons that two services show different results with NAVER Login
The graphs above represent that two services show quite different results even though they both have added NAVER Login
to their services. It is because that the strategy of social login is not properly implemented in the service B. In this document,
we offer some considerations to optimize NAVER Login so that you can have a big impact on the performance, like the
service A.
Please read this document carefully and consider how you can apply these guidelines to your service (website or app).
NAVER Login Help Community
If you have any other questions when you design your service (website or app), please visit NAVER Developers
Forums (Korean only) and post your questions. We will get back to you as soon as possible.
NAVER Login User Experience Design
NAVER Login User Experience Design
2 / 19
1. Display the NAVER Login button in a highly visible location
In general, people tend to focus on the tasks such as entering usernames and passwords when logging in, so they hardly
notice other elements. Therefore, if the NAVER Login button is not placed in a highly visible location, they fail to notice the
button; consequently, your service doesn't gather as much popularity as what you expect when adding NAVER Login.
Incorrect design
An additional action is required to show the NAVER Login button
If the NAVER Login button is hidden by default and it is displayed only when people click a down arrow button as shown in
the figure above, they cannot find the NAVER Login feature until the button is clicked.
The NAVER Login button is rarely visible in terms of size or position (extra caution required for icon-type buttons)
Because people usually focus on the tasks such as entering usernames and passwords, the NAVER Login button is hardly
noticed if it is less impressive than other elements.
A research found that 97% of study participants failed to notice changes of a website because they focused on
the tasks such as entering usernames and passwords. - S. E. Schechter, R. Dhamija, A. Ozment, and 1. Fischer,
"The emperor's new security indicators," in SP 'OJ: Proceedings of the 200J IEEE Symposium on Security and
Privacy. Washington, DC, USA: IEEE Computer Society, 2007, pp.51-65.
NAVER Login User Experience Design
3 / 19
Design guidelines
1) If there is enough space for the NAVER Login button
Use an official-type button
Place an official-type button for NAVER Login in a clearly visible place so that people can easily notice it. The best user
experience is to add additional text appearing next to the NAVER Login button; people never miss it!
2) If there is limited space available
Use an icon-type button
Use an icon-type button for NAVER Login and add additional text around the button if there is limited space available
because the login screen is implemented using an iframe or it is embedded within another page. People are more likely to
notice the button when it comes with text even though several social login buttons are displayed together.
NAVER Login User Experience Design
4 / 19
3) If your service works on both PCs and mobile devices
Add the NAVER Login button to both environments
Let people use the NAVER Login button either on both PCs and mobile devices.
NAVER Login User Experience Design
5 / 19
Add the NAVER Login button to every login screen
Let people use the NAVER Login button wherever they can log in to your service such as a login page, a popup login form,
and even a homepage.
NAVER Login Button Brand Guidelines
To keep unique identity, it is strongly recommended to follow brand guidelines described in "NAVER Login Button
Brand Gudielines" (Korean only) even though it is possible to add a custom design to your button.
NAVER Login User Experience Design
6 / 19
2. Collect as little information as possible when signing up
In general, people expect that they can use a service immediately after they log in to the service using NAVER Login, without
going through additional steps.
However, if they are asked to provide phone numbers for account verification or to enter too much personal information,
many of them will choose to cancel their signups because they feel uncomfortable using NAVER Login. The best user
experience is to collect additional information only when needed. If it is the right time to ask for information, people will feel
quite comfortable providing it.
Remember that the goal is to get people to sign up.
Incorrect design
Ask for phone number or i-PIN verification when signing up
During the signup process, nothing makes people more uncomfortable than verifying their identities. Never ask people to
verify their identities unless it is required by law or your service requires that people use their real names.
NAVER Login User Experience Design
7 / 19
Ask people to enter their basic information instead of using profile information provided by NAVER
NAVER provides you with most of the information you may need from people such as username, email address, gender, and
so on. Don't ask people to enter their basic information again.
NAVER Login User Experience Design
8 / 19
Ask for additional information such as residential addresses and phone numbers when signing up (extra caution required for online shopping malls)
The more information you ask for, the more people choose to cancel their signups. Your service should ask for additional
information when people are trying to accomplish an action in your service. For example, your service can ask for residential
addresses when people buy your products. Remember that the most important thing you should do is to make people use
your service.
How people reacts when they are asked for additional information when signing up
"I thought it would be available immediately after clicking. Social logins make it more inconvenient. T_T" – netizen
A
"I closed the signup window because I was asked to enter my address and to provide my phone number for
account verification." – netizen B
NAVER Login User Experience Design
9 / 19
Design guidelines
1) If additional information is not required
Let people use your service as soon as clicking the NAVER Login button
NAVER provides you with basic user information you may need from people such as username, profile image, email address,
gender, birthday, and so on. Therefore, implement your login system where the signup process is completed only with
NAVER Login, without collecting additional information. The most important thing is to make people feel comfortable as if
there are no more steps to complete even when you ask them to agree to your service terms or to receive marketing emails.
NAVER Login User Experience Design
10 / 19
2) If additional information is required like residential addresses
Ask people to enter as little information as possible when signing up
The more information you ask for, the longer people hesitate whether to sign up for your service. Ask people to enter as little
information as possible when signing up.
NAVER Login User Experience Design
11 / 19
Ask people to enter additional information when required
Allow people to complete their signups without entering additional information and collect required information in context. For
example, it wouldn't bother people if you ask for their shipping addresses when they buy your stuff.
Don't show information provided by NAVER when signing up
Never reveal the profile information provided by NAVER on the signup screen, if it is a requirement of your service policy to
receive additional information from people when they are signing up. Simplify your signup form as much as possible.
NAVER Login User Experience Design
12 / 19
3. Add the NAVER Login button to both signups and logins
Add the NAVER Login button to both your signup and login screens and make the flow between two screens as natural as
possible.
People are most likely to click the Sign Up button at their first visit to your service. Therefore, if you add the NAVER Login
button only to the login screen, you wouldn't expect to get the best results. Make sure to add the NAVER Login button to
both of them so that people can use it wherever they are accessed.
Incorrect design
Add the NAVER Login button only to a login screen
New users will definitely think that they should sign up for a service before using it. Therefore, if the NAVER Login button is
not shown on the signup screen, people never know if they can use NAVER Login to log in to your service.
NAVER Login User Experience Design
13 / 19
People are not taken to the sing up screen after completing the NAVER Login process
If new users are not automatically taken to the signup screen when logging in to your service using NAVER Login, some of
them will choose to cancel their signups after wandering around trying to find a next step.
NAVER Login User Experience Design
14 / 19
Design guidelines
1) If you add the NAVER Login button to the signup screen as well as the login screen
Add the NAVER Login button to not only the login screen but the signup screen
Provide a NAVER Signup button (Sign up with NAVER) on the signup screen so that new users who click the Sign Up button
of your service can recognize the existence of NAVER Login.
New users should be directly taken to the signup screen after completing the NAVER Login process
Allow new users to use your service immediately after logging in if no additional steps are required; if any steps are required,
take them directly to a signup screen.
NAVER Login User Experience Design
15 / 19
4. Develop your service using the NAVER Login SDK
NAVER Login provides SDK for iOS, Android, and JavaScript. The SDK includes a sample application that allows you to
easily integrate the login authentication and make API calls.
• Downloads for the NAVER Login SDK (Korean only)
In addition, the SDK lets you make user logging in easier and faster by using the Quick Sign-in of NAVER App on the mobile
environment.
NAVER Login User Experience Design
16 / 19
Using NAVER Login with an existing member management system
NAVER Login can help companies improve their businesses; it is useful for not only startup companies trying to get new
users but also existing companies trying to make their old users returned. However, if you run a business where its own
member management system has been implemented for a long time, you may be concerned about how to add NAVER
Login to your service.
In this section, we offer some tips and things to consider when you merge existing user accounts with the NAVER Login
accounts and redesign your signup form.
With NAVER profile information, you can check if a user is a member of your service
Let us suppose that a person signed up for your service and created a username and password for the service. Later the
person forgets it and chooses NAVER Login to log in to your service. Now your service will have two accounts for the same
person so you may have trouble managing the purchase history of that person.
In order to provide the best experience for that person, your service should attempt to merge these accounts into one. In a
merging process, profile information such as email address, real name, birthday, and gender, which is provided by NAVER,
should be used to identify whether a user with the same information has already signed up. If there is not an existing user
who has the same information, then you should consider them to be a new user and take them to a signup screen.
NAVER Login User Experience Design
17 / 19
NAVER Login User Experience Design
18 / 19
Don't ask people to enter their existing usernames and passwords shortly after logging in.
It may annoy people when you ask them to enter their usernames and passwords immediately after they log in to
your service using their NAVER Login accounts, in order to merge two accounts into one. The best user experience
is to let your system automatically identify a person associated with the profile information provided by NAVER and
take them to a signup screen (for a new user) or display existing account information of the user (for an existing
user).
Simplify your signup form to collect as little information as possible
If you plan to ask people to enter their personal information during the signup process, make sure that your signup form is as
easy and as simple as possible.
The best user experience is to let people complete signups only with NAVER Login. However, if it is not possible due to your
service policy, create a separate signup page for NAVER Login and exclude information provided by NAVER from the signup
page so that people are asked to fill out a short signup form. For information on collecting user information while simplifying
signup forms, see "2. Collect as little information as possible when signing up"(page 6).
NAVER Login User Experience Design
19 / 19
Allow existing users to connect their accounts with the NAVER Login accounts
Provide a user interface that allows people to merge their service accounts with the NAVER Login accounts as shown in the
example below.
