cancel
Showing results for 
Show  only  | Search instead for 
Did you mean: 
batata
Strollin' around
Status: In review

The latest controversial proton redesign added new two lines tabs, however it haven't been put to great use.

I think we can do better and at the same time bring back the compact mode by merging the search bar and the tab bar.

00.png

While we put the url directly into the tabs, other icons could go in the tool bar, making a better use of the window surface.

01.png

The url is a clickable text area

02.png

and expands to show the full search bar when we start typing.

03.png

----------------------------------------------------------------

UPDATE 1

To elaborate a bit more on my original idea

  • We could put the hamburger button on the left because it looks a bit weird next to the reduce button (at least on windows)
  • The same way the download icon is hidden unless we're downloading we could hide the back and forward buttons unless there's something in the history
  • The refresh and fav button could be on the tab (and visible only on hover maybe ?)
  • The many icons that can appear on the left of the address bar could be fused all together in one single tabbed panel. The displayed icon would change based on priority :
    Sans titre.png
    (btw the Extension label could be removed and only show the extension name)

Which gives an even slicker look :

99.png

----------------------------------------------------------------

UPDATE 2

With larger active tab and refresh/fav icons.

With many tabs it could look like this :

99.png

I also added the sound indicator icon instead of the "Playing" text (this icon is already used on pinned tabs).

And since the Lock icon is not always visible with my unique icon idea I talked earlier I though we could color code the domain, green = secured, red = not secured. 🤔

78 Comments
canuck617
New member

This work around is not working.

Every time there is an update, there is some kind of monumental useless change.

Why in gods name would someone want double spacing in their drop down menu's so that one has to scroll an extra few miles for something that needed NO CHANGE to begin with!

I am so sick and tired of all these idiotic changes, if it AIN'T BROKE DON'T FIX IT..!

It's not that hard...

 

 

 

Anonymous
Not applicable

this idea is amazing

Anonymous
Not applicable

@batata @steel835 @brochard @everyone Pleaseeeeeeeeeeeeeeeee look at this idea Hi all! I have this idea: "compact bookmark"... if have new-compact-design:

compact_bookmark.png

Anonymous
Not applicable

I have a revolutionary idea. Based on the compact design for Mozilla Firefox. Here:

redesign1_firefox_compact.png

Key points of this idea:

  1. There is no toolbar. This toolbar is hidden, it only appears when the user clicks on the tab. If the user does not click on the tab, the toolbar will not appear.
  2. This is super interesting, most users have never used a computer in their lives, only mobile. If this is true, it would be worthwhile to have a compact design for Firefox, as it would be very important to have that part of mobile users using Firefox. This is the first thing the user sees:

ideafirefoxcompact2.png

Notes

  1. This allows for greater productivity.
  2. In addition to letting mobile users know how to use Firefox.
  3. This is great for users' health, it doesn't strain the eyes.
  4. Browsers like Safari and Minimal have a compact concept. However Safari and Minimal browser were still not as good as Mozilla Firefox in terms of ui/ux proposed here.
  5. As I said before, if the user clicks on the tab, the toolbar appears below.

user navigation

  1. Normal view: Toolbar retracted.
  2. Hover over the bar - Toolbar uncovered
  3. Address bar on focus (Click on tab or open a New Tab - toolbar extended)

For software developers - Functional requirement:

  1. Option to customize the toolbar display.
  2. Note: Customizing the toolbar includes the option to show or not show the Toolbar.

References

  1. https://www.apple.com/br/safari/
  2. https://minbrowser.org/
  3. https://www.makeuseof.com/tag/alternative-chromium-browsers/
  4. I'm not promoting another browser like Safari, MinBrowser when leaving the reference link, I'm just referencing to you guys understand what I'm talking about
steel835
Familiar face

Not sure about boosting productivity or making it easier for mobile users, since it's about saving space trading off more clicks + this doesn't quite look like mobile. However, showing lower toolbar on hover is an interesting idea.

I tried to imagine a true compact mode though, almost as in @batata idea, here's what I imagined (sorry for russian on the screenshots, but I think the idea is clear w/o needing to understand the language):

steel835_0-1650668985968.png
Second level of toolbar is not displayed, but tab-bar now contains the most important buttons (forward button can auto-hide to save space). Other buttons, like bookmark, reader mode, extension buttons are hidden under a menu button.

I was also thinking about possibility that the tab bar could be customizable just as the lower toolbar (like moving buttons, tab strip element, etc) - that would be beyond awesome - users could put some additional buttons that they need there. Near app menu button, for example.

Tabs can use the second level label to show a hint on how to open the addressbar: shown always on active new tabs and on hover for tabs that aren't new. If user double-clicks the active tab (or once-clicks, based on config setting, I just see that users can click it to focus on the window, and not expect to see something else happening) the address bar shows on top of the tab-strip. Tabs are visible underneath it, but semi-transparent - as a hint to user that they can close the address bar by clicking back on the tabs:

steel835_2-1650669804615.png

What I didn't solve here are the encryption lock and tracker shield buttons - they don't belong on tabs or near them (compact mode is compact), could also end up in the app menu of course, but the lock is the important icon that shows whether the connection is safe, therefore should bring the user's attention if it's not. Maybe a small red badge with a lock/exclamation mark near tab favicon and show a warning on hover (for example in the panel with tab previews from another idea)?

What do you think?

Anonymous
Not applicable

