谷歌抽屜

A couple of months ago Google has celebrated with enthusiasm 15 years of Google Maps, one of the most used and appreciated services worldwide from the company.

幾個(gè)月前，Google熱情地慶祝Google Maps誕生15周年，這是該公司在全球范圍內(nèi)使用最廣泛，最受歡迎的服務(wù)之一。

On the occasion of the birthday, some changes were made to the app — the one that most stands out is certainly the new icon — but one in particular has created a sensation: burgers and drawers have apparently disappeared.

在生日那天，對(duì)應(yīng)用程序進(jìn)行了一些更改(最引人注目的當(dāng)然是新圖標(biāo))，但是其中一個(gè)特別引起了轟動(dòng)：漢堡和抽屜顯然已經(jīng)消失了 。

Whoa, whoa, whoa, whoa哇，哇，哇，哇

什么是漢堡包和抽屜？ (What are hamburger and drawer?)

Excellent question! These two names could create a bit of confusion, however I’m simply talking about two graphic elements that we already saw in many everyday applications that we used for years.

很好的問題！ 這兩個(gè)名稱可能會(huì)造成一些混亂，但是我只是在談?wù)撐覀円呀?jīng)使用了很多年的許多日常應(yīng)用程序中已經(jīng)看到的兩個(gè)圖形元素。

For hamburger menu, or, more precisely, hamburger button, I refer to that icon with three horizontal bars that is usually always in the top left corner in applications. The name “hamburger” comes from its resemblance to a hamburger sandwich, with the two lines at the top and bottom to indicate the slices of bread, and the central one to indicate the hamburger.

對(duì)于漢堡菜單，或更準(zhǔn)確地說，是漢堡按鈕 ，我指的是帶有三個(gè)水平條的圖標(biāo)，通常在應(yīng)用程序中始終位于左上角。 “漢堡包”的名稱類似于漢堡包三明治，頂部和底部的兩行分別表示面包片，中間的兩行表示漢堡包。

Explanatory image from Google來(lái)自Google的說明性圖片

The drawer, or navigation drawer, is that graphic element that usually pops out from the left when we click on the hamburger. And it contains a lot of interesting things, like links to other pages of the app or information on the account logged in.

抽屜或導(dǎo)航抽屜是當(dāng)我們單擊漢堡包時(shí)通常從左側(cè)彈出的圖形元素。 它包含許多有趣的內(nèi)容，例如指向應(yīng)用程序其他頁(yè)面的鏈接或登錄帳戶的信息。

這是真的！ 我也有那個(gè)按鈕！ /等一下，我在應(yīng)用程序中看不到該按鈕！ (It’s true! I have that button too! / Wait, I don’t see that button in the app!)

The hamburger button and its drawer are elements that are easily found in Android applications, Google itself has included them, for several years, in a multitude of applications. And so many Android developers.

漢堡包按鈕及其抽屜是在Android應(yīng)用程序中很容易找到的元素，多年來(lái)，Google本身已將其包含在眾多應(yīng)用程序中。 許多Android開發(fā)人員。

They are not exclusive to the green robot, however, and can therefore also be found in some iOS applications: Apple has always preferred a tabbed approach, rather than the use of a drawer, no app developed by Apple has in fact a drawer (well, maybe the mail app has a very similar thing), or a hamburger button.

但是，它們并不是綠色機(jī)器人所獨(dú)有的，因此也可以在某些iOS應(yīng)用程序中找到它們： Apple一直偏愛使用選項(xiàng)卡式方法 ，而不是使用抽屜，Apple開發(fā)的任何應(yīng)用程序?qū)嶋H上都沒有抽屜( ，也許郵件應(yīng)用程序有一個(gè)非常相似的東西)或一個(gè)漢堡按鈕。

The guidelines for the development of apps also change according to the operating system: the specifications for the Android apps include the Drawer component, the Apple ones for iOS do not. This is why many apps have different styles based on the operating system for which they are developed: for example the Telegram app has a drawer on Android but itdoes not have it on iOS.

