[apankrat]

I make a boring Windows software that uses this sort of juicing in its UI.

Had some doubts if it would go well with, you know, your good old sysadmin types, but it did! A bit of embellishment that doesn't deviate too far from the native look and feel goes a long way. As per some guy here on HN - "delight your users" and all that.

Examples of what I'm referring to - https://bvckup2.com/wip/r82-preferences.gif, https://bvckup2.com/wip/r82-backup-settings.gif, https://bvckup2.com/wip/r82-rabbit-hole.gif, https://bvckup2.com/wip/r82-backup-verification-dialog-r2.gi...

[Dalewyn]

>https://bvckup2.com/wip/r82-preferences.gif

>https://bvckup2.com/wip/r82-backup-settings.gif

>https://bvckup2.com/wip/r82-backup-verification-dialog-r2.gi...

UI elements jumping and moving around like that are absolute hell for usability. It denies muscle memory, demands eye tracking (and good eyesight and situational awareness in general), and keeps users on edge because things keep changing.

>https://bvckup2.com/wip/r82-rabbit-hole.gif

I'm failing to see the point of that dropdown (well, dropup) menu. The space is there from the beginning, but as unused and wasted whitespace. Why the unnecessary button and associated UI movements?

Also, why is that button called pi?

[apankrat]

Yes, hell, hell, I'll tell 'ya! Especially horrible the muscle memory aspect for the UI parts that are accessed once a year, if ever. And don't get me started on the situational awareness. Needing to pay attention to the contents of the screen? What an unrealistic burden.

Seriously though, feel free to offer your version of the same that would cleanly separate secondary options and sub-options so not to overwhelm the user with a laundry list of settings.

> I'm failing to see the point of that dropdown (well, dropup) menu.

The point of all that "hell" is the layering and progressive refinement of the UI.

[jbstack]

The "once a year" point goes both ways. If it's only going to be used once a year, then "juicing" (in the sense that the original article meant) is only going to give very negligible added value whichever way you look at it. The original example (mushrooms in Mario) is effective because of the frequency of the event which triggers it. If the player only heard the sound once per year, it would be irrelevant.

On the other hand, if we're talking about parts of the UI which will see regular use then I agree with the other comments about usability reduction, while also acknowledging that there are other opinions out there. The best approach with these sorts of controversial features (i.e. those which some users love and others hate) is to offer a toggle in the options with a default aimed at the non-power user.

[mananaysiempre]

> If it's only going to be used once a year, then "juicing" (in the sense that the original article meant) is only going to give very negligible added value whichever way you look at it.

Meh. The animations juice, maybe. The slightly non-standard UI, though, is probably worth it if it avoids the nested-modal-dialog hell the stock Windows UI is prone to having. Installed mouse and audio drivers on NT 4 recently and, well, I’m glad I forgot how bad it was. Making settings non-awful is important even if you only visit them once.

What’s the upside for the user of a nested sequence of modal dialogs anyway? Though I understand the technical convenience given how limited the bare Win32 toolkit is. And there definitely is a downside for the user: I can’t say how many times I’ve seen relatively sophisticated users fruitlessly smash the OK button on the wrong (not top-level) dialog, because they all look the same. (This is perhaps salvageable by more prominently shading disabled windows—something Win95 admittedly could not afford on contemporary hardware—instead of blinking the title bar, but is it worth it?)

[apankrat]

> What’s the upside for the user of a nested sequence of modal dialogs anyway?

That's it. Allowing changing things in place is exactly one of the goals.

[Rychard]

What you've basically said is "I don't agree with your opinion, therefore you are wrong". While you may have provided justifications for your beliefs, your delivery was unnecessarily aggressive and only served to further alienate yourself from the discussion. I would encourage you to try and engage in more constructive conversation in the future.

For what it's worth, I also despise this sort of needless UI fluff for essentially the same reason they do; it reduces usability.

But that's just like, my opinion, man.

[apankrat]

The GP made generic dismissive remarks on a spherical cow in vacuum and under a blanket assumption that the other person is an idiot.

That's not how one starts a "constructive conversation".

But, yeah, that's just like my opinion too, man.

[Dalewyn]

>The GP made generic dismissive remarks on a spherical cow in vacuum and under a blanket assumption that the other person is an idiot.

I neither made "generic dismissive remarks" nor assumed you're "an idiot", but hey: If you want me to flame you to high heaven I can certainly oblige.

If you can't take constructive criticism, publishing stuff is probably not your alley.

[MrGilbert]

Tbf, the initial comment already set the direction ("absolute hell"?). It provides mere rambling and no real benefit to the OP.

Not that I encourage the tone in this thread, but... There is another perspective to it.

[Dalewyn]

I did specify why it's "absolute hell": The UI moves. UI elements that move around are bad for usability because of factors I already mentioned.

The best UIs are those that keep movements and other dynamic facets to the absolute minimum. A boring UI is a good UI.

[1-more]

> UI elements that move around are bad for usability

Bit of a broad brush here. When the "next ->" button moves around of its own accord (in response to changing text content, say) and you need to click it to page through 10 screens of text, that's for sure bad. When elements move in response to a toggle the user clicked when they are nowhere close to the elements that move that's really not a big deal in my opinion. This is especially not-bad when the toggle will move everything back without the user moving their cursor.

[carlosjobim]

