“… That’s right- less painful for users. Products like IBM WebSphere Portal and SAP Netweaver Portal were supposed to bring much improved user interaction models to enterprise IT, but unfortunately traditional systems-focused IT departments, rather than user interaction specialists and their web brethren, did the work …”

James eludes to the crux of the problem in the above quote and Thomas Otter highlights it further in a comment saying …

I sense that most of the problems/challenges with enterprise UI are not just a tool challenge. It is a design thinking problem. Until design thinking permeates enterprise application development, UI will be a sore point.

Thomas is right, it is a design thinking problem, more precisely, the problem is that there are no design thinkers in most teams that build or customize enterprise software…. A quick search for Job posts with keywords “interaction designer SAP” and other related terms on various reputed job boards here, here, here and a few other places revealed almost no relevant results .. clearly we don’t even realize yet that we need to design the interaction a user has with the software we build .. so it should be no surprise that our business software is a pain to use.

It is easy to blame vendors like SAP and IBM in this scenario though … our company portal is a pain to use, SAP must not have done a good job building it .. this is not always the right assumption, software like SAP portal etc. are platforms that allow an extreme amount of customization and often its this team doing the customization that puts together most of what a user will experience .. believe it or not SAP portal is HTML and JavaScript in your browser … yes the same HTML and JavaScript that powers GMail, Google Reader, Apple.com or numerous other engaging experiences on the Internet that you can find listed on various web showcases like this and this.

I bet if the same people who build these experiences on the web were part of the team building and customizing your corporate portal we would not be having this conversation. Yet, I’ve been on this side of similar conversations many times before and this is right about the time where you hear the words …

“… but, I don’t need all this flashy stuff on my business app …”

Unfortunately, many business decision makers very often fail to see beyond the commercial glitz of well designed applications on the Internet and quickly dismiss or underrate the need of an Interaction designer on their team. They miss to see that Interaction design is about thinking and researching how a users interacts with your software, how he feels and how can his feelings be optimized to pleasure, comfort and satisfaction. Its not about rounded corners or gradients or “flashy” animations .. those are just some visual design tools that sometimes (not always) help enhance how a user feels when using software.

Things are changing though, as Anne points out in a comment on James’ post .. the last year or so has seen a lot of new interest in the business value of good user interfaces and James’ post mentions that companies like Deloitte and Accenture realize this value and “have built practices dedicated to using Adobe technology to make existing enterprise applications and their portal front ends less painful for users”. He goes on to quote Jaco Von Eeden from Deloitte …

“Virtually every ERP deal we see we ask where can we use Adobe. We have a reasonable revenue flow and fantastic pipeline.”

This increasing interest in the value of good user interfaces is great for the industry, but I’m not sure if the above approach that Deloitte is embracing is the right way to go .. we should not be force fitting a particular technology into a solution, but instead asking what is the best way to solve a problem and what is the best technology to build that solution.

Adobe’s technologies can be used to build some great solutions but this choice of using a particular technology should not be made by business drivers … instead, it should be based on proper understanding of what is needed. Remember, it is very easy to use these so called Rich Internet Applications technologies to build a Not So Rich Internet Application.

Generated Style

Auto-Complete

Gears is an open source project that enables more powerful web applications, by adding new features to your web browser:

• Let web applications interact naturally with your desktop
• Store data locally in a fully-searchable database
• Run JavaScript in the background to improve performance

Gears today provides some very interesting features like a WorkerPool module to run JavaScript code in the background, without blocking the main page’s script execution, a LocalServer module that allows a web application to cache and serve its HTTP resources locally without a network connection, a Database module that provides browser-local relational data storage, a Desktop module that allows you to create desktop shortcuts for your web applications and more.

There are some very interesting features in the works as well like Desktop Notifications from browser apps, Multiple file select, resuming uploads, geolocation support etc.

All the above features have the potential of drastically changing the experience users have when using applications in the browser and that excites me

Many of these features can be very useful for applications that run in other plugins like Flash Player or Silverlight Player as well… while ideally all these abilities should be available within these other plugins natively, but the world of web development isn’t that ideal, is it?. Both Flash and Silverlight have the ability to communicate with the wrapping html page and hence they could potentially use the abilities that Gears provides via the wrapper. The obvious argument against this approach though would be that your application will become dependent on the availability of two plugins in place of one and that’s a bad move. However, that does not mean you should not take advantage of Gears in your Flex/Silverlight applications, it only means that you should use Gears in a way that your app does not become dependent on it. One approach, for example, could be to expose Gears dependent functionality to a user only when Gears is available on his machine and if its not available quietly and gracefully degrade the functionality. You could check if gears is present using the following code ..
 

if (window.google && google.gears) { 
       //gears is installed
}else{
     //gears is not installed
}

