12

Hey!

Developing a browser in 2022 is exciting, to say the least! A browser is the single most important app on our computers.

Most feature requests in this forum are about improving or repeating the interfaces that exist in other browsers. Allow me to jazz it up a bit by offering less traditional, more brave ideas! I'm not suggesting to implement them immediately, but hopefully they will ignite your imagination as well.

So! Idea 1. Magic toolbar that disappears on scrolldown, appears on scrollup or tab click. Demo:

Inspired by recent discussion of compact tabs - https://orionfeedback.org/d/92-compact-tabs/88 - as well as similar behaviour on mobile browsers.

Advantages:

  • it solves the same problem as "compact tabs" and "focus mode" try to solve - give more space to web content.

  • it might look unusual at first (because it is!), but I claim that almost immediately, users would get used to it. The toolbar almost becomes part of the webpage it serves.

  • scrolling up is the cheapest interaction, it requires no effort from user. It is easier than typing a shortcut with keyboard, or clicking a screen button with mouse. Users would have no problem revealing the toolbar with scrollup gesture (swiping on trackpad or rotating mouse wheel).

P.S. And what are these tab groups on sidebar? That is for another post :-)

    eirk

    Thank you! You might ask, how would this look with tabs on top. Demo:

    • Vlad replied to this.

      vladstudio Thanks for producing these mockups to show your idea, great job.

      I would expect everything to disappear scrolling down, leaving Orion basically in "Focus mode". Can you animate that interaction and also in the version where tab bar is below toolbar (original Orion UI)?

        Vlad

        thank you! I don't have a chance to make a new mockup right now, but briefly - I'm afrading hiding/showing both tabbar and toolbar will not work as good, for several reasons:

        • it's just too much motion;
        • keeping tabbar always visible is important - otherwise user would lose context easily. Toolbar, however, relates to current tab only, and becuase of that, can be hidden/shown without disorienting user. User may proactively hide tabs by turning on "focus mode" - but this behaviour should not be automatic (e.g. triggered by scroll).
        • where would min/max/close buttons go? 🙂

          Vlad nevermind, I made the demo :-)

          I'd still say that my arguments from the previous post are valid - too much motion, losing context.

            Hey thanks for sharing this in the other thread, I've upvoted because I love the idea. One of the things that crossed my mind though that I'd like to add is this: Instead of making the toolbar re-appear on scroll up only, perhaps it could also re-appear if you move your mouse cursor to the top of the browser canvas.

            That said, I foresee problems with both solutions. For your solution, if you've scrolled down a page a bit and then wish to go to a different website, you need to scroll up to make the bar re-appear. That's probably not a problem, but it does require you to remember the need to scroll up. If I just move my mouse back to the top of the window, as years and years of muscle memory have been ingrained into my very being, I'll be briefly lost looking for where the address bar is.

            With my solution, the issue I see is if you've scrolled down a page, but then wish to click on a link that's right at the top of your canvas, and you move your mouse up to the link, the toolbar will re-appear over the top of your link, causing you to have to scroll back up to be able to select the link.

            Just some food for thought.

              ajgraves - thanks! Glad you liked it!

              I did consider revealing the toolbar when mouse is close to top. While it's more reliable to make a prototype and "feel" it, I believe this solution will not work. Let me explain: suppose you scroll a page down, then move the cursor to top, expecting the toolbar to appear.

              • in my demos above, the toolbar appears together with web content scrolling up (and this is intentional). Even if a page has fixed layout (nothing really scrolls), the user's scroll gesture reveals the toolbar - that feels natural.

              • if you move your mouse, and content starts to scroll up (to reveal the toolbar) - that will feel really strange.

              • and if you choose to " overlay" toolbar above any content you have on top, then it's bad usability - you see the content on top of page, but you cannot interact with it (the toolbar will overlap it as soon as the cursor is close).

                ajgraves - forgot to add.

                "you need to scroll up to make the bar re-appear. That's probably not a problem, but it does require you to remember the need to scroll up" - I have no proof, but I have a feeling that this would not be a problem (at least, it works this way in many mobile browsers).

                  vladstudio it does, however I can still tap the bottom of my screen in mobile Safari and the toolbar shows up, instead of requiring a scroll to make it re-appear. Again, this is all just food for thought, and I acknowledge there are potential problems no matter which way you go.

                    First things first, I just want to say this is a very detailed and well laid out feature suggestion with some great mockups!

                    With that being said, if I could chime in with my opinion, I think the idea of moving elements on a desktop browser is just too much of a visual overload. I think the idea works well on mobile due to 1: the lack of screen real estate meaning if there were no moving elements we wouldn't be able to actually see what we want to. And 2: web browsing on a mobile is inherently slower, therefore animation times on moving elements aren't as annoying as if they were implemented on a desktop browser.

                    Personally there's nothing more annoying for me than loading a webpage, then having elements shift all over the place as individual elements load and get rendered. I think this would be slightly similar to that - enough movement to be frustrating, especially with how naturally fast I like to browse the web. Also this feature would cause a whole other weird side effect on sites that already having a scrolling header implemented at the top of the page.

                    I do think if this was some sort of article reading mode it would make sense to gain the extra vertical space, but then that begs the question - what's the point in reader mode?

                      JunkBrunstoe thanks! The only way to really find out if this idea works or not is to make a prototype and use it for at least several days to browse the web. Alas, this is outside of my skillset; although, hmm... (I could make a javascript prototype that works inside existing browser, then make this "real" browser fullscreen so that "fake" browser feels like a real browser)....

                      "having elements shift all over the place as individual elements load and get rendered" - that is indeed annoying, and this is very far from the described idea. You, as a user, control the web content motion by scroll gesture.

                      All that changes is that, visually, the toolbar stops being part of "interface" and becomes top part of "web page". This is why i think it can work well - but again, hard to say without prototyping.

                        vladstudio Wow there has been a lot of activity here! Hard to catch up.

                        I think where this idea makes sense is with our version of compact tabs (discussed in the other thread) where there is minimum amount of toolbar to be moved away.

                        It also looks good in your original suggestion here, but warrants another big change, moving tab bar above the address bar. I'd argue that in this case the swap is not needed, as keeping address bar on scroll and nav controls is more important than keeping tab bar.

                        Also note that in when moving it away it should slide faster than the content is scrolling (about 1.5x-2x) faster. The same is on iOS.

                          6 months later

                          I love the look of this, it's very 'apple'! I think in practice it could be annoying... but if Vlad could get it just right in terms of usability it would be a literal sprinkle of magic which could really give the browser a bit of flair and attention that it deserves. I just wish we had a bigger development bandwidth as auto updating extensions is essential to get to a 1.0 release.

                          • Vlad replied to this.

                            adamt I believe the team is doing a magnificent job, no other browser in the world has this tempo of releases. All that while being verifiably the fastest browser on Mac, and with zero telemetry.

                            People see potential with that and that is why this site has over 1,500 open issues 🙂

                            Also less than 200 people in the world pay for Orion (thank you for being one of them). So we are working with extremely limited resources still paying for bulk of development cost out of my own pocket as we are completely bootstrapped.

                              Make an option to hide the toolbar when scroll down page, as in mobile version of the browser.
                              Toolbar

                                a year later
                                Merged 2 posts from Add "Hide toolbar on scroll" option for Desktop.
                                  No one is typing