Skip to content
This repository has been archived by the owner on Feb 20, 2023. It is now read-only.

Search bar should be located at the bottom if toolbar was set to be at the bottom #7461

Closed
SL-Lee opened this issue Jan 2, 2020 · 18 comments
Assignees
Labels
Feature:Search Feature:Toolbar Address bar, see also Feature:Search needs:UX-investigation Issues where UX needs to define or scope a solution or determine feasibility

Comments

@SL-Lee
Copy link

SL-Lee commented Jan 2, 2020

Why/User Benefit/User Problem

The toolbar at the bottom can benefit the user by having the menu conveniently located within reach of their fingertips. When a user sets the browser toolbar to be located at the bottom, he/she would expect consistency in the design. However, the address bar moves to the top when tapping on it, which is counter-intuitive and defeats the purpose of a bottom toolbar since the user would still need to reach for the top of their screen when searching for something or inputting an address.

What/Requirements

If the toolbar is set to the bottom, the address bar should move to the top of the keyboard when tapping on the address bar. This keeps the address bar within reach of the user's fingertips, as it is in close proximity to the keyboard.

┆Issue is synchronized with this Jira Task

@SL-Lee SL-Lee added the feature request 🌟 New functionality and improvements label Jan 2, 2020
@Rodze
Copy link

Rodze commented Jan 5, 2020

Indeed. Just look at messaging apps, when the text field is at the bottom it stays at the bottom when typing, above the keyboard. It is the most obvious and better user experience, after all the whole point of the address bar at the bottom is it for it to stay closer to the user finger and it going to the top at any time defeats the entire purpose of it.

@NotWoods NotWoods changed the title Address bar should be located at the bottom if toolbar was set to be at the bottom Search bar should be located at the bottom if toolbar was set to be at the bottom Jan 5, 2020
@kbrosnan
Copy link
Contributor

kbrosnan commented Jan 6, 2020

See previously #562. @apbitner was this behavior wontfixed in 562?

@apbitner
Copy link

apbitner commented Jan 6, 2020

@SL-Lee and @Rodze, I'd like to better understand the issue. If the toolbar is at the bottom and you tap on it the search bar moves to the top of the screen so that as you start typing the browser displays a list of suggestions, history, etc., between it and the keyboard. I understand the messaging app reference but the key difference is those apps aren't displaying a list of suggestions when the user is typing.

@SL-Lee
Copy link
Author

SL-Lee commented Jan 6, 2020

With the search bar at the top of the keyboard, the suggestions can be ordered by relevancy from bottom to top, as having the most relevant suggestion closer to the keyboard would require less effort from the user to tap on it. This comment and this comment on #562 has already provided a general overview of how it would look like.

@apbitner
Copy link

apbitner commented Jan 9, 2020

@kbrosnan we can keep this open as a feature request, it wasn't intentionally wontfixed

@darkwing
Copy link
Contributor

@AmyYLee Do we want to implement this? Any more info you can provide about implementation details?

@darkwing darkwing added the needs:UX-feedback Needs UX Feedback label Feb 11, 2020
@AmyYLee
Copy link
Collaborator

AmyYLee commented Feb 12, 2020

@AmyYLee Do we want to implement this? Any more info you can provide about implementation details?

Hi,

I spoke to the team and this is something we will investigate. Moving forward, @topotropic would be the point person for search on mobile.

@AmyYLee AmyYLee removed the needs:UX-feedback Needs UX Feedback label Feb 13, 2020
@darkwing
Copy link
Contributor

@topotropic Is this actionable from the team? Will it be actionable within the next few weeks?

@AmyYLee
Copy link
Collaborator

AmyYLee commented Feb 18, 2020

@AmyYLee Do we want to implement this? Any more info you can provide about implementation details?

Hi, I spoke with the team. This is something we will explore post migration. We would like to ensure proper investigation as to

@topotropic Is this actionable from the team? Will it be actionable within the next few weeks?