@batata @steel835 @brochard Hi ... how are you guys? So ... This is the concept for compact bookmarks. What do you think of this idea?

FirefoxDesktopLight_Idea.png

Concept

  • Navigation is in this symbol '>'
  • By clicking on this symbol '>' - You access the input field
  • By default all Bookmark is saved automatically
  • By default you can only remove if you click on the X icon
  • If you want to call the Favorites Manager you must click the Maximize the screen icon.
  • I tried to unite these 3 concepts: "WYSIWYG- What You See Is What You Get", "KISS(Keep it Simple, Stupid)" and "Less is more".

 

The report of the design and user experience

  1. The main advantage of this Bookmark interface is minimalism and productivity.
  2. There is a view that the user does not need to fill in all the bookmark fields in the compact design as a report here.
  3. By default the 'name' field is auto filled based on the HTML metatag called 'title'
  4. And the bookmark 'tag' field is auto filled with the HTML target tag with the name attribute = "keywords" and with the content attribute
  5. The bookmark 'type' field is populated based on the link, for example if you save a bookmark with a link.mp3 this is the audio type - By default the browser interprets the links of the type: documents, video, audio or general links or links No tags or links without notes or links without keyword.
  6. The only field that the user fills if you want these fields: Color, Keyword, Collection, Note.
  7. By default these fields such as: name, tag, location, type, note that I have already said are filled automatically, what little life and user time to fill something manual.
  8. I created the color field to identify custom links, it is very common in programs like raindrop you create links with colors to identify certain links that do not have field like tag, location, type, collection, keyword.
  9. The 'collection' field serves to identify multiple determined links, would be like a folder / subfolder - the crucial difference of this I think is very important is that it works with a tag system too, but it would be close to what you use in things like Gmail
  10. One thing I thought is that you do not need a button to save Bookmarks in Mozilla Firefox, my idea would be that bookmarks would be saved automatically ... so there is no save bookmarks field.
  11. Another differential in this interface would be that you can expand the Bookmark window this basically serves for you to call the library window that has all the links you want to access.
  12. If you want to delete a link is easy, just click on the star icon and you remove or add the bookmark ... this can be as good and so easy ... in my view maybe this helps the community of Mozilla Firefox users.
  13. In total are 8 text type input fields, the fields are these: Name, Tags, Location, Type, Collection, Color, Note, Keyword. Each field explained above the proposing and because it exists. I hope to help the community of Mozilla Firefox with the compact bookmarks interface inspired by the concept of compact design.
  14. I forgot to talk about the location field, before there was a treeview - a tree list of folders where the user selects where Bookmark will be saved. I find a mistake and an error use a folder system, a tag system is much freer and better. So both the Location field and the Collection field functions as a tag system, the difference between the two Collection and Location fields, is that the Location field is for you to save the links like the Gmail Label system, where you have folders and subfolders, but this is represented as tag.
  15. Example: Let's assume you want to save a link in the following folder: Google / Link ... That would be the same as typing 'Google, Search' - Did you see the folder system like Label? This is the interesting point and my productive view of design and user experience. The concept of Gmail labels does not make it possible to have folders with the same name or better it is not possible to have labels with the same name. So the Collection type field was created that allows the user to create how many collections you want with equal or different names.

 

Notes

  1. The links I add here in the post are for bibliographic reference, I am not being paid or promoted by any company.

 

References

  1. Link ... from the graphical interface of Mozilla Firefox, where I inspired and created the Compact B...
  2. https://en.wikipedia.org/wiki/WYSIWYG
  3. https://en.wikipedia.org/wiki/KISS_principle
  4. https://www.houzz.com/magazine/less-is-more-6-principles-of-minimalist-design-stsetivw-vs~447394
  5. https://www.red-dot-design-museum.org/essen/exhibitions/detail/596/less-is-more-aspects-of-minimal-d...
  6. https://blog.alexdevero.com/less-is-more/
  7. https://designshack.net/articles/layouts/minimal-design-how-to-design-more-with-less/
  8. https://www.tutorialspoint.com/html/html_meta_tags.htm
  9. https://www.w3schools.com/tags/tag_meta.asp
  10. https://support.google.com/mail/answer/118708
  11. https://www.gmass.co/blog/gmail-labels/
  12. https://medium.com/reviewmonster/raindrop-a-beautiful-all-in-one-bookmark-manager-fcfc5783d6ed
batata
Strollin' around

To elaborate a bit more on my original idea

  • We could put the hamburger button on the left because it looks a bit weird next to the reduce button (at least on windows)
  • The same way the download icon is hidden unless we're downloading we could hide the back and forward buttons unless there's something in the history
  • The refresh and fav button could be on the tab (and visible only on hover maybe ?)
  • The many icons that can appear on the left of the address bar could be fused all together in one single tabbed panel. The displayed icon would change based on priority :
    Sans titre.png
    (btw the Extension label could be removed and only show the extension name)

Which gives an even slicker look :

99.png

waroper
New member

Whoever thought it was a good idea to REDUCE the availability of Bookmarks by making the Bookmarks pane disappear has done MORE to destroy the utility of the browser than anything else I have seen. 

If this is NOT repaired, I am switching browsers.  What a disaster!

Anonymous
Not applicable
Anonymous
Not applicable

 

idea: Firefox with Compact Design 2023

 

Group 7.pngReference

  1. https://dribbble.com/shots/5201249-Firefox-logo-concept