This is not stuff you'll be clicking every day. The desktop has always been interactive, with windows and dialogs popping up and disappearing etc.

[Dalewyn]

>Needing to pay attention to the contents of the screen? What an unrealistic burden.

I know far too many people (read: common users) who quickly lose track of what's going on if their program keeps changing things. Hell, I find most people still can't keep track of tabs in a web browser (because each tab overwrites most of the window), let alone your stuff.

>feel free to offer your version of the same that would cleanly separate secondary options and sub-options so not to overwhelm the user with a laundry list of settings.

A singular, global button or toggle somewhere that permanently keeps the UI in either Simple or Advanced modes? Almost nobody needs to flick between the two back and forth. Common users only care for what will get their work done, power users always want (and can deal with) all the details.

>The point of all that "hell" is the layering and progressive refinement of the UI.

What you call "layering and progressive refinement" I call an unnecessary click and movement of UI elements that don't have to exist. The former is a waste of time, and the latter is a waste of screen real estate.

[martyvis]

Very frustrating for older people when web sites become adventure games with hidden doors and changing maps

[themeiguoren]

For the first link I think it’s pretty bad as-is, but would be much better if you distinguished the new “more” items in some way. Eg different colored text (and make the “more” button match that formatting). That way you don’t need to re-scan every single option to find what’s changed, and keeps the visual shape of the sections of existing text there. I am also baffled by the menu hiding. But I think the other two examples are pretty nice.

[martyvis]

My 89 year old mother-in-law doesn't have great vision but also poor situational awareness around web sites for government and financial services. For someone that is used to paper forms, it is extremely difficult to navigate your way around these places. Not intuitively knowing that a "profile" section will be somewhere to adjust account information, or when autocomplete and drop down menus make things jump around makes many of these experiences exhausting and frustrating (and even dangerous)

[crummy]

These sort of over the top animations can also help folks like that, like how you see minimized windows shrink into the dock on a Mac, as opposed to just disappearing on Windows.

[nailer]

> Also, why is that button called pi?

The pi permits access to a commonly used computer security system called "Gatekeeper" sold by Gregg Microsystems, a software company led by CEO Jeff Gregg.

Gregg is connected to with the "Praetorians", a notorious group of cyberterrorists linked to recent computer failures around the country.

Once the Praetorians sabotage an organization's computer system, Gregg sells Gatekeeper to it and gains unlimited access through the backdoor.

https://youtu.be/pXPXMxsXT28?t=14

[nvrspyx]

I really like the animations. Well done.

> https://bvckup2.com/wip/r82-rabbit-hole.gif

This one does confuse me though. Why not have the sidebar display permanently instead of hiding it within a drop-down? There already appears to be white space and a column header ("More options...") dedicated to it already. Also, why is the button label pi? It's all just really confusing and feels unintuitive. I imagine some thought went into it though, so I'm curious as to the reasoning behind it.

Other than that one particular case, I like what you've done with the rest.

[apankrat]

The sidebar is an index of several additional option pages, shown to the right of it. The first one is "Common" and it is shown by default.

This design didn't actually make it into the production release, it was replaced with https://bvckup2.com/wip/r82-rabbit-hole-x.gif.

Pi is a reference to a (really corny) "hacker" movie from the 90s called The Net. Same thing as the Pi at the bottom right of every page on Reddit.

[nvrspyx]

The replacement makes much more sense to me. Thank you for the explanation.

> Same thing as the Pi at the bottom right of every page on Reddit

I'm always on Reddit and never noticed the Pi. Thanks for the trivia as well!

[MattRix]

These are nice! I’d recommend making the animations even faster. You only need a couple frames of animation to give the feeling of moment, otherwise the UI starts to feel sluggish.

[Kwpolska]

> https://bvckup2.com/wip/r82-preferences.gif

This seems pointless to me. The "More…" button adds three options and some help buttons. Wouldn’t it be less confusing to just have the options on the screen at all times?

> https://bvckup2.com/wip/r82-backup-settings.gif

Wouldn’t it be easier (and faster) to just show a modal dialog box? Or instead of shuffling items around, expand the window to fit the options?

[emptysea]

These are great! how tricky is it to add these effects? I’m mostly stuck in the html/css/js world and implementing anything like you have here would be a pain

[apankrat]

All of them are using a custom framework.

Most transitions are trivial to implement - you have a state A of your dialog that looks like this and a start B with your target look/layout - so the framework figures out what needs to move where, what needs to be hidden/shown and then animates that in a quick loop.

The complicated part is the fading of controls. There's no fine-grained control over when Windows repaints controls exactly, so unpainted parts of the background showing through is a nasty issue. Requires basically per-Windows version voodoo, because what works for W8, doesn't work for W10 and vice versa.

[efields]

This is pretty standard stuff for your stack. Mostly can be done with CSS these days.

[JusticeJuice]

Hey! I've been following Bvckup2 for years, not because I need it but becuase I've always loved the UI - big fan!

[karlshea]

I've been using Bvckup2 on my PC forever and it's been amazing, thanks for all of your work on it!

[sergiotapia]

Really tasteful animations. They allow me to see what changes when I do something, infinitely better than just popping things in and out of existence. Thanks for sharing examples.

[inatreecrown2]

your animations look very smooth!

[sdwr]

That's hot! Well done!

[mromanuk]

fantastic job! love how the animations, adds a nice touch to the UX.