Changes to Orion's Sidebar / Vertical tabs handling
- Edited
Hey all I decided to merge the three threads we have into one as I realized
a) it is impossible to look at these things in isolation
b) managing and coordinating three threads is impossible
The main premise behind these three threads is that Orion's sidebar/vertical tabs/tab management need to be improved.
Our latest design thinking is this
From this I think thre are couple of things I notice
- the idea of having multiple sections on the sidebar visible at the same time (ie tabs/bookmarks/reading list) is I think going nowhere - it just looks too cluttered
- if we are going to move the url bar and controls to the sidebar, I think this can not be an option so the community should agree that this is what they want in vertical tabs mode
The reason is simple - it is already difficult to maintain this. Arc effectively has one mode (fixed vertical tabs, take it or leave it). Safari has three (horizontal tabs, compact horizontal, and vertical that is half done basically as tabs are duplicated and it is a mess). Orion, already has two, with compact style safari tabs planned and if we had optional url bar in sidebar we would have 4. Of course size of Orion team is order of magnitude smaller than Arc and two orders of magnitude smaller than Safari so to put 2x-4x burden on it won't get us anywhere, especially since there are 2000 open issues already. So we need to simplify.
We ask everyone for constructive feedback, having this spirit of simplification in mind.
Vlad Option 3 is by far the best. It’s the only one that doesn’t look like a dumpster fire. The toolbar buttons, search bar, and window switcher are all present and it feels natural. All of the prior suggestions in this thread had me screaming “No Thanks!”.
The bottom bar to switch panels is genius, everything is only a click away. I would rather click once to switch between them than mess around resizing groups every time my tab list grows too long.
Allowing multiple views opens up so many UX issues and a bunch of complexity.
- The different groups would need to be resized as the number of tabs grows. Users would constantly be shuffling them around.
- There would need to be a separate UI to choose (and possibly rearrange) the groups that are displayed.
- The sidebar itself would have to be scrollable which provides a poor user experience.
- Not all users have windows open in full screen
- Every implementation I’ve seen is a crowded mess
- There’s a ton of different menus and settings related to this feature that would be difficult to develop and maintain
As for where to put the toggle for horizontal/vertical tabs, simply add it as a button in that bottom bar. There’s plenty of room. You could also put it in the (..) menu below the address bar.
Overall, option 3 is clean, compact, and clearly well thought out. None of the other suggestions come close.
ForumNinja404 I completely agree. It looks great
Vlad if we are going to move the url bar and controls to the sidebar, I think this can not be an option so the community should agree that this is what they want in vertical tabs mode
Does this mean that the URL/tool bar and would remain as it is now when in horizontal tabs mode? That it would only shift to the sidebar when you switch to vertical tabs mode?
Would you mind sharing the figma files for these concepts? I've noticed plenty of Orion's users are also decent at figma and it could help with expressing our ideas.
I agree with forumninja that 3 is the best. Some additional notes:
- I think the question of where the extension menu pops up is easily solvable, just make it appear from the (...) button.
- would the window sidebar have the modifications I mentioned (where it shows the contents of the windows)? If it doesn't, then the issue of the "workspace" being an abstract concept still remains.
- The dot for the profile should be a bit bigger
- How does it look like when the sidebar is shrunk?
I also wonder how the Arc bros would react to orion making itself look more like arc, or whether it will seem like orion is losing its originality.
TheOtherKai Sure, @bg-d can share latest iteration in Figma
would the window sidebar have the modifications I mentioned (where it shows the contents of the windows)? If it doesn't, then the issue of the "workspace" being an abstract concept still remains.
I have multiple windows with >10 tabs. Barely the content of one can fit in the sidebar let alone multiple. It looks nice in a screenshot with 2-3 tabs each but this is not how it looks in practice for anyone who uses more window.
How does it look like when the sidebar is shrunk?
Good question. Arc of course does not let you do that. And I know many of our users have requested sidebar to be even smaller. These two are conflicting unless urlbar would shrink as well
Vlad Ideally yes. Still some edge cases to solve like what if you just want bookmarks in your sidebar and not tabs (and urlbar).
That's me. I use horizontal tabs and greatly prefer url/toolbar at the top of screen like it is now. I only use the sidebar for bookmarks and reading list, and don't have it open all the time. I don't want to be forced to use the sidebar for URLs and toolbar controls.
BTW I really like the buttons at the bottom of Design #3 for switching between views. This would be much nicer than the current method of switching. And maybe you could add an option to view History there too? That would really handy.
I don't like moving the urls bar and controls to the sidebar; can we do something like what safari did on ios?
- Edited
Some updated ideas -
image
and also link to figma
Regarding the sidebar size, that only matters if you have it visible all the time. I only want it to be visible when I need it, at which point I want it wide so things are not cramped. People who want the bar on the side have enough horizontal space and looking to trade it for vertical space.
Do you have data on how people are using the browser? Which settings are important to them? It may help
- Make some good defaults
- Avoid unnecessary options that makes the configuration more complex
- Edited
Appreciate the figma
Few comments,
1
For the windows sidebar, what does it mean when they're grayed out? Do they have no window currently open to them? Do they have no non-suspended tabs? I think that groups with active tabs should have some sort of indicator, in case of "where is that music coming from???" situations.
EDIT: grayed out means that they're suspended, accent color means that its active. There is a right click suspend option in the current implementation, and itll probably be in this new version too.
2
I think that the option for "switch windows in-place" should always be on, and if the user wants to open them in another window there should be a right click option to open the tab group in a new window. Opening them in a new window creates unintuitive behaviour, especially when the window is closed. Do the tabs get suspended? Do they continue being active? It may not be very clear to the user
The separation of the tab groups also makes it very hard to visualise it as one workspace.
3
Side scrolling on the sidebar should switch between the windows, tabs, etc sidebar. Maybe vertical overscrolling can switch tab groups too, because in the windows sidebar they're positioned on top of each other and it would make sense that scrolling far up/down "breaks into" the next tab group over.
4
In the search bar, does the tab search also contain tabs in other tab groups? It should, but have an indicator that its in a different tab group. Then pressing enter should switch to that tab group in-place.
5
Can the "Some Window" popup instead have a chevron.left (the squashed < character) that brings the user to the windows sidebar? In the current concept, from what I see, the windows sidebar and the popup do exactly the same thing. It makes more sense to me to just simplify the navigation.
Of course, the counter-argument is that the window switcher popup still lets you see the tabs and you don't have context loss. I still think that the simplification is worth it though.
Otherwise, I think this is a fantastic concept. Good job, orion team!
Vlad So no different than focus mode on mobile? The address bar is hidden when scrolling down, and reappears when scrolling up? I like that idea a lot.
Do "urlbar in sidebar" people thnk this is a good idea?
Personally, if I want the URL bar in the side (not top), I don't want/need to see it on top.
Vlad If it’s in the sidebar, it doesn’t need to be on the top. If it’s on the top and hidden on scroll down, there’s no need for it in the sidebar. I’d be fine with either solution.