Enterprise Web 2.0 Development: A Case for Productizing UI Using Widgets


Published on

Enterprise IT applications developed at different points in time need to undergo a Web 2.0 facelift to cater to the needs of the present day knowledge worker. This Harbinger Systems white paper describes the challenges in enterprise Web 2.0 development, proposes an approach, and illustrates its benefits with a case study.

Published in: Technology, Business
1 Like
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Enterprise Web 2.0 Development: A Case for Productizing UI Using Widgets

  1. 1. HSTW - 103 Enterprise Web 2.0 Development: A Case for Productizing UI Using Widgets A Harbinger Systems White Paper © 2009, Harbinger Systems, All Rights Reserved
  2. 2. Harbinger Systems Your partner in technology innovation About Harbinger Systems: Harbinger Systems (www.harbinger-systems.com) is a leading provider of software engineering services to some of the world's best product companies. This white paper is part of Harbinger’s Web 2.0 practice. Harbinger’s Web 2.0 practice provides software development and testing services for the rich user interface and collaboration needs of enterprise businesses and social web communities. Visit our Web 2.0 Practice page to learn more. Visit our website to download or request our white papers on leading edge technologies and trends. Contents Background 3 Challenges 3 Proposed Approach 3 Benefits 4 CASE STUDY 5 IT Department at a Large Semiconductor Manufacturer 5 Page 2 of 6 © 2009, Harbinger Systems, All Rights Reserved
  3. 3. Background Web 2.0 is gaining momentum and its bringing a paradigm shift in the way applications are being engineered and used. There is also a growing interest in tools and technologies surrounding Web 2.0. Enterprise IT applications developed by various people at different points in time also need to undergo the Web 2.0 facelift to cater to the needs of the present day knowledge worker. This white paper describes the challenges in enterprise Web 2.0 development, proposes an approach and illustrates its benefits with a case study. Challenges User Experience - What Web 2.0 features should I build and how do I make them consistent across several applications? Developer Productivity – Will it take a long time to build Web 2.0 in a large number of applications? Application Performance – My application works fine as it is, should I risk slowing it down with all the bells and whistles? Proposed Approach 1. Shortlist a select number of tools and technologies to meet your needs. Web 2.0 has a plethora of tools and technology choices, which makes it a difficult to start with. For example, you can choose to use Open Source technologies- PHP/Java, RubyOnRails, Dojo/YUI/EXT JS or proprietary solutions from Adobe- Flex, Flash, AIR or Microsoft- AJAX .NET, Silverlight, WPF. It could also be a combination of different tools and technologies depending upon the nature of the application. 2. Identify and define recurring patterns of user interactions. (Example: Data grid). For example, a Data Grid might be a very common control used to display data by variety of applications. Intelligently using tools like EXT JS, the whole experience of a data grid can be changed without much programming effort. Similarly, the search control can be standardized across certain kind of applications and made easy and intuitive by making it AJAX enabled (Google search) 3. Identify and define caching strategies, asynchronous communication options, and personalization options around interactions/widgets. For example, combination of server-side (application, disk, and database) and client-side (browser, toolbars) caching during widget/interaction design can go a long way in improving performance and user experience. Similarly use of asynchronous communication for fetching large chunks of data, with intermediate updates to the user can also be very valuable and time-saving. Also, intelligent use of personalization can help application respond to the user requirements in a more productive fashion. 4. Build widgets by coding generic behaviors against events. An event driven model allows widgets to respond immediately without user intervention, which is very much the need of the hour. Page 3 of 6 © 2009, Harbinger Systems, All Rights Reserved
  4. 4. 5. Prototype for one or two applications by doing application-specific customizations. It goes without saying that this is most easy and intuitive roadmap towards Web 2.0. You may throw in a poll to get some user feedback on new features. 6. Collect Feedback from user community. 7. Release to developers for wider adoption. Though the Web 2.0 world is primarily driven by the needs of the user, it’s also important to standardize and keep the code easy to maintain and extend. Involve developers to validate this aspect before applying Web 2.0 more widely. Benefits BENEFIT 1: BETTER / CONSISTENCY USER EXPERIENCE AND PERFORMANCE The transformation of traditional applications by using event-driven and rich widgets will definitely provide a better user experience to the knowledge worker. The productization of UI will also ensure a higher degree of consistency across applications. In addition, the caching strategies, asynchronous communication techniques and intelligent personalization options will provide an improved performance. BENEFIT 2: SINGLE PLATFORM, BETTER REUSE Potentially every application within an enterprise requires some Web 2.0 feature to be developed or integrated with. Also there are certain features that may not be applicable to certain enterprises. For example, blogging may not be permitted as per the corporate policy. Secondly, many applications require to share or mash-up content from similar sources. Context and presentation might change from application to application. Considering these factors, it is beneficial to create a widget-driven strategy leading towards productization of UI and therefore applicable to all applications within the context of an enterprise. In the long run, this will facilitate maximum re-use of features and resources. BENEFIT 3: CENTRALIZED DEVELOPMENT, EASE OF MAINTENANCE Productization will also help in centrally controlling the development efforts of the Web 2.0 features across all applications. It would be easier to create a group that is separate and only focused on Web 2.0 development. In addition to centralized control this is will also facilitate a higher-degree of specialization in Web 2.0 applications. Page 4 of 6 © 2009, Harbinger Systems, All Rights Reserved
  5. 5. CASE STUDY IT Department at a Large Semiconductor Manufacturer The IT Department at a large semiconductor manufacturer in Silicon Valley needs to support rapidly growing information needs of its functional and top management, as the company marches along a scorching growth path. The current information systems do not use a BI platform; however, they draw upon a large amount of historical and current data to provide interesting information to support decisions, through custom applications developed in-house. Since these applications have been developed over a period of time, and using a variety of programming tools and styles, they lack a consistent look, as well as they fall short of providing easy drilldown capabilities in the user interface. A genealogy application was selected as being representative of the need for improved Web 2.0 like user interface for benchmark purposes. As another alternative, a part of worldwide inventory application was also selected. The selection was deliberate: both applications use the same database to answer queries like – location, details, availability and tracking of parts used in the chip assembly process. On careful scrutiny of available tools and technologies, the following were short-listed, based on their suitability to the applications at hand: J2EE on the server-side, EXT JS and Flash on client-side. Java was selected as the server side technology to ensure compatibility with existing applications and facilitate integration with open source reporting add-ons like JasperReports and JPivot. EXT JS was chosen as the client side technology considering the number of rich controls like- drill down grids, sliders, panels, tabs and cross browser compatibility. Toward a proof-of-concept, we created a single interface comprising of the following widgets: navigation panel, search panel (basic, advanced and recent tabs), drill down data grid, customizable help, feedback/poll panel and an RSS feed panel. Next, we customized these widgets to selectively expose methods and properties that are useful to the customer’s business. For example: a “save recent search” widget exposed server-side and client-side properties in such a fashion that it allowed the application invoking this widget to store data in a standard format, and later display it based on search scope and other attribute. This widget would later be used by the genealogy application as well as the inventory application. Similar approach was used to build polls, news-feeds, grids and other common recurring interaction patterns. Finally we turned the widgets loose on developers who threw the code together. Page 5 of 6 © 2009, Harbinger Systems, All Rights Reserved
  6. 6. Initial results of this approach at this company are very promising. Not only did the first two applications roll out with a consistent user experience, they also have got good visibility with top management due to their rich user interface and visual drill down capabilities. The IT organization has expressed its appreciation and has committed itself to extend this approach to other applications in business intelligence domain. Page 6 of 6 © 2009, Harbinger Systems, All Rights Reserved