Press Room

Why Web-Enabled Screens Need to Look and Function Like Standard Web Applications

Make your users more productive, reduce training costs, and provide new functionality

by Duncan Kenzie
Published: September 7th, 2010 by System iNetwork

Many IBM i shops consider implementing web-enabling solutions with the initial goals of giving their green screens a Windows look and of making them accessible in browsers. Most web-enabling solutions do provide modern looking screens that are more accepted by users, easier to access, and easier to deploy. However, these are often not strong enough reasons for you to purchase web-enabling software. To build a stronger business case, web-enabled screens need to make users more productive, reduce training costs, and provide new functionality. This means they need to look and function as much as possible like standard web applications.

Web-enabled screens should include navigation features that are consistent with native web pages like links, buttons, scrolling, and clickable subfile options, so that they are more intuitive to users. The screens need to make data entry faster with easier selection of data by using drop down lists, auto-completes, and better messaging such as hover over tool tips and instant validation. You should be able to customize the screens to match the look of your organization and to make any other UI changes such as adding tabs or modal windows. Without screens that include new functionality like images, charts, Google maps, shipment tracking and links to PDFs, some users may just want to continue using the green screen version.

If decision makers are not aware of how much screens can be transformed they may ask you, or more likely another department with web skills and possibly on another platform, to rewrite important existing green screen applications as standard web applications. If this work is done on another platform that would be an unnecessary blow to the IBM i. A rewrite is a significant investment with a high level of risk. Unless your programs are written with modular coding techniques the business logic would have to be rewritten. There are situations where the benefits of a rewrite outweigh the drawbacks but in many cases they don't.

Presto makes all these enhancements possible

With Presto, BCD's web-enabling solution, all the screen enhancements mentioned above and more are possible. As soon as you install Presto, all your IBM i screens are instantly and automatically transformed to modern looking web pages without you even having to make changes to your RPG, COBOL or DDS code. Users access the screens using a browser with no other PC software to install. Presto is a good stepping stone for RPG programmers to learn web development because you start with a fully functional application that looks good out of the box. That is all some organizations will need. For others, it's a starting point.

You can then customize your web-enabled screens at your own pace and according to your needs and skills. You only have to worry about the front end, as the back end core business logic does not change. Most of our customers further enhance their most important screens and leave the others with the default web-enabled look. This gives them a complete web-enabled solution without spending time customizing each screen.

With Presto there are three ways you can enhance screens. You can format function keys, customize cursor handling, and make other changes in Presto by changing global or screen level options. The Presto Visual Screen Editor allows you to drag, drop, and resize fields and text. You can also insert screen elements with it, such as input boxes, images, and drop down lists. The Visual Screen Editor also includes a dialogue box for you to change the properties of screen elements such as font size, color, and date formats that map to CSS attributes. You can make other enhancements by customizing the client side HTML code.

Presto gives you full access to the HTML and CSS code directly in the Presto Designer to give you maximum control over the appearance of your screens. You can also add JavaScript and use JavaScript libraries like jQuery or ExtJS to make your screens even more sophisticated. Using Ajax will further blur the lines between web-enabled screens and standard web applications by requesting information from other applications or servers to use in your web-enabled Presto screens.

Programmers who know how to create web applications in any programming language can really blow open the doors to what’s possible with Presto. For programmers who are new to web development Presto gives you immediate results and provides you with tools to get you started as well as excellent documentation, examples, and support.

Examples of enhancements you can make to your screens

The following list of examples is organized by category and is a quick way to see how you can transform your screens with Presto to look and function as close as possible to standard web applications. The list includes enhancements mentioned in this article and more, which are done using the methods and technologies described above.

Modern Looking Screens

  • Customizable skins included with Presto control the overall look of the pages including colors and images
  • Subfiles formatted as HTML tables with grid lines, headers and colors
  • Function keys displayed as links or buttons
  • Any HTML or CSS changes
  • Images
  • Tabs for breaking up a page into simpler pages
  • Modal Windows
  • Fade in and out screen elements like messages
  • Expand and collapse elements
  • Large multi-line fields replaced with textareas

Intuitive Navigation

  • Subfile options convert to clickable icons, right-click or drop down menus
  • Menus display as links, buttons or drop down lists
  • The cursor can be handled like it is on the green screen, like a web page or a combination of the two
  • Scroll through data with sliders, buttons or your mouse wheel

Faster Data Entry

  • Auto completes for faster data entry
  • Help in the form of hover over tool tips
  • Additional client or server side validation for instant feedback to the end user
  • Datepicker calendar pop ups
  • Drop down box with a list of values

New Features to your Screens

  • Images of items or people from your database files
  • Charts and graphs
  • Links to other web pages or documents including PDFs and spreadsheets
  • File uploads that allow users to browser for files, upload them and make them accessible from your web enabled screens
  • Additional information from database files that is not on the original screen
  • Web services to retrieve data from other servers or programs such as shipment tracking information.
  • Send an email with information from the screen
  • On screen keyboard for touch screens

If you're interested in learning more about Presto or in downloading a 30-day free trial please visit

Duncan Kenzie is president and CTO of BCD Technical Services