Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Updated icon for ActionHover on MacOS #3239

Merged
merged 11 commits into from Jun 18, 2022
Merged

Conversation

GaryElshaw
Copy link
Contributor

@GaryElshaw GaryElshaw commented Jun 9, 2022

A secondary change to, arguably, make the MacOS iconography more in keeping with the modern MacOS environment, and to make it clear that we're differentiating a menu item from a button.

Complementary to #3178, they both signify to the user that additional options are available to the user from a menu. Unlike the global speed changes in #3178, this is for adjusting individual torrent speeds using an Apple SF Symbols icon (chevron.down.circle.fill).

SCR-20220614-scb

SCR-20220614-sby

@ckerr ckerr added enhancement scope:mac needs UI review This PRs has UI changes that need review labels Jun 9, 2022
@Coeur
Copy link
Collaborator

Coeur commented Jun 9, 2022

I'm not in favour of this iconographic change. A checkmark is for a "success/done".
I'm happy with the present settings wheel.
[edit]
My comment was written when the proposed icon was different. Now it looks reasonable.
[edit]
OK, now it looks not good anymore. And I can't keep track of the changes.

@GaryElshaw
Copy link
Contributor Author

GaryElshaw commented Jun 9, 2022

I'm not in favour of this iconographic change. A checkmark is for a "success/done". I'm happy with the present settings wheel.

If you look closer, it's a chevron, not a tick. I'm looking at other colours right now, this doesn't have the right appearance.

ActionHover-circle

Same as the MacOS desktop grouping feature.

SCR-20220609-op4

@GaryElshaw
Copy link
Contributor Author

GaryElshaw commented Jun 9, 2022

Okay, as unsubtle as it is, i'm happy with this.

SCR-20220609-qqx

SCR-20220609-qqn

Previous subtle iteration:

SCR-20220609-pug

@RobFog
Copy link
Contributor

RobFog commented Jun 9, 2022

The black on blue thing is pretty ugly. I'd prefer the "subtle iteration".

@GaryElshaw
Copy link
Contributor Author

The black on blue thing is pretty ugly. I'd prefer the "subtle iteration".

Me too.

@GaryElshaw
Copy link
Contributor Author

GaryElshaw commented Jun 9, 2022

I'm sorry I couldn't contain myself. This icon looks very ugly. In modern macOS, everything is rounded or round at the moment. Either leave the old one or the round one.

Example: 172763013-502e32c7-b693-4c4d-85e6-7fc644df5b04

I did try that Oleg, but because the positioning is so janky, at least with the rectangle it looks a little better in its alignment.

If @sweetppro can figure out how to recentre the image, i'm happy to remake it. Pretty sure it's coded on L 472 of TorrentCell.mm.

@GaryElshaw
Copy link
Contributor Author

GaryElshaw commented Jun 9, 2022

Thanks Oleg, i really like this!

SCR-20220610-go

@GaryElshaw
Copy link
Contributor Author

Crap. None of the light icons work on white-background file-only torrents.

SCR-20220610-1tt

@GaryElshaw
Copy link
Contributor Author

GaryElshaw commented Jun 9, 2022

@GaryElshaw Black_Сhevron ?

I don't think so, unfortunately. It's going to have to be something more drastic :-(

?

SCR-20220610-39y

SCR-20220610-39q

It's such a small area to work in.

@GaryElshaw
Copy link
Contributor Author

Thoughts?

SCR-20220610-3xr
SCR-20220610-3xj

@GaryElshaw
Copy link
Contributor Author

GaryElshaw commented Jun 9, 2022

I'm happy.

SCR-20220610-4t4
SCR-20220610-4n5
SCR-20220610-4my
SCR-20220610-4mr

Copy link
Collaborator

@sweetppro sweetppro left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Does this need shadow?
There’s no shadows anywhere else in the UI

@GaryElshaw
Copy link
Contributor Author

Does this need shadow? There’s no shadows anywhere else in the UI

Possibly not, but have a look at the top, i just updated the images. Let me know whether you think it's an improvement or not.

@sweetppro
Copy link
Collaborator

The shadow is clipped in your image. Personally I think it’s unneeded, and goes against Apples HIG

@GaryElshaw
Copy link
Contributor Author

The shadow is clipped in your image. Personally I think it’s unneeded, and goes against Apples HIG

I'll revert.

@sweetppro
Copy link
Collaborator

Look here for inspiration, semi transparent grey with white icon
https://developer.apple.com/design/human-interface-guidelines/components/selection-and-input/color-wells

@GaryElshaw
Copy link
Contributor Author

GaryElshaw commented Jun 9, 2022

That's great, but i can equally see how it could be abused from overuse.

Back when i was teaching myself html. The camera image is a rollover, i saw a lot of abuse of that effect during those years. https://web.archive.org/web/20010202065800/http://elshaw.tripod.com/

@sweetppro
Copy link
Collaborator

here you go:
chevron down circle fill@2x
chevron down circle fill

@GaryElshaw
Copy link
Contributor Author

Thank you, but i feel a bit overwhelmed with all of the grey at the moment. Something sharper feels more appropriate somehow. Probably a personal thing on my part.

@sweetppro
Copy link
Collaborator

Thank you, but i feel a bit overwhelmed with all of the grey at the moment. Something sharper feels more appropriate somehow. Probably a personal thing on my part.

it matches the one it is replacing....

@GaryElshaw
Copy link
Contributor Author

I know, but i don't think moving away is a necessarily bad thing.

@Coeur
Copy link
Collaborator

Coeur commented Jun 10, 2022

  • I like the present grey gear
  • I like the suggested grey inverted chevron
  • I like the suggested white inverted chevron
  • I like the suggested blue inverted chevron

So don't ask me which one is best. 😸

@GaryElshaw
Copy link
Contributor Author

Ha! Well at least one of us is easy to please :-)

