11
Aug
2azuojemNJ7JJ1b3oehZDTtkPlyHo9SzIoT61X-iWQvUOguccC9vYr2loHyD2bbiDQ=w300

When we first discussed Google's effort to re-imagine interface design, it was expected that Google would release fresh designs in small steps, gradually easing its own apps into the new design language a few pieces at a time.

Inside an update that officially only contained stability improvements, Chrome Beta got one more lovely design element today - a beautiful build-out animation for the overflow menu. Readers who have taken a look at Google's new design spec will recognize the mechanics of the animation right off the bat - the menu appears in a sensible way, expanding from one origin point and building out menu items in a coordinated, predictable manner. Check it out:

flyout

It's a small touch, but an important step in Chrome's journey to becoming fully compliant with Google's new design specifications.

Update: As one commenter notes below, the menu animation isn't the only tweak in the latest Chrome Beta update - the address bar once again provides completion arrows where once there were none.

Screenshot_2014-08-11-20-33-34 Screenshot_2014-08-11-20-37-09

Left: Before, Right: After

Thanks Braulio Cesar Holtz Ribeiro, Eduardo Ribeiro, and everyone else!

Liam Spradlin
Liam loves Android, design, user experience, and travel. He doesn't love ill-proportioned letter forms, advertisements made entirely of stock photography, and writing biographical snippets.

  • AbbyZFresh

    this doesn't look lime Material Design

    • Kcls

      ...why?

      • AbbyZFresh

        I thought every single change in Google's products will be geared towards Material from now on. This doesn't look anything like it.

        • Kcls

          If you take a look here: google.com/design/spec/components/menus.html#menus-usage, you can see that while this new animation isn't exactly the same as what is seen in the guidelines, it is way more similar than what was there before.

          Google is updating its apps slowly to look like material design, but not quite full on material design so that once Android L actually drops, it's less of a shock to people when the apps all look different.

          This is definitely a step towards material design.

    • Salil

      Does it look lemon Material Design?

      •   

        Maybe she (apparently not a he) is trying to learn Spanish, a language whose definitions of lime and lemon can confusing, dictionary-confusing and region-dependent.

    • Spaniard85

      This is pretty much exactly what they talked about with Material Design...

      • joser116

        We won't see "native" Material Design of apps until they are built with L tools.

        • TonyHoyleUK

          And until there's a compat library to do it.. We're years off most apps targeting L directly.

          At the moment if you want to write a material themed app you have to do the colour changes, drop shadows and the floating buttons manually, which is a lot of work (round buttons aren't so bad but realistic drop shadows are total ballache). To do it properly you'd need some kind of tweening library to morph one screen into the other (personally I think the effect is hideous but it's the new standard so I'll have to do it eventually).

          • joser116

            "And until there's a compat library to do it.. We're years off most apps targeting L directly.

            At the moment if you want to write a material themed app you have to do the colour changes, drop shadows and the floating buttons manually, which is a lot of work (round buttons aren't so bad but realistic drop shadows are total ballache)."

            -That's precisely what I've been saying.

  • Felipe Pimenta

    I can't stop touching the Overflow Menu button anymore lol
    That looks so amazing...

  •   

    the first thing i do when setting any of my android device is go to dev settings and disable the animations. hopefully this slow and annoying animation will also be disable-abled with those developer options.

    • Nathan Walters

      Slow and annoying? It takes less than half a second, and it looks damn good.

      •   

        Right. For this particular one, since I usually don't have a reason to keep opening the Chrome menu, a one-time less-than-half-a-second waste of time might not seem like much.

        But I suppose you would agree with me that those less-than-half-a-second can add up to be an hour when you use your device with those animations in developer options turned on?

        Also as I mentioned I don't tap the Chrome menu a lot, but people who constantly need to get access to bookmarks, history, recent tabs,... should probably save those seconds (or minutes when added up) to browse the web instead of watching some unnecessary and beautiful animated motion.

        • trekla

          1 the menu buttons isn't suppose to be something that is part of a workflow.
          2 if it for some reason are anyway, then it shouldn't be an issue cause, you can do the swipe down and release before the animation is done, so if you use it a lot you will know where to release your finger.

        • Stoffers

          When you have to see those half second animations 7200 times they do add up to an hour. I imagine this would take a pretty long amount of time.

          • Anton Voloshin

            I don't see a slowdown because of 0.5sec animation. Unless you can move your finger instantly.

  • http://petercast.net Peterson Silva

    Could someone make a slow-mo version of that gif? I'd like to look at it for a few hours!

    • edinchez

      Go to 'Developer options' and change the animation scale to something like three seconds.

  • senor_heisenberg

    They also brought back the completion arrows in the omnibox.

  • Jeff Langsner

    Unless I'm crazy, this animation was also added to New Tabs being opened up from the [+] button in the tabs menu. Or perhaps it was always there since they added Material Design and I never noticed? If so apologies..

    Also if I remember, when you used to be on the New Tab page, when you scrolled down, the Search bar animation, slowly shrinking to the top, would actually clip with the Tab icon next to the overflow menu (And it drove me bonkers). Now there seems to be extra padding to add extra space between them so that the search bar now has more then enough room to clear the Tab menu icon, and reach the top of the screen.

    • Ramiro Fernandez

      I noticed the new tab animation too. Also, if you long press a link and select "open in new tab", the tab now expands out of the link. Very material, much design

    • joser116

      Good observations.

      Also, the new tab page animation was present with the first "Material Design" update. And no need to apologize.

  • Marc

    Unrelated: The download counter in the play store has changed

    • http://www.androidpolice.com/ Artem Russakovskii

      Yes it did. We're already on it.

      • Ibrahim Yusuf

        Unrelated: I just got an update for Google Search from 3.6.13.1319286 to 3.6.14.1337016

        • HellG

          Unrelated: I'm hungry.

          • Kevin Kuo

            Unrelated: I am just making an unrelated comment for the sake of replying to an unrelated comment in an unrelated comment chain.

          • matteventu

            Mhmhmhm... So that's "related".

          • DeadSOL

            Related: Potato.

        • Konstantinos Pap

          Post the .apk plz :D

        • makapav

          I can now cycle through the list of Google Now parking spots. I don't think I saw that before.

      • niklas_a

        Strange though is that it shows the lower bound in the range on number of downloads. E.g. an app with 100k-500k downloads is shown as 100k.

  • Nathan Bryant

    Even on none Nexus phones, the physical menu button works up a nice animation and how the list of settings layout when you press it.

  • cabbieBot

    Kinda stinks, actually, I liked how you could just swipe down from the menu overflow button to refresh, now you have to lift and tap.

    • fahadayaz

      Nope, you can. I just did it.

      • https://twitter.com/sukigu_ Sukigu

        You have to swipe down a little, then up again, whereas before the menu would appear below the button, so you could just swipe down.

        • http://www.twitter.com/joshuaworth Joshua Worth

          Just touch and slide left a bit and you're refreshing once you let go.

          • https://twitter.com/sukigu_ Sukigu

            I can't do that without triggering the quick tab toggle that happens when you slide from the action bar horizontally.

    • onthecouchagain

      Agreed. This sort of sucks. They should've never removed the refresh button from the main screen IMO.

    • ddpacino

      Swipe down a bit to open the menu, then swipe right over to the Refresh icon. Works, just tried it a few times.

  • Allen Tanguay

    We have to remember the final version of Chrome will look nothing like this. It was shown of at Google I/O with a much more simplistic and playing look

    • Dennis Ulijn

      do you have a screenshot of this? I can't seem to find it.

      • Allen Tanguay

        Sorry, I meant to post it earlier. Google is slowly working their way there on the beta. Even the "Material" update to the Play Store is less material than Chrome Beta right now, but it will get there too. The Play Store has been brought in line with Play Music, Play Newsstand etc.

        If you dig deeper, you can see elements of Material design implemented long ago in Play Music (the rounded overflow menu dots), Play Newsstand (the flat, single coloured tabs), and the AOSP clock app (the floating action button).

        Chrome Beta will continue to be updated until it looks like this:

        • Allen Tanguay

          The most interesting thing about Material Design is how closely related it is to HTC's Sense UI, right down to the simplified enlarged font.

          • ddpacino

            I think Google gavea HTC a sneak peek. HTC has MD before MD was even announced to the public! #conspiracy

        • Dennis Ulijn

          thanks, watched the entire keynote but that image didn't stick for some reason. Can't say i see that as a good step forward, but i'm not one for complaining when things change, so I'll see when the day comes.

  • whispy_snippet

    Good update! :D

  • Iacobus

    That's odd; I've had the completion arrows for the longest time and I'm using the release version of Chrome on my Nexus 7 2013.

    • Nathan Walters

      They've been in the release version for as long as I can remember, but they were removed a few beta updates ago. I'm glad to see them back.

    • joser116

      Stable Chrome has had them. For some reason, after the "Material Design" update of Chrome BETA, those arrows got removed, and now they are back in the beta.

      • Iacobus

        Ahh, OK. I didn't realize the beta version removed it a few versions ago. (Glad it's back because I would have missed it terribly.) xD

  • Artur Łukasz

    fonts fixed?

  • Matthew Merrick

    i still loathe the fact that chrome beta doesn't show how many tabs you have open anymore. >_>

    • niklas_a

      I love this. It removes my too-many-tabs anxiety.

      • ddpacino

        I kinda have to agree with this. The all-important toggle would be best, though. Hmm, just reminded me that tabs are supposed to mix into the Recents menu in L. Maybe that pending implementation has something to do with that...

  • John

    I love this so much

  • Nigel Emmerton

    Still hate that its now a thicker address bar...

    • hensu

      too bad it doesn't go away when you scroll down or anything...

      • Nigel Emmerton

        Yeah but still takes up more room than it needs to for the the sake of being pretty... Don't get me wrong I love the new style...just dont see why it needs to be that thick. Also on that note does it really need to come back down the instant I start scrolling back up? All these things add up.. I mean have you tried using the Windows phone browser...its crap tastic because of a few design desicions...

      • Nigel Emmerton

        Too bad it comes back down when you scroll even a little bit up...

  • yellowflash94

    For some reason the autocompletion doesnt work for me on chrome beta it won't complete the urls for me when im typing anybody else had this issue?

  • Fatal1ty_93_RUS

    The bookmarks menu was also remade a little, now it takes the whole screen instead of being centered

  • Sittya

    Am i missing something or is the refresh button in the url bar gone?

  • so

    does anyone else really hate the fact that you need to press menu for refreshing the page?

    • CalH

      Why? Now you have the most gorgeous animation ever if you want to reload the page :-D.

    • BigTimmay

      Yeah but it's unfortunately not going to change. Most people don't use it.

    • onthecouchagain

      Yes. I dislike they removed the refresh button from the main screen. It wasn't so bad before because you could at least slide from the menu button down to the refresh button in one tap and smooth motion, but now with the new menu animation, you can't do that without requiring more than one motion. It's a bummer. I guess they went with form over functionality.

    • MustWarnOthers

      Is there any reason why they don't include page refresh by pulling down when at the top of the page? Wouldn't that be consistent with the pull down refresh seen in many other Android apps?

      • Brad

        i'd be annoyed if i accidentally scrolled up too far, which i do often.

        • ddpacino

          THIS.

  • James_C_L

    Still missing the page #....

  • Guest

    Could anyone provide an APK file? Don't want to wait :C.

  • CalH

    Thank god they re-implemented the completion arrows. I really need those.

    And damn, this animation is amazing.

  • Robert Blenkinsopp

    Does anyone else have the issue where if you've set the Wikipedia app to handle wikipedia links, clicking such a link in a google search in Chrome beta appears to act as a "Back" operation? You can work around it by opening in a new tab but it's rather irritating as it doesn't open it in the app.

  • Kurt Schultz

    I've used chrome beta ever since it was released and I've never seen the arrows. How do you enable them?

  • Abudi

    Imo, nothing beats the transition on the new tab page when you scroll up and the search bar below the word Google morphs into the address bar.

    • MeanDroid

      You don't need Beta for that!
      I have been using that on standard chrome for a long time.
      Just enable the "NTP" option in "Chrome flags"

  • John

    Well... It will get a few "tohches" till i get used with it (becouse is floating over the adressbar),
    And they dont seem to accord much love to landscape mode (on 10' tablets). The "auto-complete arrows" wich are back, are postioned at the right end of thescreen (in nowhere world:-)

    But more annoying is that the Chrome Beta is still crashing (even whorse than before), it crashed 4-5 (Update: 6-7) (Update2 16-17) times in 5 min. on thiss website, tryying to write this comment.
    (Just like Sabbotage)
    First, the keyboard dissapears, after a few seconds its crashing.
    Or it gives me "Oh No" (Lost Conection) refresh page.
    Before it was flickering and then short after it was crasshing.

    I trough it could only get better (after flickering and crashing gets fixed)
    But not only that it didnt get fixed its whorese.
    ;-)

  • mustafa

    Idk if this is new but there's also a slight animation when clicking on the tabs button

  • onthecouchagain

    Too bad you can't slide to hit the refresh button now in one smooth motion. :T

  • xdapao3

    They are giving a lot of thought and care to the aesthetics of it all the while LOSING FUNDAMENTAL FEATURES like quickly and easily accessible page refresh, text search in the page and the display of the number of pages open!! WTF is this BS, effing Apple?!?!?

    • blindexecutioner

      Wow, I didn't notice that. Find in Page missing...Yet another reason not to use Chrome.

      • xdapao3

        Well, it's not actually missing, it's still there in the menu... BUT before you could quickly and easily accessing it by simply typing directly in the address bar and then tapping on the search icon which appeared in the drop down list!

        Anyway, even with all these (SENSELESS) steps back, Chrome is still my main browser on both my Windows PC and my Android smartphone and tablet (Note 3 and Tab S).

  • Sdluzzi

    @androidpolice There's also a new animation when you close a tab sliding it to the side. Check it out! 😁

    • ddpacino

      I think that was already present with the MD refresh.

  • Muhd Ihsan

    the animation work on kitkat,that good

  • makapav

    I hate that in menu scroll that the public version of Android Chrome has.

  • varagor

    It is beautiful, but can't they make it a touch faster? It feels a little like the animations in iOS in that regard.

  • blindexecutioner

    Beautiful is a bit much...

  • Irfan Hamid

    i tried it just now, and it doesnt feel completely smooth for some reason, And this is something i fear for all of Android L's animations

    PS: Running a nexus 5 on ART.

  • abobobilly

    Meh .......

  • Simon Belmont

    Yeah. Chrome Beta has been heading towards dumbed down and beautiful, and away from useful and utilitarian as of late.

    The removal of the quick search in the URL bar, and the refresh button as well, in particular. I hope this is just a temporary design change while it's in beta. I'm all for decluttering, but there's a limit before it makes workflow less efficient. My two cents.

    • Allen Tanguay

      It's a beta, no need to freak out. The quick text search will be re-added, and the refresh is in the menu now where it should be (unless you're refreshing every page you visit for some reason). The tab button will be removed altogether in the final release.

  • Shining Wing

    The menu animation definitely looks better than the old one, but it isn't Material Design's menu yet. The padding isn't right, and the overflow button isn't supposed to be in the menu. It would be nice if Google paid attention to their own guidelines.

  • Jamin

    Animation could be a little bit nice (appearing of the text). Good improvement but still not done yet.

  • punchtown

    just got an update the loading beam is now material blue too

Quantcast