I’m sure you could come up with other such approaches, so I’d love to know your suggestions.

Meanwhile, I cooked up this little example Flex app that checks to see if Gears is installed and then allows the user to place a shortcut to the app on his desktop.
 

 
Although the code is well commented and self explanatory here are a few things I would like to point out …

• I have used the ExternalInterface class to communicate with the html wapper, you can read more about how this is done here in the docs.
• The gears api is needed to communicate with Gears, you can read about using the gears api here
• The first thing you will need to do to start communicating with Gears is include the gears_init.js in the html wrapper. You can do this by downloading the file to your source folder and including the below line of code in the index.template.html file in your Flex project

<script type="text/javascript"  src="gears_init.js"></script>

• I have used Abdul’s very cool JavaScript MXML component to include all my JavaScript code in my mxml file itself.

• Check out the example application
• View Source

Known Bug

The flex app temporarily blanks out when the Gears conformation dialog appears on FireFox 3 on MacOS. I’m not sure why this happens but it seems like a bug with FireFox.

Finally, do let me know your views on using Gears to enhance applications already dependent on another plugin like Flash Player or Silverlight Player.

Update:

The above blanking out problem could be an issue with flash player as well so I have submitted the issue as a bug to bugs.adobe.com, please vote it up.

Later, I was introduced to her blog Creating Passionate Users and I was totally hooked … well technically the blog wasn’t just her’s but I was passionate about it mostly because of Kathy’s posts … her captivating style of writing and extensive knowledge on the subject was an excellent combination and the cleverly chosen supporting images were the icing. I was so passionate about her blog that every time I noticed a new post on it, I got goose bumps (Seriously !!).

About 10 months back, in early April of 2007, due to a very sad and alarming incident Kathy decided to discontinue writing her blog … I felt her pain and was very sad, I hope she has recovered from that incident and is enjoying life. I miss her blog a lot and even today I spend a good amount of time in its archives, there’s tons of knowledge in there and anyone who is in the business of creating stuff, software or otherwise, should read her articles.

Creating Passionate Users has inspired me in many ways … looking back at 2007, I realized that 2 of her posts played a very important role in my life last year. Most part of last year I was extensively involved in the Adobe Flex community in India .. the motivation of course was that I love Flex and I want the whole world to use it … the source of inspiration were two blog posts by Kathy Sierra …

Just like all Creating Passionate Users’ posts these posts also had some powerful pictures, in the below pictures Kathy explains the importance of “Being Friendly” on community sites … this is one of the key principles that Flex-India has followed over time ..

This is just one example of how much I have been inspired and influenced by Creating Passionate Users … It’s very sad that because of a few disoriented people so many young aspiring individuals like me will loose out on loads of knowledge we could have gained from Kathy’s writings. I am going to leave you all with some of my favorite posts and images from CPU … but before I do that, I would like to thank Kathy for sharing her wisdom with us and I hope that someday she would write again.

Here are a few posts from Creating passionate Users that I love …

I like the new adobe.com design as well but ….. “Adobe, what’s with the left align? Why is your search box so important and needs to be the only thing to the right?” … please center align the site, it will look and feel a lot better.

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.

2. 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.

1. Usability issues that are still major problems today
2. Usability issues that are less important due to improvements in technology



3. Usability issues that are less important because users have adapted to the web
4. Usability issues that are less important because designers have learned restraint

Jeff’s article and its comments, as always, were an interesting read, but what i was more interested in was finding out if with the advent of Flex, Mr.Nielsen’s views about Flash and its usability had changed now …. well apparently not so much … “Adobe Flash content” has got 2 skulls (quite severe) but he does seems to have swayed a little from his 7 year old view of Flash: 99% Bad and thinks that the problem with Flash’s usability has improved a little because of the evolution of technology.

With all due respect to Jacob Nielsen and his work I do not understand how he has generalized his comments about Flash over the years and targeted the technology instead of blaming people responsible for miss use. C++ can be used to make both excellent software and computer viruses.. we don’t say C++ is bad.. we say viruses and the people who make them are bad. Similarly, Flash can be used to make both excellent software and annoying adds … how can you give 2 skulls to “Adobe Flash content”?

The generalization may have been justified to some extent in the year 2000 when Flash was used mostly to make banner adds and splash screens but it is certainly not justified today when the world is seeing so many full fledged applications being made in Flash using Flex. I am listing just a few Flex applications here and then i ask you Mr.Nielson what do you think of the usability of Flash today?

• Picnik
• Yahoo Maps
• InteliSea
• JamJar
• Amgen Tour Tracker
• Scrapblog

P.S: Mr.Nielsen would probably not be listening, so i’d appreciate everyone else’s comments as well