Drawer navigation may reduce user engagement by half, and navigation product participation

Drawer navigation may reduce user engagement by half, and navigation product participation

Imagine you need to design an application that contains many pages and modules and cannot display completely in one screen. You will first think of designing a Tab navigation at the bottom or top. Wait a moment. What kind of Navigation seems a little inconspicuous? We try to get them to the sidebar, or ask the android team to name it "side drawer navigation ".

If your applications are also multi-view, the following topics in your team will be subject to intense discussion:

It is to display all the navigation options on the screen, so that your users can clearly understand the app structure and avoid unnecessary operations to discover; or use side navigation to make the display area of the main screen larger.

Currently, side navigation is popular on Android devices, while it is not widely used on iOS platforms. Therefore, our discussion also faces the following question: do Android and iOS apps have the same user habits and use the same navigation mode?

I think it is very valuable to share our experience here.

Availability vs. clean design

When we started the zeekbox project for the first time, we used the tab navigation on the top. Our reason is simple: "Don't remember what you don't see ". Since you cannot see these entries at first glance, you may not know where they are.

For example, if you do not see the guide on the left, you may not find the navigation path. If you find it once, do you remember the side navigation portal every time you come back to zeebox? Even if you remember, you still need to click twice each time you switch the topic.

However, from another point of view, there is no such line of tab navigation, which makes the design look much cleaner. By putting the navigation in the side drawer, there is more room for the main content area.

The design of side drawer navigation emerged 18 months ago.

Facebook used A new method of navigation around September 2013-or perhaps the Facebook app I was using as A sample of A/B test. Of course, since Facebook has done this, this solution should be good, I think so.

The Google Play team, who is friendly and willing to provide guidance, recommends navigation drawers on the sidebar as a new navigation method for Android apps.

So six months later, we decided to take the risk and try to switch to the sidebar navigation. To ensure that users can clearly find the side navigation, we set the sidebar to expand and display when the application is opened for the first time, as shown in the following figure:

When the new version was just released, our user feedback was great (such as "like new design, all 5 points !" Such feedback) but when we see our own data, this is really a disaster! The user engagement is halved, as if the sentence "don't remember what you don't see" was fulfilled.

Surprising fact

After realizing the severity of the result, we used a two-week release to restore to the top Tab navigation mode. At the same time, in order not to disappoint users who like new navigation, we reserve the option of side navigation in settings.

Six months later, zeebox has undergone many changes. We have a new "my TV" page with richer content, including subscription and advertisement, it is a very important page for users. To display more content on this page, we thought of trying to side navigation. Based on our previous experiences, this time we decided to use A smarter way to test A/B test.

My favorite A/B test tools and methods

We use Flinto to create a high-fidelity clickable prototype, which makes the design look like a real application, and users can complete it in a short time. Here you can see the Flinto prototype we created: Case 1, Case 2-get the best click on the iPhone: click in any area of the page, A highlighted prompt is displayed in the heat zone that can interact with each other. You can click these hot zones, just like using a real application.

We recruited users who liked watching TV programs and came to our studio twice a week to test different concepts and our design prototypes. In some cases, we can use a small sample user to test the selection scheme, as mentioned above for a prototype test on the "my TV" page. In other cases, such as verifying the use effect of the sidebar navigation, You need to observe the real use records of a large number of users. In this case, we need to use A/B Test.

For mobile app A/B Test, we use Swrve-in my opinion, the most mature A/B Test tool, which not only provides Goal Seeking (when the winning scheme is clear, a/B testing server can automatically switch all users to the best option), and can choose to provide different experience solutions for different users.

For example, if you are a Comcast source subscriber and you do not find that our application has the Xfinity remote control function, Swrve will let zeebox pop up a window to tell you the relevant information. Through the adjustment and control of this message reminder mechanism, A/B test tends to have A more reasonable test result every day.

We used the 15/85 method to test the effect of sidebar, that is, we put the sidebar solution for 15% of users, and 85% of users maintained the Tab navigation mode. We released this new version for A/B Test, waiting for the final Test results...

For example, the test results are amazing.

The Influence of Drawer navigation and tab navigation on user Usage Frequency

The frequency of weekly use is decreasing (obvious comparison), the frequency of daily use is decreasing, and the time spent by users in applications is decreasing. Navigation on the sidebar looks like a disaster in the first round of testing.

Thanks to A/B test, we can quickly switch all users to the tab navigation solution after A period of verification.

If the argument about using the sidebar or tab also appears in your team, I think our research experience is worth sharing with you.

