Grumpy Website

nikitonsky: Apple’s HIG:

> Show one popover at a time. Displaying multiple popovers clutters the interface and causes confusion. Never show a cascade or hierarchy of popovers, in which one emerges from another. If you need to show a new popover, close the open one first.

> Use submenus sparingly. Each submenu adds complexity to the interface and hides the items it contains.

> Limit the depth and length of submenus. It can be difficult for people to reveal multiple levels of hierarchical submenus

Thanks @valery_kirichenko for the video.

#Popup #Apple #HIG #iOS #Menu #Submenu

nikitonsky: ChatGPT innovating in UI again. Why is one account displayed as two elements in a dropdown menu?

#Dropdown #Account #Menu #ChatGPT #OpenAI

nikitonsky: Interesting that the biggest, most contrast button on this page is not the primary button. The primary button (!) is this construct in the middle that looks like a text input.

Thanks Alex Shoykhet for the picture

#Affordance #Hierarchy #Verizon

nikitonsky: Okay here’s the thing that worries me about animating hovers.

On the left, when you move your mouse, the element under it reacts. It’s a menu item saying “Hey, I see your cursor, I am ready!”

On the right, it feels like hover is attached to your mouse, and you move it over menu items. Basically it’s just a larger cursor.

I vastly prefer the version on the left. I think the right is incorrect, confusing, and doesn’t do what it’s supposed to: indicate the element’s interactivity.

Video source: x.com/micka_design/status/2097683693494280270

#Hover

nikitonsky: Very strange pattern from Github. To rename a repo, you need to click the same button TWICE. First click runs name conflict check, and then the same button in the very same place with the same label starts behaving differently and becomes the actual rename. I only figured it out because I thought I misclicked the first time.

#Github #Button

nikitonsky: The Russian navigation app 2GIS shows an ad for a place... in a completely different location. You’d think this “8 Марта” place is right here, but it’s actually on the opposite side of the city. What you see is just a banner ad.

Thanks @khambogrus for the picture

#Cartography #Navigation #Map #GPS #2GIS #Ad #Banner

nikitonsky: This Google Translate icon is actually a toggle, but it indicates its status with two very close shades of grey, AND its hover state is the same for both states. Good luck if you actually try to use it.

#GoogleTranslate #Toggle #Hover

nikitonsky: The “Apply” button goes into “...” menu? One of the two buttons you actually need on this screen???

Thanks Robert for the video.

#Apple #iOS #Screenshot #Crop #Menu

nikitonsky: An Italian energy company puts a black overlay over their website and claims to be “saving energy” this way.

Thanks @FaviFake for the picture

#Overlay #Energy #Bullshit

nikitonsky: See a mute button? Would be a shame if you move your cursor to press it and something else appears in its place

#Hover #Button #Coub

nikitonsky: The only option I understand is Weekly.

#LinkedIn #Notifications #Writing #Radiobuttons

nikitonsky: Telegram invention I haven’t seen anywhere else: right click on a button. Totally undiscoverable, but when you know about it, it’s kinda okay. You don’t use these options often

#Telegram #Button #Dropdown

nikitonsky: Don’t move buttons from under the mouse.

Thanks @The2lb3oz4dr10grOfHedgehogs for the video

#Popup #Calendar #Stability

nikitonsky: This ChatGPT UI (left) rubs me the wrong way. It looks like we are editing a field called ‘High’ (hello) and its leftmost value is ‘Advanced >’.

Right is my attempt to fix it.

#ChatGPT #OpenAI #Slider #Labels

nikitonsky: I am always afraid this will happen.

Thanks @FaviFake for the video

#OTP #Paste

nikitonsky: A modal dialog without close or cancel button. Clicking outside doesn’t close it either.

#macOS #DiskUtility #modal #dialog

nikitonsky: Leave it to Google to make a “Copy to clipboard” button that

- Takes a non-zero amount of time to complete

- Shows a spinner

- Might fail

Thanks @grishka for the video

#Google #Clipboard #Spinner