Thursday, August 27th, 2009

Aristo and Ace; Good looking and open?

Category: Library

We have talked about Aristo, the creative commons look and feel from 280 North and Sofa, quite a few times.

Allen Pike has posted a comparison of Aristo with the new Ace look and feel that SproutCore recently added. It is great to see great looking stuff coming from these open source JavaScript libraries!

Posted by Dion Almaer at 6:47 am

4 rating from 30 votes


Comments feed TrackBack URI

I love the description of Ace as ‘lickable’! That’s always a bonus for me!

Comment by igitur — August 27, 2009

I like the look of both, though I think Ace is nicer (even though I see many corporate environments preferring aristo).

The thing that interested me was the proposal to build a common theme for the web. That seems like a great idea. If we had a set of all-purpose themes that looked great and worked for dojo, jquery, yui, extjs, gwt, and a few others, then this would help a lot to get some consistency across the web.

On the other hand, I think the web toolkit market needs to homogenize a little bit more first. On windows and mac you have cross-app themes because the toolkits have an underlying common ground. On the web the common ground is vanishingly small.

Comment by Joeri — August 27, 2009

If controls can be styled without using JavaScript, extra markup using only CCS, i’am in.

Comment by Stakka — August 27, 2009

The look & feel is always a personal choice, but I liked Aristo better. It was more pleasing and “less” blueish than Ace. If I have a few buttons and other controls in the UI, Ace kind of turns you off (The Ace demo page with buttons, for example, is too blue to be pleasant.)

Comment by ragjunk — August 27, 2009

Gotta toot my own horn here, please excuse the narcissistic obsessions of a designer ;)

I recently designed the new Reindeer theme for Vaadin, and I’d like to feel it’s on the same level of finesse as these two look and feels.

I’ve been planning on releasing the source PSD file for Reindeer, but so far I’ve felt it’s a bit too unorganized for public scrutiny. But if just one person says they want to see it open sourced, I’m willing to share.

Comment by Jouni — August 27, 2009

“The look & feel is always a personal choice, but I liked Aristo better. It was more pleasing and “less” blueish than Ace. If I have a few buttons and other controls in the UI, Ace kind of turns you off (The Ace demo page with buttons, for example, is too blue to be pleasant.)”

I would even go so far as to say that the saturation of Ace poses a usability problem in that it obscures the non-blue elements.

Comment by eyelidlessness — August 27, 2009


There are elements of your theme that are pretty nice, but some of it is odd.

The things I really like (in no particular order):

– Focus styles on buttons (this is huge, and something most themes neglect)
– Attention to detail, particularly with the nice, crisp but light lines around input elements
– The colors by and large aren’t obnoxious
– Variety which remains mostly consistent
– The black style window is great, and I’ve long gotten over the desire for a “dark” interface, so that’s saying a lot. I would really love to replace Apple’s HUD windows with that style.

Things I’m not so fond of (also in no particular order):

– Combo inputs which have one round endcap
– A seemingly random extra round outline around arrow buttons eg to control grid headers (I hate extra lines and shapes that don’t appear to serve a purpose)
– The same goes for the “gripper” for the large split panel
– There’s something “not quite right” about the 3D quality of the buttons. I’m not sure if it’s the combination of inset/outset, or the fact that the depth perspective is off and it appears that they could just as well be input elements
– Similar feelings about the 3D quality of the first two tab bars, and additionally the use of a small padding on the left is a little odd to me (I’d sooner see them either centered or fully flush left)
– The layout of the “twin column select” is odd; the add/remove buttons are very large and in an unexpected place (I would expect them to be vertically centered).
– Lastly, there’s a ton of very similar shades of grey, and it kind of feels like noise after looking at it for a while

That said, great effort.

Comment by eyelidlessness — August 27, 2009

Both are really good.

One thing to notice is the size of both apps and the loading time.

I cleaned up my cache and loaded web inspector. The results on safari 4.0.3:
Cappucino 3.5 secs, 1334 kb loaded
Sproutcore 1.34 secs, 664 kb loaded

same test without cleaning my cache.

Cappucino 3.05 secs, 1231 kb
Sproutcore 1.0 secs, 3.58 kb

Of course the comparison is not fair because this are two different apps, and the guys at cappucino haven’t tweaked their cache rules and the files are not minified. Francisco if you read this, I would extremely recommend you to do those changes.

Comment by juanpin — August 27, 2009

@juanpin – the goal of a Cappucino app is to never refresh the page – ever. I believe the same is true for Sproutcore. Maybe I’m not as picky as you, but I think that a one time 3 second load time is not so big a deal.

Obviously, your suggestions would be a plus. Its always a good idea to fix caching and minimize, I’m just saying, this isn’t a jquery scenario.

Comment by genericallyloud — August 27, 2009

Nice themes, but if you’re gonna replace native UI controls like radiobuttons, please, please, please make them part of normal keyboard navigation.

Jouni, I actually prefer the Reindeer theme over both of the others mentioned here. Very nice work.

Comment by Menno — August 28, 2009

@Menno – SproutCore will do that. Someone has made the change; it will make it back up to the master branch soon.

Comment by charlesjolley — August 28, 2009

@Jouni: I gotta say that your theme looks very good. I want to echo and add to eyelidlessness. The overall feel is clean with one exception, you have a confusing mix of rounded and square corners.

– The one-sided round for the calendar combo is nice and I don’t think you need to make the other side rounded.
– The tabs don’t feel connected to the data they represent. Removing the padding may help. rounding the top corners will help even more.
– All of the popup windows should have rounded corners instead of just the black one.
– Since you’ve rounded the combo-box (and to great effect) mirror that with the listbox and select boxes as well.

This has the potential to compete on the Aristo/Ace level. It just needs a little refinement. These are all my personal opinion of course.

Comment by tercero12 — August 31, 2009

Leave a comment

You must be logged in to post a comment.