應(yīng)用程序開發(fā)的準(zhǔn)則也會(huì)根據(jù)操作系統(tǒng)而有所不同： Android應(yīng)用程序的規(guī)范包括Drawer組件，Apple的iOS規(guī)范則沒有 。 這就是為什么許多應(yīng)用根據(jù)其開發(fā)的操作系統(tǒng)而具有不同樣式的原因：例如，Telegram應(yīng)用在Android上具有抽屜，而在iOS上則沒有。

Finally, drawers and hamburger menus are not exclusive to mobile applications: they can also be found on websites, especially in their mobile versions.

最后，抽屜和漢堡菜單并不是移動(dòng)應(yīng)用程序獨(dú)有的：它們也可以在網(wǎng)站上找到，尤其是在移動(dòng)版本中。

那么，Google是否正在從其應(yīng)用程序中刪除抽屜？ (So, is Google removing the drawer from its applications?)

Well, maybe. Obviously this does not mean that apps will be poorer in content from now on: everything that was in the navigation drawer has been moved and made available in other parts of the app.

好吧， 也許吧 。 顯然，這并不意味著從現(xiàn)在開始應(yīng)用程序的內(nèi)容將變得更糟：導(dǎo)航抽屜中的所有內(nèi)容都已移動(dòng)并可以在應(yīng)用程序的其他部分使用。

YouTube has been one of the first apps from Google to have the drawer removed.YouTube是Google最早移除抽屜的應(yīng)用之一。

But there are some changes in progress. We have already talked about Google Maps, which removed this graphic element a few weeks ago, but it is not the only Google app to have done so.

但是有一些變化。 我們已經(jīng)討論過Google Maps，它已在幾周前刪除了該圖形元素，但這并不是唯一的Google app。

We don’t know if YouTube was the first on the list, certainly one of the firsts though: back in 2015 (yes, five years have already passed) the drawer was replaced by some tabs positioned just below the appbar. In the meantime, the app has been updated again and now the tabs are at the bottom, more easily accessible.

我們不知道YouTube是否排在首位，盡管無(wú)疑是首創(chuàng)：在2015年(是的，已經(jīng)過去了五年) ，抽屜被位于應(yīng)用欄正下方的一些標(biāo)簽所取代 。 同時(shí)，該應(yīng)用已再次更新，現(xiàn)在選項(xiàng)卡位于底部，更易于訪問。

Even Google Fit once had the classic hamburger button that opened a drawer once. It has now been replaced by a bottom navigation bar. Other apps are still changing: for example Google Ads shows the drawer in some cases, while a bottom bar in others (in these situations Google is likely to be testing server side, releasing the new layout gradually and in a limited way).

即使是Google Fit，也曾經(jīng)有過經(jīng)典的漢堡包按鈕，可以一次打開抽屜。 現(xiàn)在，它已被底部導(dǎo)航欄取代。 其他應(yīng)用程序仍在變化：例如，在某些情況下，Google Ads顯示抽屜，而在其他情況下，則顯示底部欄(在這種情況下，Google可能正在測(cè)試服務(wù)器端，并以有限的方式逐漸發(fā)布新的版式)。

抽屜怎么了 (What’s wrong with the drawer?)

Well, to be honest there is more than one reason why the drawer, but especially the hamburger menu, is a slightly outdated design pattern. The gentlemen of the Nielsen Norman Group (great experts in the sector) say it, and their article is pretty long, so something obviously is wrong.

好吧，說實(shí)話，抽屜(尤其是漢堡菜單)是一種過時(shí)的設(shè)計(jì)模式，原因有多個(gè)。 尼爾森·諾曼集團(tuán)(Nielsen Norman Group)的先生們(該領(lǐng)域的杰出專家)說過， 他們的文章很長(zhǎng)，因此顯然是錯(cuò)誤的。

We try to explain it in a slightly shorter way:

