Context

Using chrome on android feels like a rather unpolished experience, especially for an application that consumers will need to use every day. This is because most of the UI that allows users to interact with the browser is consistently in the least reachable areas of the screen, this phenomenon is visible when highlighting the components that we can interact with:

It's understandable to think that this choice was made deliberately, as when browsing, the content users care about is the website rather than the browser itself. However, in this project, I wanted to experiment with a few components to improve reachability and one handed use of chrome on android, while still keeping a strong focus on the content of the webpage. 

Work Overview

A quick overview of the updates to certain components of the chrome browser, with a focus on why they could improve reachability on modern android devices.

The Floating Search Bar

The main use case for a browser is to find information, the address bar is the first component that users need to interact with to launch a search, it's also one of the least reachable as its positioned all the way at the top of the screen. It was natural to start with some tweaks to the address bar to improve reachability. 

The Floating Search Bar is meant to replace the address bar, it is positioned in the lower part of the screen, with a significant margin to the bottom of the display. This margin is there to accommodate for our smartphones small chins, as narrow bezels can make hard to reach elements that are stuck to the bottom of the display. 

The Floating Search Bar will smartly get out of the way depending on the user's scrolling behavior, when scrolling down the bar should automatically be hidden. 

To make sure that the floating search bar is compatible with older devices (with a larger chin), and to account for user preferences, we allow customers to dock the Floating Search Bar to the bottom of the screen. 

Note: this feature can be disabled in the chrome settings, in this case users will have to pick between the Floating Search Bar and the docked bar style.

Search item list order

When talking about reachability it's important to keep the experience consistent across an application: let's say that a user wants to complete a task, and, to achieve that task, they need to go through step A and step B. If we make step A accessible, but then on step B the user needs to reach the top of the screen, the work done to optimize for the step A was all for nothing.

In this spirit, the "suggestion and past searches" list order was reversed, i.e after the user taps the search bar, the most relevant results are placed the closest to the user so that they are the easiest to select.

This feature would absolutely need further usability testing to make sure that users find it more convenient, mostly because we read from top to bottom. An option to combat this natural reading motion would be to add a staggering animation to show the most relevant Items first.

Quick Tab Switch

Users should be able to Swipe on the Address Bar to switch to the last active tab, this is something that can already be done today but the interaction is extremely hard to achieve as the Address bar is located at the top of the screen. Discoverability of the current interaction is also really poor, this is why, we're adding the icon of the background tab just behind the address of the focused site.

The swipe action was selected as it is used to switch between applications on Android. On the contrary, tapping on the icon of the background site could confuse users that inadvertently tap too far to the left to open the search bar, every tap on the search bar should launch a search.

Contextual Page Menu

Today there is very little organizational effort made in chrome's kebab menu, the different items are simply listed out in a dropdown menu, this makes it rather complex to quickly determine which button does what. To improve the information architecture over the classic chrome dropdown menu, the new contextual menu is split into what could be seen as 2 groups:

• A bottom navigation cluster, these buttons are really big so that users can still tap them comfortably on devices with small chins.

• The top list, which provides all contextual actions for the active tab (sharing, translating) as well as a search bar for the "find in page" feature, and a desktop mode switch.

Tab Tile Dashboard

This new carousel style dashboard is reminiscent of the Android and iOS application switchers, users should be familiar with these OS level functionalities so they should adapt quickly to this new layout.

This new dashboard is meant to represent a single pane of glass where users can access all their pages, whether these are active tabs or historical ones( bookmarks, recently closed tabs). The bottom based categories are meant to help users switch between their tab groups without having to reach to the top of the screen. In case users have a lot of active tabs, the Navigation pucks at the bottom of the carousel can be used to select distant tabs.

As an added bonus, Incognito mode is made readily accessible to allow quick switching as soon as the dashboard is opened.

Conclusion

This refreshed version of chrome should drastically improve overall reachability, a good way to confirm this is to compare the clickable areas of the new pages and the old pages.

It's clear that most of the actions that required the user to reach to the top of the screen can now be achieved without moving your hand from the bottom of the device. It's also clear that these changes are quite significant, since chrome's user base is gigantic, it might not be wise to modify all these components at once: Some usability test would definitely be required to make sure that these changes are welcome by a significant part of the user base.