It's also important to contrast the information density. Both the "bad" and "good" examples are quite readable but the one on the left is going to be more useful for larger lists of things.

To be fair, the course is about designing beautiful UIs, not necessarily useful ones. Wether that is actually desirable is up to you.

When I think of a beautiful UI I think of something that's aesthetically pleasing while being highly functional and clear to read.

“Beautiful” has become a scare word for me.

It's a bad first example admittedly because it seems very aesthetic, frankly, the borders may theoretically make good UI.

Most workers today don't remember the old Windows forms: they were good UI. Just ugly.

In fact, those 'Windows Forms' were also fast - it was back in the days when almost everything was fast.

I miss those days... Everything now takes countable seconds to load or do anything... I'm running a 3090 with a decent processor, and 32GB of RAM yet even some of the simplest things take so long anymore.

I miss those ugly forms days specifically too haha I personally prefer UX over any amount of design so I remember being so disappointed when Microsoft started introducing everyone to the concept of flat layouts that don't differentiate sections and just generally don't even look conceptually usable half the time. Give me ugly fast forms over looks any day.

I think you could apply their principles to add centered grayed dividers between the lines that don't go through the entire width of each row, maybe 80% or so

This or just alternating the background of each row between light and slightly darker colors

The goal was beautiful design, not good usability.

You gotta admit that it looks good, and eye candy is usually extremely effective for user retention, even if the alternative handles better, technically.

> You gotta admit that it looks good

I don't have to, and I'm not going to because it looks like crap. Why is "Cancel" just a word instead of a button? And while "Invite" is marginally better, a rounded rectangle is not much of a button either and doesn't immediately signify "oh, I can click this".

I know some people prefer flat and featureless design (and there are jokes we could make about that), but that is very personal and tastes can vary widely.

Though in the interests of fairness I will admit that there are people who do feel that kind of thing looks good.

That problem exists in both versions though - i.e. making it more "beautiful" hasn't obviously affected the usability. But I can see at least one way in which it could - if shown on a wide screen and there were a lot of entries, matching up the "Team"/"Member" signifier with the contact name would be quite challenging. The lines in the orginal version may look a little clunky but do serve a purpose.

What would “immediately” signify the ability to be clicked?

And to whom would this sign have such a meaning?

Styling to make it look like a button which is jutting out would signify the option for interaction to anyone who's ever seen a device with physical buttons, like a keyboard, smartphone, television, remote control,...

Doesn’t this discount the nature of the medium?

The option for interaction is inherent. Everything on a screen can be clicked.

The language, iconography, and visual treatment combine to differentiate certain items and establish an expectation in the event of a click.

There already exists a convention of visual treatment to establish the appropriate expectation and differentiate items that actually do something in the event of a click on them, and it's the one specified in the comment you replied to. HTH!

To anyone?

Everyone knows how a button looks, and in case you’re sure that that is a button, I invite you to explain every flat ui to my older relatives, using only words.

I have trouble distinguishing the two as an unusable design is usually automatically worse for me but you're not wrong in making the distinction that they specified beautiful. I guess I wish people would choose functional/usable over beautiful or merge them in a way that doesn't sacrifice the one I find more important!

To be fair, I also just generally don't like the look of it without borders and stuff.

Good usability is beautiful. Valuing aesthetics over functionality is ugly.

I also honestly prefer the border example

It looks like bog standard webshit.