Using WML Screens

Overview | Text/Output Fields | Input Fields | Selection | Group Box | Tables | Links | Graphics | Toolbar (Menu, Options)

To design easy to use applications you can use the following WML based screen elements described below. Additional to the currently available interface concepts we discuss some SAP specific ones, e.g. group boxes, and show a way how to use these on a WAP screen.

 

Overview

The following screen elements are available for usage in WAP applications:

Element

Purpose

Text/Output Fields

Provide information or describe fields (label)

Input Fields

For entering values

Selection Fields

For selecting values

Group Box

For grouping fields and/or information

Table

For presenting tabular information

Softkey

For activating functions

Link

For navigation to other cards

Graphic/Image

Provide graphical information

Options

Provide an options menu with several items

Below you will find guidelines for using these screen elements.

 

Text/Output Fields

Text/Output Fields provide information or describe fields (label).

Note: See the section, which describes how to design texts, for topics such as formulations, abbreviations, hyphenation, use of country-specific characters, and also highlighting.

 

Input Fields

An input field is ready for input.

  • The text label should appear before the input/output field.
  • If there are several input fields, each should be in a separate line.
  • Display a default value, if one exists.
  • Required fields: All input/output fields on a card should be required fields; omit any optional fields.
  • The input format (letter and/or digits) must correspond to the input context. If the input most likely will be letters, the input format should to be predefined to letters. Avoid a mixed input format with letters and digits, otherwise the user has to switch between different input formats.

Note: On some devices you get an extra input editor screen for input fields!

 

Selection

Instead of letting users input data, it is usually preferable and faster to let users choose from a set of predefined alternatives: selecting is faster and easier than writing.

  • When the cursor stands on a dropdown listbox, use a key to display the list.
  • Then the user should be able to make a selection.

 

Group Box

  • Each card can act as one group box
  • In case more group structures are needed, use a line to separate the items, but only one group box is recommended per screen.
  • Each group box must contain more than one line.

 

Tables

We recommend to omit header titles for tables, if the values of the table can be understood easily.

There are two variants of tables, with editable fields and with non-editable fields.

Different cells can contain different objects, e.g. text, images, links, ...

In case of several columns, horizontal scrolling will be necessary. However horizontal scrolling should be avoided!

One technique that can be applied in order to avoid horizontal scrolling for multi-column tables is shown with a BW query of sales figures. Via options either a grouping by characteristics or key figures can be displayed for various sales periods.

Thus with this technique Group Sales, Costs and Operative Income can be displayed per sales period individually (see figure 1 below) or for all sales periods together.

Examples for tables on WML screens

Figure 1: Examples for tables on WML screens

Note: Tables are not available on all WAP devices!

 

Links

  • Links are used for navigation to other cards, e.g. containing subtopic information or other services. They are a powerful tool for preventing long pages of text.
  • Text links do not discriminate between unvisited, active and unvisited links.
  • Text links are activated using the OK button on the phone.
  • Do not use images as hyperlinks.
  • The hyperlink should contain information what to expect if the link is selected.

Note: Links may be displayed differently on different WAP devices.

 

Graphics

If you want to use images on WAP screens consider the following aspects:

  • Brand logo for service only as part of the content
  • The image must contain valuable content information, e.g. chart images
  • Do not use images for splash screens with no further content
  • Do not use images for hyperlinks

Example for a graphic on a WML screen

Figure 2: Example for a graphic on a WML screen

 

Toolbar (Menu, Options)

Functions that are used on several cards within one application should always have the same placement and assignment to one softkey.

The SAP Menu is transformed into link lists: Consider that the user firstly walks through the menu in width and then goes down into one menu item.

Note: Menu structures which are more than three levels deep should be avoided!

 

 top top

Source:  SAP Interaction Design Guide for WAP Applications