PDA

View Full Version : A really cool UI - Nitobi



Bobafart
5 Feb 2007, 12:16 PM
I figure this is the best place to post this since it pertains to development

I got accepted into the alpha test for Nitobi - some guys from British Columbia, Canada are creating this UI package. It looks pretty sweet -- dare I say as professional as Jack's stuff. Mind you, they will be charging for their package when it is complete, but right now the code is all free if you alpha/beta test it.

http://www.nitobi.com/

I threw up some samples.. the best fisheye I have seen to date!

http://www.gabbr.com/sandbox/nitobi/fisheye/samples/basic/

hunkybill
5 Feb 2007, 1:49 PM
wow. neat. Now if I could only get all that eye candy widget code pointed at some quality application code. Nothing like easy eye candy pointing to a stub for 10, 20 or even 100 thousand lines of code. I guess it's just me but that Apple dock thingy never turned my crank. Makes me dizzy... :)

brian.moeskau
5 Feb 2007, 11:18 PM
Not to knock Nitobi specifically, as Dojo has the same issues, but I think whoever is implementing these fisheye widgets has never actually used the Max OSX dockbar (which is what I'm assuming they are trying to replicate). The js fisheyes are jumpy and the behavior is not consistent with what's expected when you mouse up and down over an item. Besides, has anyone ever actually used one in a real app?

Animal
6 Feb 2007, 12:12 AM
That Dojo fisheye thing???? No, and I wouldn't. It's just clever code for the sake of it. Waste of screen real estate, CPU cycles and bandwidth!

Oh and Bob. Your page does absolutely nothing in Firefox. A few grey lines on the screen, and that's it. Some libraries are not cross-browser. Dojo seems to be orientated to IE.

Animal
6 Feb 2007, 12:18 AM
And in IE, your page throws some script errors, then displays two grey bars, which, when you move the mouse over them, expand and contract in a very disconcerting way while tooltips fly round above in an unreadable manner.

Someone has too much time on their hands...

manugoel2003
6 Feb 2007, 2:14 AM
I dont find it that cool actually.... the interface is an eyesore on win2k - FF2, maybe its better on winxp.... moreover the live-scrolling thing is too slow and makes my P4 machine feel like a P1.... btw Jack, how abt implementing the live-scrolling thing in Ext grid??

lstroud
6 Feb 2007, 4:31 AM
If you didn't look at their combobox demos, they have some very cool multi column autocomplete features.

Animal, I agree on the usefulness on the fisheye, but I ran that demo in firefox earlier and it worked like a champ. Maybe they roled out a change or something, but it may be on your side too.

LES

Animal
6 Feb 2007, 5:26 AM
What, Bob's fisheye demo :?: :?: :?: Worked :?: :?: :?: :shock: :shock: :shock:

Still doesn't for me.

Bobafart
6 Feb 2007, 6:08 AM
What, Bob's fisheye demo :?: :?: :?: Worked :?: :?: :?: :shock: :shock: :shock:

Still doesn't for me.

are you referring to the link that I posted at the top of this thread?

it works for me -- 3 different computers on IE and FF (work and home)

just checked it again today and it works

I am referring to this:
http://www.gabbr.com/sandbox/nitobi/fisheye/samples/basic/

must be something on your side

I should hope it works because they guys will be charging $$$ for it! heh.

Animal
6 Feb 2007, 6:16 AM
Nope, not a sausage.

View Source gives me stuff like this



<ntb:fisheye id="myFishEye1" growpercent="200" opendirection="up" expanddirection="right" iconwidth="50">


in an HTML document :?: :?: :?:

And I'm getting a script error in the Firebug console.

Condor70
6 Feb 2007, 6:17 AM
it works for me -- 3 different computers on IE and FF (work and home)
Fails on IE6/Win2K

Condor70
6 Feb 2007, 6:35 AM
View Source gives me stuff like this



<ntb:fisheye id="myFishEye1" growpercent="200" opendirection="up" expanddirection="right" iconwidth="50">


in an HTML document :?: :?: :?:

Different namespaces are allowed in XHTML (as long as they are defined in the HTML tag).

ps. Jack also uses the namespace 'y' for QuickTips (http://www.yui-ext.com/playpen/yui-ext.0.40/docs/output/YAHOO.ext.QuickTips.html).

Bobafart
6 Feb 2007, 6:44 AM
Fails on IE6/Win2K

I guess that's why it is still alpha.

kilburn
6 Feb 2007, 1:29 PM
FF2 on OSX is working well.

Safari alerts the message "EBA XML library is not supported in your browser" but also works well.

kjordan
7 Feb 2007, 12:15 AM
Somehow I was able to break their copy and paste example by copying and pasting cells out of the middle of the row to the start of the other table row. It gives an error about too much recursion. :lol:

jason
8 Feb 2007, 1:08 PM
i gave nitobi a pretty serious review in fact wrote a review on their datagrid and as a result recieved a free developer account with them.

the one thing i didn't like was that it didn't seem as stable as yui on all browsers. in paticular safari didn't work for me at all. they seem like they are really pushing the edge and as a result the code is a bit fragile. but, the components they write have a lot of really amazing features. in particular their datagrid is incredible.

i also didn't like the namespace declaration that had to be made which made my pages not validate anymore. but i have a feeling that might have been my own lack of understand on the document type declarations and such.

but, i would say they are the one serious competition to yui at this point and it would be good to keep an eye on them.

brian.moeskau
8 Feb 2007, 1:22 PM
I don't understand why anyone would spend hundreds of dollars for a single widget when there's stuff like Ext out there. And that's without source -- the source license for their grid alone is $3k :shock:

I'm not saying that good components aren't worth money -- on the contrary, Jack should probably be charging for his stuff. Just saying that I don't quite see Nitobi's value proposition at the moment based on what they are offering, which doesn't really seem like much. Unless I'm missing something?

BTW, I wouldn't leave Dojo off the list of serious competitors to YUI/Ext either -- in fact, I'd put them at the top at the moment.

jason
8 Feb 2007, 10:56 PM
with yui-ext being free, open source and nitobi being rather costly, that is definitely a major compelling reason. for me though, i'm working with yui-ext just because i think it's just better. i have paid that much for components before - if an awesome component makes my app stand out then it's worth it to me.

another interesting one to keep an eye on is adobe spry. it's not really there yet, but i bet they'll integrate this somehow into Dreamweaver. So those of us who work with designers will probably be seeing that code headed our way if that does happen. http://labs.adobe.com/technologies/spry/

Bobafart
9 Feb 2007, 6:44 AM
with yui-ext being free, open source and nitobi being rather costly, that is definitely a major compelling reason. for me though, i'm working with yui-ext just because i think it's just better. i have paid that much for components before - if an awesome component makes my app stand out then it's worth it to me.

another interesting one to keep an eye on is adobe spry. it's not really there yet, but i bet they'll integrate this somehow into Dreamweaver. So those of us who work with designers will probably be seeing that code headed our way if that does happen. http://labs.adobe.com/technologies/spry/

Spry has been around for almost a year. And what have they done so far? They hardly update their development blog. They barely have any features

I don't understand why they continue to keep it alive when other free and newer AJAX frameworks are lightyears ahead of them in terms of features.

Also, what purpose does Adobe have with AJAX? Isn't FLEX2 supposed to do everythign AJAX does? what incentive do they have to jump into bed with AJAX only to usurp their own FLEX2?

thor
26 Feb 2007, 7:12 AM
but, does work in firefox....and looks very cool too

Thor

ludoo
23 May 2007, 11:56 AM
From the jQuery blog demo (http://jquery.com/blog/2007/05/09/fisheye-dock-menu/)::

There's a great fisheye based on jQuery :
- here is the demo (http://www.ndesign-studio.com/demo/css-dock-menu/css-dock.html#)
- and screenshot:
http://jquery.com/blog/wp-content/uploads/2007/05/css-dock-menu.jpg

It used "interface (http://interface.eyecon.ro/)", a library of widget for jQuery.

Perhaps a start of idea for a "bridge/adapter" concerning the widgets to reuse components...
even dependencies will a bigger problem

jay@moduscreate.com
25 May 2007, 12:51 PM
I don't understand why anyone would spend hundreds of dollars for a single widget when there's stuff like Ext out there. And that's without source -- the source license for their grid alone is $3k :shock:

I'm not saying that good components aren't worth money -- on the contrary, Jack should probably be charging for his stuff. Just saying that I don't quite see Nitobi's value proposition at the moment based on what they are offering, which doesn't really seem like much. Unless I'm missing something?

BTW, I wouldn't leave Dojo off the list of serious competitors to YUI/Ext either -- in fact, I'd put them at the top at the moment.


I Think they are just trying to make money off of their hard work. Certainly nothing wrong w/ that. The web is just overflowing with options. Backbase is another one of those OVERLY expensive JS Frameworks.

Options are good! Some will live and many will die. Their usage in the world is key.


Also, the spry framework has been out for a very long time now compared to many other frameworks. IT isn't going very far. Adobe is struggling with their own flex 2 which is going to be fully Open source. Flex is a great idea but a PITA to implement fully.

The fisheye effect is annoying. Not to mention the OSX DOck wanna-be's are retarded on the web.

keithpitt
26 May 2007, 1:21 AM
The fisheye effect is annoying. Not to mention the OSX DOck wanna-be's are retarded on the web.

Yeah I agree. Some things just need to stay in the OS. I cant actually think of a real world example where this sort of fish eye effect would be usefull. On that note, I think the webs implementation of the fish eye effect is still not quite right. I dont know if its just me, but when the images are shrunk, they've got that real ugly browser pixel resizing stuff on them, which kind of makes the fish eye ugly. This is one of those things that look cool and are fun to play with.

indulgence
27 May 2007, 2:03 PM
I can think of an instance to use it... when you want a quick list of single-page options / menu and want it to be naturally unobtrusive in the page... The expand on mouse-over to give greater area of effect for the event....

The lone problem... no support for SVG -- so either the small graphics look awful... or the large ones look awful... so... ya..

I wouldn't use it because of the performance problems... and come up with a normal menu instead... but if SVG were supported and animation could be smoother and less CPU intensive - it would be an option to look at.

jay@moduscreate.com
27 May 2007, 2:43 PM
I can think of an instance to use it... when you want a quick list of single-page options / menu and want it to be naturally unobtrusive in the page... The expand on mouse-over to give greater area of effect for the event....

The lone problem... no support for SVG -- so either the small graphics look awful... or the large ones look awful... so... ya..

I wouldn't use it because of the performance problems... and come up with a normal menu instead... but if SVG were supported and animation could be smoother and less CPU intensive - it would be an option to look at.

A simple mouseover color change/highlight/frame effect will work. no need for fisheye.

keithpitt
27 May 2007, 2:50 PM
Id be interested to know if anyone has actually used a fish eye in their application and how successfull it has been. Has anyone used one yet?

indulgence
27 May 2007, 4:14 PM
A simple mouseover color change/highlight/frame effect will work. no need for fisheye.

Im talking if you need to reserve a small space for the actions... icons can represent actions in a smaller space than text....

The expansion of the fisheye offering the increased action area...


Don't get me wrong -- I wouldn't use it now for the reasons I mentioned (no svg support / performance) ... but that would be one instance where the fisheye pattern would be usable. I'm not saying there aren't alternates (right now all of which are better) but if there were across the board good SVG support and animation performance boosts... then it would be just as viable an option as others.

I mean if you want to put down the fisheye for having no real web use... please enlighten me to its desktop use? I mean Apple could have done something different for their dock panel... why use fisheye? They could make all of the icons their large size... or small size... But they wanted to minimize the real-estate used for it -- and make the action area larger when its being used (by expanding the hovered size)... plus the added eye candy advantage over windows...

If there were SVG support and no performance hit -- why wouldn't it be a realistic option?

jay@moduscreate.com
28 May 2007, 5:23 AM
Im talking if you need to reserve a small space for the actions... icons can represent actions in a smaller space than text....

The expansion of the fisheye offering the increased action area...


Don't get me wrong -- I wouldn't use it now for the reasons I mentioned (no svg support / performance) ... but that would be one instance where the fisheye pattern would be usable. I'm not saying there aren't alternates (right now all of which are better) but if there were across the board good SVG support and animation performance boosts... then it would be just as viable an option as others.

I mean if you want to put down the fisheye for having no real web use... please enlighten me to its desktop use? I mean Apple could have done something different for their dock panel... why use fisheye? They could make all of the icons their large size... or small size... But they wanted to minimize the real-estate used for it -- and make the action area larger when its being used (by expanding the hovered size)... plus the added eye candy advantage over windows...

If there were SVG support and no performance hit -- why wouldn't it be a realistic option?


You're quoting something that is so minute in the world of computing. I've been working on computers for 12 years now. I have experience with OS's from DOS 3.3 -> AmigaOS/All flavors of windows/OSX/Various Linux window managers/HPUX/AIX/IBM Z/OS. The *Only* place i've seen fisheye successfully used is in the dock for OSX. That's it. Fisheye is such a nich function. It provides no real value to the web. A highlight, mouseover is FINE if you have limited real estate. The fisheye functionality is a gimick for the web and that's it.


Even today i feel that the web will NOT be a replacement for the desktop. It just won't happen. the DOM was not meant to be a gui foundation. Browsers were not meant for what we're doing with it via javascript. The is heavy, slow and irritably huge to download.

indulgence
29 May 2007, 6:17 AM
Did you read my entire post. Fisheye is a pattern that accomplishes a pretty simple task with (perhaps a bit too much) eye candy... The only reason you never saw fisheye in your first ten years is the same reason you wont see it successfully done on the web now. Poor performance and no SVG support. Your DOS 3.3 and AmigaOS surely weren't kicking around True Color SVGs i hope.

If and when browsers improve javascript performance - and widely support SVG - then you will see fisheye's be used (at least more effectively) on the browser....

Just because you haven't seen it used for 12 years doesn't mean it doesn't have a useful function. Even the OSX Dock could have been done w/o the Fisheye. If you are trying to minimize the real-estate used... a fisheye can absolutely be a pattern that solves it -- where highlighting won't do - as it doesn't minimize real estate used. Its not about the "drawing of attention" to that particular item in the fisheye -- its about minimizing space when not in use - and increasing the actionable area when it is being used.

ben.tremblay
29 May 2007, 7:00 AM
View Source gives me stuff like this

<ntb:fisheye id="myFishEye1" growpercent="200" opendirection="up" expanddirection="right" iconwidth="50">in an HTML document :?: :?: :?:This brings to mind what I found so very very remarkable about BackBase, such as this, from an example in their manual (http://www.backbase.com/#dev/bpc3/manual/applyinguserinteraction/AddingEventsAndCommands.xml[0]):

<a>
<s:event b:on="command">
<s:task b:action="alert" b:value="Hello" />
</s:event>
Click me
</a>Dunno about you but that makes me shudder.

I guess their philosophy is if you're going to put code for behaviour and actions into the HTML you might as well but in as much as suits you. *shudder*

As for the fisheye effect itself, in my years I have found a total of 1 instance where it would really be appropriate. (If someone here is working on concept mapping, please msg me!)

*Takes of his "I programmed APL on MTS" t-shirt*

jay@moduscreate.com
29 May 2007, 11:59 AM
Did you read my entire post. Fisheye is a pattern that accomplishes a pretty simple task with (perhaps a bit too much) eye candy... The only reason you never saw fisheye in your first ten years is the same reason you wont see it successfully done on the web now. Poor performance and no SVG support. Your DOS 3.3 and AmigaOS surely weren't kicking around True Color SVGs i hope.

If and when browsers improve javascript performance - and widely support SVG - then you will see fisheye's be used (at least more effectively) on the browser....

Just because you haven't seen it used for 12 years doesn't mean it doesn't have a useful function. Even the OSX Dock could have been done w/o the Fisheye. If you are trying to minimize the real-estate used... a fisheye can absolutely be a pattern that solves it -- where highlighting won't do - as it doesn't minimize real estate used. Its not about the "drawing of attention" to that particular item in the fisheye -- its about minimizing space when not in use - and increasing the actionable area when it is being used.



of course i read your entire post ;)

It's not going to happen on the web. It's not very useful. The only place it seems to work is on the dock.

Fisheye looks retarded and is crappy.
These idiots use it and it looks like .
http://www.buy.com/retail/searchresults.asp?querytype=home&qu=lcd+monitors&qxt=home&display=