@GaryElshaw
Copy link
Contributor Author

I like the simple white one, obviously. Especially if it was centred for directories/folders 👎🏼

@Coeur
Copy link
Collaborator

Coeur commented Jun 10, 2022

Just a theory, but I imagine that Apple adopted a lot of greyish icons to be friendly with colour-blind people? If that's the case, we better stay away from the blue one.

@GaryElshaw GaryElshaw changed the title Updated icon for ActionHover Updated icon for ActionHover on MacOS Jun 11, 2022
Copy link
Collaborator

@sweetppro sweetppro left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this icon has weird border artefacts on the arrows, is that intentional?

@GaryElshaw
Copy link
Contributor Author

GaryElshaw commented Jun 12, 2022

@ckerr Approved! ^

@GaryElshaw GaryElshaw removed the needs UI review This PRs has UI changes that need review label Jun 13, 2022
@nevack
Copy link
Member

nevack commented Jun 13, 2022

Honestly I couldn't figure out action just by looking at this icon.
Are there any other ideas?
Maybe UX itself needs tweaking here?

@GaryElshaw
Copy link
Contributor Author

I thought based on #3239 (comment) there was still pending discussion?

I am purposely overlooking that comment. No malice at all, but without a number of other changes within what needs to be coded, there is not a lot of choice on this matter. The icon is literally the basis of the Transmission icon - up and down, for a function that controls the bandwidth for individual torrents - up and down.

@GaryElshaw
Copy link
Contributor Author

GaryElshaw commented Jun 14, 2022

I am and have been open to suggestions. As stated at the top, the current icon indicates, generally, preference changes. This PR is trying to indicate that specific per torrent bandwidth changes are available for torrents uploading or downloading. Its aim is a greater level of specificity than the generic 'preferences' icon.

What should be there, Oleg?

@GaryElshaw
Copy link
Contributor Author

The inverted chevron is absolutely fine by me, it indicates a menu.

@GaryElshaw
Copy link
Contributor Author

GaryElshaw commented Jun 14, 2022

That was the original plan, but the target area is so small...ugh. The lack of centre bothers me, but in the interim it is better.

Apologies, what macOS version are you using?

@GaryElshaw
Copy link
Contributor Author

GaryElshaw commented Jun 14, 2022

E hoa, I am completely unwilling to put the gear back in, it is entirely inappropriate for this function. It is a menu option, it's not a button, and if it were, it does not change a global preference.

PS. There are only two shoes in the world: Doc Marten 8-ups, and John Fluevog Derby Swirls.

@ckerr
Copy link
Member

ckerr commented Jun 14, 2022

Is there consensus on this PR now? It looks like @sweetppro and @Oleg-Chashko are in favor, and @nevack was opposed but to a previous design.

@ckerr
Copy link
Member

ckerr commented Jun 15, 2022

[ ? ] -> ckerr, nevack, RobFog.

As per this discussion I don't really have opinions on the macOS UI on its own & would rather get consensus from actual macOS app contributors / users and then merge or decline PRs based on that consensus. 🙂 I'd mostly only vote on UI changes if they have other factors, e.g. if they fix a bug / improve a feature / increase maintainability.

From @Oleg-Chashko's summary it sounds like people mostly approve of this iteration or have disapproved of a previous iteration and/or are silent. Since we're a group of people online in different timezones, let's emoji-vote. It's easy and I've found it to work very well on other projects, and I think it could work well for our group here.

How it works: add a reaction to this comment:

👍 PR should be merged as-is
👀 I haven't tried this yet but will do so soon; please don't merge yet
😕 More discussion / more change needed
👎 PR should not be merged

In 24 hours I'll merge if there are "enough" 👍 and iff there are no 😕 👀 👎

CC @transmission/contributors

@GaryElshaw
Copy link
Contributor Author

I also don't understand the point of changing this icon at this time.

It's a tidy-up of macOS iconography for the macOS 11 - 12 age. The recent addition of the ellipsis icon in the bar at the bottom was about introducing an actual default macOS icon that Apple uses for that function; this is a similar change. The current icon does or doesn't do the following:

  1. It doesn't indicate a menu option.
  2. The current icon is an outdated 'global preferences' button, and this function is not a button feature.
  3. The current icon is not a global 'preference' change, but an individual torrent bandwidth change using a menu, that should be indicated.

@Coeur
Copy link
Collaborator

Coeur commented Jun 16, 2022

So we all agree on the gray ellipsis? :trollface:

@GaryElshaw
Copy link
Contributor Author

Wait, what? I thought we agreed on doc.append.fill because the googly eyes were amusing?

doc-append-fill

@ckerr
Copy link
Member

ckerr commented Jun 18, 2022

I'm not sure how to handle PRs like this -- I try to not make macOS UI calls myself and try to get consensus from macOS contributors / users, but it doesn't look like anyone else has strong opinions on this PR.

I think I'll merge this one and see if anyone complains.

@ckerr ckerr merged commit 7030eb8 into transmission:main Jun 18, 2022
@GaryElshaw GaryElshaw deleted the action-hover branch June 19, 2022 04:44
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Development

Successfully merging this pull request may close these issues.

None yet

6 participants