UI Components in CS3

May 12, 2007

CS3I was at the Adobe Creative Suite 3 launch in Bangalore on Thursday (Yes, it took them so long). I liked the event, there was nothing extraordinary about it but it was nice …. I really liked how they had put an Indian touch to the whole event (music demos and stuff) and did not just present their International campaign, this shows they are really interested.

The Creative Suite 3 of course is just Awesome!! The demos were awe inspiring and well presented (especially the ones by Rajesh Patil) … great job guys! … One interesting thing that I noticed about these products was the intelligent use of some really innovative UI Components/Controls. Adobe has put a lot of thought/research into what the users really want and need and this effort truly deserves appreciation.

Here are a few components that stood out during the demos:

1. Multi-paste Gun: Rajesh presented the use of this in InDesign CS3 where he copied a bunch of images all at once from Bridge CS3, now inside InDesign you could see a translucent overlay of the copied stack of images right beside your mouse pointer. The overlay also displayed the number of copied images at its bottom left corner. You can now easily cycle through this stack of clipboard images right where your mouse is and paste the one you like. This seems very useful for someone who is filling in an InDesign template with images, if he has to paste say 20-30 images he no more has to go back and fourth between InDesign and Bridge.

kuler live color2. Live Color: Kuler like Live Color control that allows you to fix a harmony of colors and then cycle through the whole spectrum to find alternatives. This could be very helpful when you want to make many tones of the same design, Rajesh gave a very apt example where he showed how easy this control makes the design of a drink can that needs to have the same design but different tones of colors for different flavors. Moreover this control could be quite helpful to a designer for presenting alternatives to a client. If you select preview in this control you could see your image being updated as you cycled through the spectrum.

3. Swatch color component: This component again embodies simplicity , in Photoshop CS3 (maybe also in other CS3 products) when you select a color in a swatch there is this very small overlay that appears at the bottom of your mouse pointer that shows the color to the left and right of your selected color in the swatch and while working on some image you can easily switch to the surrounding colors in the swatch right where your mouse is without having to take the mouse all the way to the color pallet and selecting a new color. Along with saving an unnecessary trip to the pallet this control also helps by giving a visual hint to what other colors could be used.

4. Convertible List/Toolbar: This component is used throughout the suite to provide a larger workspace to the user. The toolbars and contol panels can either show just icons or icons+name or full detail. So once a user gets acquainted with the software he can easily configure his workspace to show just icons thus getting more real estate to work on … simple but brilliant. Doug McCune has already implemented this component in flex as part of the flexlib project. You can check it out here.

I would also love to see more and more such controls be developed in Flex. As stated above an open source version of the ” Convertible List/Toolbar” is already available … Kuler is developed in Flex so Live Color has also been implemented, it would be great if adobe could release the source of it though.

These were the components that I noticed during the demos on Thursday, I bet I will find many more once I get to explore CS3 myself. If you have already started using CS3 and have come across other such innovative components, please do share your opinion.

2 Responses - What do you think?

  1. [...] I asked this same question at the CS3 launch in Bangalore on Thursday but the Adobe presenters there had very little idea about what Flex is (one of them thought Flex is a server side only technology) and could not help me much. I know both Fireworks CS3 and Flash CS3 have some special support for Flex but I’m yet to explore all that. [...]

Your thoughts or questions: