3 ms·

I'm sure this will be useful for someone, but from a UX perspective I have one comment about the macOS theme. HTML representations of macOS native UI elements

I'm sure this will be useful for someone, but from a UX perspective I have one comment about the macOS theme. HTML representations of macOS native UI elements have been attempted many times. I still haven't seen anyone get them just right. I think you're better off using a design which doesn't try to replicate native elements as they won't match a user's selected appearance, nor will they automatically update when macOS makes a styling change. This will probably give the user a bad impression of your app.

kitsunesoba 10y ago
Indeed. I applaud the effort, but the UI of macOS has many, many subtle details that at first glance don't have much value and end up getting discarded in imitations. Once those details are missing it becomes evident why they the original possessed them. If you're going to imitate a native style, you've gotta go whole hog and nail it down to the last idiosyncrasy or it's going to be vaguely weird/awkward.
- citrusui 10y ago
  Funny you mention that: I've always had the idea of replicating the Mac's Cocoa interface. Once you extract the System UI assets[0], you have a good reference to use. Actually using that reference to make a (web) framework is something more complicated, but I wouldn't say it's impossible. I haven't tried, mainly because I don't have enough patience, but also because I'm uncertain if it violates any copyright laws, (which it probably does.) [0]: https://github.com/alexzielenski/ThemeEngine https://github.com/alexzielenski/ThemeEngine
  - jarek-foksa 10y ago
    I was also concerned about the possible copyright claims, therefore I have encapsulated the macOS theme in a single CSS file [1] and I added a more restrictive license to it. I might remove it completely in case I receive any complains from Apple. I'm not using any assets from macOS though, everything is done with plain CSS. I'm planning to implement ElementaryOS themes [2] as a safer alternative that looks good on both macOS and Linux. [1] https://github.com/jarek-foksa/xel/blob/master/stylesheets/macos.theme.css https://github.com/jarek-foksa/xel/blob/master/stylesheets/m... [2] https://elementary.io/docs/human-interface-guidelines https://elementary.io/docs/human-interface-guidelines
drivingmenuts 10y ago
I can't look at the design of their widgets. I'm on a iPhone using Safari. It's like being in the middle of the fucking browser wars all over again. For a damn demo. Seriously?

kitsunesoba 10y ago

Indeed. I applaud the effort, but the UI of macOS has many, many subtle details that at first glance don't have much value and end up getting discarded in imitations. Once those details are missing it becomes evident why they the original possessed them. If you're going to imitate a native style, you've gotta go whole hog and nail it down to the last idiosyncrasy or it's going to be vaguely weird/awkward.

citrusui 10y ago
Funny you mention that: I've always had the idea of replicating the Mac's Cocoa interface. Once you extract the System UI assets[0], you have a good reference to use. Actually using that reference to make a (web) framework is something more complicated, but I wouldn't say it's impossible. I haven't tried, mainly because I don't have enough patience, but also because I'm uncertain if it violates any copyright laws, (which it probably does.) [0]: https://github.com/alexzielenski/ThemeEngine https://github.com/alexzielenski/ThemeEngine
- jarek-foksa 10y ago
  I was also concerned about the possible copyright claims, therefore I have encapsulated the macOS theme in a single CSS file [1] and I added a more restrictive license to it. I might remove it completely in case I receive any complains from Apple. I'm not using any assets from macOS though, everything is done with plain CSS. I'm planning to implement ElementaryOS themes [2] as a safer alternative that looks good on both macOS and Linux. [1] https://github.com/jarek-foksa/xel/blob/master/stylesheets/macos.theme.css https://github.com/jarek-foksa/xel/blob/master/stylesheets/m... [2] https://elementary.io/docs/human-interface-guidelines https://elementary.io/docs/human-interface-guidelines

drivingmenuts 10y ago

I can't look at the design of their widgets. I'm on a iPhone using Safari. It's like being in the middle of the fucking browser wars all over again. For a damn demo. Seriously?