我們嘗試以一種簡(jiǎn)短的方式來(lái)解釋它：

• The hamburger button is difficult to reachOf course it is: most of the times it is in the upper left, the furthest point to reach with our beautiful right thumb. Furthermore, even the most important items in the drawer will always be at the top. Maybe once the problem was less pronounced, but in recent years smartphone displays have gotten bigger and bigger, and now this thing has become a problem.

  漢堡包按鈕很難觸及當(dāng)然是這樣：大多數(shù)情況下，它位于左上角，這是我們美麗的右手拇指觸及的最遠(yuǎn)點(diǎn)。 此外，即使抽屜中最重要的物品也始終位于頂部。 也許問題一度不那么明顯，但近年來(lái)智能手機(jī)的顯示屏越來(lái)越大，現(xiàn)在這已經(jīng)成為一個(gè)問題。

• There are multiple operations to do

  有多個(gè)操作要做

  This too may seem like a small problem, but a drawer forces us to make two taps on the screen instead of one: one on the hamburger button to open the drawer and one on the item we want to click. Third millennium problems, but still problems.

  這似乎也似乎是一個(gè)小問題，但是抽屜迫使我們?cè)谄聊簧宵c(diǎn)擊兩次而不是兩次：一次在漢堡按鈕上打開抽屜，另一次在我們要單擊的項(xiàng)目上。 第三千年的問題，但仍然是問題。

• We don’t see immediately what we need

  我們沒有立即看到我們需要的東西

  The elements we need are in the drawer, and where is the drawer? Hidden behind the frames of our display. And as long as we don’t tap on the hamburger button it doesn’t pop out.

  我們需要的元素在抽屜中，抽屜在哪里？ 隱藏在我們顯示器的框架后面。 而且，只要我們不點(diǎn)擊漢堡包按鈕，它就不會(huì)彈出。

• In the latest version of Android, opening the drawer by dragging it is almost impossible

  在最新版本的Android中，幾乎不可能通過拖動(dòng)來(lái)打開抽屜

  To open a classic drawer you can also swipe (drag your finger, for non-professionals) from the left edge of your smartphone to the right. This has been possible for a multitude of years BUT … in the latest version of Android, the same action, the swipe from left to right, also is used to go back. And so it happens that you want to open the drawer and exit the app instead.

  要打開經(jīng)典抽屜，您還可以從智能手機(jī)的左邊緣向右滑動(dòng)(對(duì)于非專業(yè)人士，請(qǐng)拖動(dòng)手指)。 但是已經(jīng)有很多年了……但是在最新版本的Android中，相同的動(dòng)作(從左向右滑動(dòng))也可以返回。 因此，碰巧您想打開抽屜并退出應(yīng)用程序。

  This is an accessibility problem, but not caused by the drawer itself; simply Google likes to experiment without solving the problems it creates.

  這是一個(gè)可訪問性問題，但不是由抽屜本身引起的。 只是Google喜歡嘗試解決未解決的問題。

Me finally opening the drawer by swiping in the latest Android version, after 112 attemps.經(jīng)過112次嘗試后，我終于通過刷入最新的Android版本打開了抽屜。

有哪些選擇？ (What are the alternatives?)

Now that the reputation of drawer and hamburger (button) has dropped a lot, let’s see together some alternatives or some improvements that can be made to significantly improve the usability of an app.

既然抽屜和漢堡包(按鈕)的聲譽(yù)下降了很多，讓我們一起來(lái)看一下可以顯著提高應(yīng)用程序可用性的一些替代方案或改進(jìn)。

A nice Bottom Navigation Bar

一個(gè)漂亮的底部導(dǎo)航欄

It shows only the most important elements, it is at the bottom and therefore easily accessible by fingers, it is always visible. It is also the solution that many are adopting to replace the drawer, and Google is also implementing it extensively (for a while it has become part of the official Material Design components).