When we decided that the sidebar was not suitable for our products through A/B test, facebook also released A new version of the application, or adopted A fixed bottom tab navigation. Therefore, on the iPhone, they finally chose a conservative navigation method.

On Android, how do they deal with it. On my Android device, the solution is displayed on the left (switch different pages through the secondary tab), and on my colleague's mobile phone, the solution is displayed on the right, switch between different pages through (navigation ). Facebook must also use A/B test to test users' different responses to drawer navigation and tabs. I am looking forward to the final results of facebook's test.

In the latest face version, solution 1 is used, that is, tab navigation, as shown in

Facebook's latest decision

So when is side navigation suitable?

My suggestion is that if the main functions and content of the application are all in one page. Some user settings and options must be displayed on other pages. These auxiliary functions can be placed on the sidebar for the purpose of making the homepage look clean and beautiful.

If your applications have different views and they are of the same level, you must treat them equally, the Sidebar will waste the potential engagement and interaction of most users for the entries in the sidebar.

How to Reduce website bounce rate website operation analysis

The reason is simple: visitors have different needs, so they have different associations with your website.
Allows users to interact with your content to generate sales, subscription, tagging, and return visits. One of the best ways to increase reader engagement is to ensure that your website links are Associated Content and Display them in a way that encourages users to click.
The bounce rate is usually used to measure the engagement rate of visitors. It refers to the percentage of visitors who leave after logging on to the page. After these visitors log on, they jump out without looking at other pages. You can use statistical tools like Google Analytics to easily calculate the bounce rate of your website.
A low bounce rate means that visitors are exploring your website more deeply. It can also be inferred that visitors and your content are highly involved. Jacob Nielsen mentioned in his article that bounce rate is still an important indicator.
As bounce rates are getting higher and higher, we must stop using independent visitors as a metric for measuring website success. Those who leave the website immediately increase the number of independent visitors, but it does not play a role in long-term value. On the contrary, bounce volumes should be regarded as negative statistics: the website does not have enough temptation for them to participate, even if they do not browse the page for a second.
Nielsen suggested that bounce rates must be analyzed separately because there are four main sources of users: low-value recommendations, direct links to other websites, search engines, and Loyal users. The reason is simple: visitors have different needs, so they have different associations with your website.
Loyal users can access your website through the feed reader (to easily read RSS and Atom documents) and exit after reading a new article, because he is busy reading more content. Users who are eager for knowledge will access your website through search engines and will easily be tempted to click and view them everywhere. A loose visitor opens a page when browsing social channels like StumbleUpon.
Note that the bounce rate varies from source to source. Therefore, we should compare and analyze the bounce rate based on similar data in the past. For example, the search engine recommendation effect should be measured based on the previous bounce rate, rather than based on another visitor source (such as Digg.
1. Determine bounce rate based on the overall website goal
Comparing bounce rates with different visitor sources can show the value of your traffic. A low bounce rate may produce purchase, subscription, or return visit, which helps you find the best traffic source. Note that the bounce rate of each source should be determined based on the overall goal of the website.
In addition to the access source, there are also some problems that will affect the bounce rate. For example, the purpose and current design of your website. It is difficult to determine a scale as a standard for measuring bounce rates, but analysis expert avanciq kosike provides some good suggestions:
Avinash said that there is a difference between a blog and other static websites. For a blog, the bounce rate of 50% is normal, and the bounce rate of 75% needs to be noted.
Indicators are useful, not only in identifying bounce rates, but also in influencing a specific target (such as conversion rate ). You cannot determine the bounce rate of your competitors or peers, so you need to focus on your website's past achievements and study trends to differentiate visitor models.
2. Improve bounce rate and get more page views
Each website has its own goals and requirements. Therefore, we will not describe each situation in detail here, but will only talk about the overall strategy. First, visual things have a great impact on the bounce rate of visitors. If they encounter a very relevant link, call for action, or information, they are more likely to click on other pages.
Optimizing the web page and connecting the web page to a whole can not only add value to loyal readers, but also add value to visitors who visit through referral websites or search engines. Suppose that your visitors have no idea about your website. If they want to know more information, they need to make the navigation points easy to use and add appropriate links around the content.
Nielsen proposed a solution to reduce the bounce rate:
Test A group of users. Ask them to log on to your website from a specific webpage and get feedback based on their experience. This helps you think of improvement methods.
Publish the next step. If the visitor is interested in the current page, let them take action. Add more links under the copy or in the content,... the remaining full text>