[REQ] Tighten up the popover interface

Question

[REQ] Tighten up the popover interface

Closed this issue 5 years ago · 29 comments

gingerbeardman commented 5 years ago

It feels a bit loose to me, and I think it's not needed to have the Extension name in there.

I'll make some changes soon.

Current:

otzbergnet commented 5 years ago

Thanks :)

gingerbeardman commented 5 years ago

Merged

Answer 1 · 2019-11-08T15:34:34.000Z

I am almost satisfied with this, but have not made any code changes. Thoughts appreciated.

My goal was to "simplify, simplify, simplify".

Changes:

remove extension name title
regroup tab/window
columns for checkbox/label/count & threshold
remove slider
make threshold into combo box (1,2,4,8,16,32 or edit own value)
regroup close all tabs
simplify/reduce number of words used
reorder controls in XIB

Todo:

Finalise language/wording
Set constraints (I've removed them all)

Try it: SafariExtensionViewController.xib.zip

Answer 2 · 2019-11-08T15:59:08.000Z

I think you have something here, but you might also want to consider: * If the layout is very tight in English, it likely will translate badly into other languages or require a lot of flexibility in the layout. German on average is 1/4 longer than English. * So short is great, but it can create its own challenge * If I were to look at this, I would not readily understand that the Tab and Window Count is the actual Tab and Window Count So imagine we had a clear Tab & Window Count above the settings section, then we could remove the number from the settings and have an easier to translate and understand UI. Just a thought, happy to send you my idea for such a layout later. It will add a bit of height to the window, but I think it will be able to get close

…

On Fri, Nov 8, 2019 at 4:34 PM Matt Sephton ***@***.***> wrote: I am not 100% satisfied with this yet so have not made any code changes, but thoughts appreciated. My goal was to "simplify, simplify, simplify". [image: Screen shot 2019-11-08 at 15 32 28] <https://user-images.githubusercontent.com/49612/68488473-00ecc900-023d-11ea-8105-d580c01e80d4.png> Changes: - remove extension name - regroup tab/window count/checkbox/threshold - regroup close all tabs - remove slider - simplify/reduce number of words used — You are receiving this because you commented. Reply to this email directly, view it on GitHub <#8?email_source=notifications&email_token=AKJBYPVQQ3F6WSMO63YIDV3QSWBIXA5CNFSM4JKKON4KYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEDSO4TI#issuecomment-551874125>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AKJBYPT2GHRR6SCMA5USYGTQSWBIXANCNFSM4JKKON4A> .

Answer 3 · 2019-11-08T16:05:38.000Z

Good point about making count obvious. I did have them combined earlier "Tab Count: 123" but split them. My reasoning was I wanted them to be instantly viewable when somebody does not have the badge active, a column of their own seemed the best way. But have reverted to combined for now.
Please make it fit for German. Let's decide constraints or auto layout after comparing your changes to above.
Let's iterate!

I have just changed the screen/zip above for my "final" time.

Answer 4 · 2019-11-08T16:13:23.000Z

I just realised you are replying by email so you would have only seen my first attempt and none of the many edits after that. Did you see count in it's own column?

This is my preferred design:

SafariExtensionViewController.xib.zip

Answer 5 · 2019-11-08T16:23:42.000Z

No. I’ll go online after exercise and take a peek. Sorry!

…

On 8. Nov 2019, at 17:13, Matt Sephton ***@***.***> wrote: I just realised you are replying by email so you would have only seen my first attempt and none of the many edits after that. Did you see count in it's own column? — You are receiving this because you commented. Reply to this email directly, view it on GitHub, or unsubscribe.

Answer 6 · 2019-11-08T17:07:24.000Z

Sorry for not going online first and thus critiquing without having seen everything. I get where you are coming from on your preferred design and agree that the counts are more obvious, but I still wonder, if we might be failing on glanceability.

I honestly don't have the answer here, I am just wondering. The more I look at your design the more I see its elegance, but I kind of would still want big numbers in this design. So ignore most everything in the below screenshot and just consider combining the large counts with your design.

Only other item to really consider is the "Close all tabs on". It'll be hard to squeeze a meaningful German label in there and thus I would want to propose dropping the buttons to the next line.

Answer 7 · 2019-11-08T17:33:59.000Z

I see where you are coming from. Let's go with it.

The lack of alignment is driving me crazy 😜

But commit your changes and I will adjust 👍

Answer 8 · 2019-11-08T17:35:55.000Z

Regarding close all tabs, would these make a difference to space used in German?

Close tabs, To Left, To Right

Close all tabs on, Left, Right

Answer 9 · 2019-11-08T17:37:06.000Z

I see where you are coming from. Let's go with it.

The lack of alignment is driving me crazy 😜

But commit your changes and I will adjust 👍

I will work on that, they were very quick and very dirty changes. I will use your xib and work from there ;)