@darkwing This won't be actionable prior to release.

@darkwing
Copy link
Contributor

@vesta0 Based on @AmyYLee's feedback, we should remove this from the Polish board.

@vesta0 vesta0 added needs:UX-feedback Needs UX Feedback needs:UX-investigation and removed feature request 🌟 New functionality and improvements needs:UX-feedback Needs UX Feedback labels Mar 29, 2020
@SL-Lee SL-Lee mentioned this issue Mar 30, 2020
@kbrosnan kbrosnan added the Feature:Toolbar Address bar, see also Feature:Search label Apr 16, 2020
@lmorchard
Copy link

FWIW, since I just saw this issue and it's one of the papercuts that has me dragging my heels on Fenix, this is my experience:

  • Customize, put bar on bottom.
  • Look at bar, tap bar.
  • Bar slides off the bottom of the screen.
  • Keyboard slides up.
  • Bar is gone, where did it go?
  • Oh, right, it snuck out of my visual focus and is now at the top.

Small dumb papercut thing, but it slightly annoys me every time.

@brampitoyo brampitoyo self-assigned this May 7, 2020
@brampitoyo
Copy link

brampitoyo commented May 7, 2020

Adding some mockups of what the search screen looks like if the address bar is positioned on top of the keyboard.

Any thoughts about the ordering of search suggestions and results?

  • Bottom–top: more consistent with information hierarchicy, because the first suggestion sits directly on top of the address bar, which is on top of the keyboard
  • Top–bottom: more consistent with reading and scroll directions, as well as other messaging apps

@yoasif
Copy link
Contributor

yoasif commented May 7, 2020

Any thoughts about the ordering of search suggestions and results?

* Bottom–top: more consistent with information hierarchicy, because the first suggestion sits directly on top of the address bar, which is on top of the keyboard

* Top–bottom: more consistent with reading and scroll directions, as well as other messaging apps

Edge on Windows 10 used top-bottom, as does Kiwi on Android.

Both put the location bar right above the keyboard.

@yoasif yoasif mentioned this issue May 13, 2020
4 tasks
@vesta0 vesta0 added needs:UX-feedback Needs UX Feedback and removed needs:UX-investigation labels May 25, 2020
@hwinnemoe
Copy link

Adding some mockups of what the search screen looks like if the address bar is positioned on top of the keyboard.

I think the suggestions should appear directly above the shortcut button / scan button.

Any thoughts about the ordering of search suggestions and results?

I would prefer bottom-top since it is "more consistent with information hierarchicy, because the first suggestion sits directly on top of the address bar, which is on top of the keyboard".

@willfs84
Copy link

Thought it's worth pointing out that Internet Explorer on Windows Phone had this layout/behavior and it was a great experience, so UX has nothing to worry about, it's been done before and it was great. Watch the beginning of this video to see it for yourself https://www.youtube.com/watch?v=-KDBFy5VZv8

@AmyYLee
Copy link
Collaborator

AmyYLee commented Jun 23, 2020

@brampitoyo for follow-up

@AmyYLee AmyYLee added needs:UX-investigation Issues where UX needs to define or scope a solution or determine feasibility and removed needs:UX-feedback Needs UX Feedback labels Jul 3, 2020
@opusforlife2
Copy link

Update for those who are subscribed to this thread: This is coming as part of the "New Search Experience".

@brampitoyo
Copy link

@opusforlife2 Yes. You are right. Please follow along the update on #13052, and we can now close this issue in favour of that.

Quoting:

The position of the toolbar now depends on whether it’s set to bottom or top:

  • Toolbar on bottom: it “jumps halfway” above the keyboard. This will go a long way towards smoothing out abrupt motion.
  • Toolbar on top: same as current behaviour – it should still “jump” to the top of the screen.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Feature:Search Feature:Toolbar Address bar, see also Feature:Search needs:UX-investigation Issues where UX needs to define or scope a solution or determine feasibility
Projects
None yet
Development

No branches or pull requests