它僅顯示最重要的元素，它在底部，因此手指可以輕松訪問，并且始終可見。 這也是許多人用來(lái)替換抽屜的解決方案，并且Google也在廣泛實(shí)施它(一段時(shí)間以來(lái)，它已成為官方Material Design組件的一部分)。

However, Apple has been using it since iOS 3. More than ten years ago.

但是，蘋果從iOS 3開始就使用它。 十多年前 。

Bottom Navigation Drawer — Image from Google, as always底部導(dǎo)航抽屜—與往常一樣，來(lái)自Google的圖像

A Bottom Navigation Drawer

底部導(dǎo)航抽屜

It doesn’t sound like a big innovation, does it? To be fair, this solution maintains all the graphic elements we have talked about so far, drawer and hamburger, but with many advances towards the problems they had: the hamburger button is at the bottom and much more accessible, and the drawer, popping up from the bass, it shows first of all (and not too far from the bottom) the most important voices, and only then the secondary ones.

這聽起來(lái)不像是一項(xiàng)重大創(chuàng)新，不是嗎？ 公平地講，此解決方案保留了到目前為止我們討論過的所有圖形元素(抽屜和漢堡包)，但是在解決它們所遇到的問題方面取得了許多進(jìn)步：“漢堡包”按鈕位于底部并且更易于訪問，并且抽屜彈出從低音開始，它首先顯示最重要的聲音(并且離底部不遠(yuǎn))，然后顯示次要聲音。

Two clicks remain to be done instead of one. A solution therefore suitable only for apps used by people who are not in a hurry.

還需要單擊兩次，而不是單擊一次。 因此，此解決方案僅適用于不著急的人使用的應(yīng)用程序。

結(jié)論 (Conclusions)

At the end, we don’t know if Google will take the plunge by removing the drawer from its applications. But we saw that he would have more than one reason to do it, or at least fix some problems.

最后，我們不知道Google是否會(huì)通過從應(yīng)用程序中刪除抽屜來(lái)采取行動(dòng)。 但是我們看到他這樣做的理由不止一個(gè)，或者至少可以解決一些問題。

And all developers or owners of applications should do the same: nobody likes to use an application that limits us in use instead of helping us.

所有應(yīng)用程序的開發(fā)人員或所有者都應(yīng)這樣做：沒有人喜歡使用限制我們使用的應(yīng)用程序而不是幫助我們。

Many are already doing it: apart from Google and Apple (which has taken a lot of care in this since the beginning) there are a lot of apps that over the years have changed their user interface to be easier to use. I’m talking about Spotify, Facebook, Instagram, Netflix, and many, many others.

許多公司已經(jīng)這樣做了：除了Google和Apple(從一開始就在這方面進(jìn)行了很多注意)之外，許多應(yīng)用程序多年來(lái)已將其用戶界面更改為更易于使用。 我說的是Spotify，Facebook，Instagram，Netflix等。

我們是誰(shuí)？ (Who we are?)

We are a team of developers and designers based in Padua, Italy.We make mobile applications and web apps, using Flutter, React and React Native. We are always ready to create something great!

我們是一個(gè)位于意大利帕多瓦的開發(fā)人員和設(shè)計(jì)師團(tuán)隊(duì)，我們使用Flutter，React和React Native制作移動(dòng)應(yīng)用程序和Web應(yīng)用程序。 我們隨時(shí)準(zhǔn)備創(chuàng)造偉大的事物！

Our website | Dribbble | Instagram | Linkedin

我們的網(wǎng)站 | Dribbble | Instagram | 領(lǐng)英

Are you interested on what we do? Drop us a few lines!

您對(duì)我們的工作感興趣嗎？ 給我們幾行 ！

翻譯自: https://medium.com/mabiloft/is-google-finally-killing-the-navigation-drawer-62337acb194e

谷歌抽屜

總結(jié)

以上是生活随笔為你收集整理的谷歌抽屉_Google（最终）会杀死导航抽屉吗？的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。