Answer 10 · 2019-11-08T17:40:11.000Z

Regarding close all tabs, would these make a difference to space used in German?

Close tabs, To Left, To Right

Close all tabs on, Left, Right

German is a terrible language, as the verb would come at the end, but we can make it work. As I said, I'll start from your XIB and then you can align nicely. It also needs some additional tweaking on the code (more logic) - but we'll manage it!

Answer 11 · 2019-11-08T20:56:02.000Z

I just pushed a commit with the updated layout and associated logic. The layout is wanting of your tender-loving-care @gingerbeardman

I need to test logic fully tomorrow, I can't help but feel that I screwed up somewhere

Answer 12 · 2019-11-09T08:19:04.000Z

Yup there was one really stupid decision in there.

This case:
When the minimum tabCount wasn't met, but the windowCount was, I had previously decided to show both tabCount and windowCount to make for a nicer display. While testing it drove me bonkers, as it made no sense. I now changed it so that if both tab & window are to be shown, but tabCount isn't met, the windowCount will be shown as a superscript. that's not a great look, but it seems to make sense. The question should be, should it be superscript?

Answer 13 · 2019-11-09T13:54:19.000Z

Edit: actually I don't mind, the user should know what they have set to be counted.

Leave it as is.

Answer 14 · 2019-11-09T16:23:55.000Z

Just to confirm what will happen:

tabCount only - large number for tabCount
windowCount only - large number for windowCount
TabCount & Window Count - tabcount large, windowcount superscript, even if tabCount isn't shown due to threshold

Answer 15 · 2019-11-10T16:15:01.000Z

So, Safari presents popover at ~ 280x240 pixels wide so it can't really be as tight as I have shown.

Now I need to figure out the right way to do autolayout constraints.

Answer 16 · 2019-11-10T16:40:44.000Z

Thoughts...

disable left/right buttons if on first/last tab
why are the numbers in the combo boxes so low/near the edge? they are not in Xcode

Answer 17 · 2019-11-10T16:41:34.000Z

I like the new tighter layout:)

One question though - you declare different preferred content sizes? Shouldn't they be the same?

preferredContentSize = NSSize(width: 225, height: 283)
shared.preferredContentSize = NSSize(width:280, height:240)

Answer 18 · 2019-11-10T16:42:19.000Z

Thoughts...

disable left/right buttons if on first/last tab

why are the numbers in the combo boxes so low/near the edge? they are not in Xcode

not sure why they would be so low
I'll work on the disabling for left / right

Answer 19 · 2019-11-10T16:51:36.000Z

One question though - you declare different preferred content sizes? Shouldn't they be the same?

preferredContentSize = NSSize(width: 225, height: 283)
shared.preferredContentSize = NSSize(width:280, height:240)

You know, I am so tired I did not even see the first one that I could have just changed!

New PR incoming.

Answer 20 · 2019-11-10T16:53:54.000Z

It kind of bugs me that there are two columns of same-sized things but I will live with it for a while.

Answer 21 · 2019-11-10T18:13:14.000Z

I have just added:

disable left/right buttons if on first/last tab

Design: we can always iterate on this. I am starting to feel that we are in a decent place.

Answer 22 · 2019-11-10T18:29:57.000Z

I think I like it without the boxes. Feels less cluttered.

At this point we are down to the minor details.

Answer 23 · 2019-11-10T18:39:17.000Z

Feel free to remove them boxes...

Answer 24 · 2019-11-10T19:16:24.000Z

Will push changes soon.

Do you get that weird, pale vertical line between the checkbox and "tabs" label? in Dark mode.

Answer 25 · 2019-11-11T04:36:32.000Z

Will push changes soon.

Do you get that weird, pale vertical line between the checkbox and "tabs" label? in Dark mode.

No, I don't get that

Answer 26 · 2019-11-11T13:22:42.000Z

Good, must just be a bug in Mojave to do with running a non-retina external screen.

Answer 27 · 2019-11-11T13:24:16.000Z

My latest UI changes were a quick hack, I just made the boxes invisible. If we're cool with the new layout then they can be removed and I think we are pretty much "feature complete" for v1.0?