Using Your New Solution

An example of the new user experience

The biggest change for users of the translated system is that now the entire user interface runs in a web browser. An example is shown in the image of the Bob's Wine Bar site. The overall interace layout is:

• An expandable navigation bar on the left. This is your top-level menu.
• A title bar on the top with access to several sitewide feature controls.
• The main body uses the remaining space — this where you'll interact with most of the programs and tools on the site.

Many websites use this layout so it should be familiar.

The navigation bar is the main navigational menu for the site: it's how you "get around" to the site's various features. There are several default items, some that are results from your translation, and some that are part of your developer's customizations. The Wine Bar example has several menu items on it:

• Home gets you back to the top-level view
• Workflows expands to reveal several menu items for pages that are part of our custom workflow management toolset. Your solution may not include this item since it is a separate product.
• TWINOAK expands to reveal the "WINE" item. This item launches the "WINE" menu that was translated from our AS400 sample code. TWINOAK is the name of AS400 library that was translated to produce the site. You may have several items in place of this one if several libraries were translated.
• Reports displays the Report Browser when you can see all of your generated reports. You can launch the Report Viewer to see the report contents from inside the Report Browser.
• Explorer displays a file explorer that lets you view the list of files (reports and data files) stored in your system.
• Guestbook launches a custom application that we added to the translated site to demonstrate extensibility. You may have several items or none in place of this one depending on whether / if you have customized your solution.
• Help displays some explanatory text on how to use the interface.

The title bar is used for branding your solution, giving you context about the menu and/or program selections you have made, providing you access to some top-level features of the site. The small icons on the right side of the title bar give you access to these top-level features, which include User Settings, Log In/Out, User Feedback, and Notifications.

The main body area is the most dynamic since it's the area that your programs use for their input and output. Translated menus and forms display and accept inputs here. The Report Browser display the available reports here.

Before and After Views

This section shows how the visual experience changes when you migrate to your translated solution. The menus, reports, screens, DFUs and reports that you're used to are still available, but their appearance has changed. You can see these changes and learn more about them in the following paragraphs.

Menus

Our menu translation converts the menus defined on your AS400 into equivalent menus hosted by our SPA. The menus retain their ordering, structure, and descriptive text. You can use the settings features in our SPA to choose between a modern look (as shown), a list of launching buttons, or a green-screen emulation page that looks very much like your old screens.

The before and after view below shows the "WINE" menu from the Bob's Wine Bar site. Note that menu item numbering is that same, but the empty menu items have been collapsed to save screen real estate.

Click here to see the live, translated version of this menu.

The appearance of the original menu.

The appearance of the translated menu.

Screens

Our screen translation converts the screens defined on your AS400 into equivalent forms hosted by our SPA. The Bob's Wine Bar before-and-after images show very similar views. The new forms retain their original labels and field entry areas, with the same ordering, layout, and data types as the originals.

Click here to see the live, translated version of this screen.

The appearance of the original form.

The appearance of the translated form.

As an alternative to the default translation, your developers can create custom modern interfaces using React, our SPA support library, and our backend APIs.

DFUs

Our Data File Update (DFU) translation converts your AS400 DFUs into equivalent forms hosted by our SPA. The DFUs retain their original labels and field entry areas, with the same record selections, field selections and data types as the originals. It supports all of the same field lables and data types you are used to including support for packed fields.

Click here to see the live, translated version of this DFU.

The appearance of the original DFU.

The appearance of the translated DFU.

Reports

Many existing programs and procedures are designed to generate report output. We currently don't support report translation (although that may change in the future) but the translated programs and procedures that generate reports generate them exactly as they are on your original system. If you need new versions of your old reports, you can run the programs in the new system to get them as long as your data has been translated.

The appearance of an original report.

The appearance of the same report as generated by the new system.

All reports that get generated will show up in the report organizer section of the SPA. This organizer is similar to the spool file list in your AS400 and also like the file explorer that appears on a windows system. This organizer displays information about all of the reports and allows you to filter and sort them to better find the report(s) you need.

Click here to see the live version of the report organizer.

The appearance of the spool file list on the original AS400.

The appearance of the report list in the report organizer.