14.2    Creating Your First SAP Screen Personas Project

In this section, we’ll create an SAP Screen Personas project and discuss some of the basic options while creating themes and flavors.

14.2.1    Create a Theme

The SAP Screen Personas theme editor allows you to change visual properties that apply to multiple screens; for example, you can set background colors for all buttons, change all the label colors, and so on. To get started, follow these steps:

1. Log in to SAP GUI.
2. Start SAP Screen Personas by clicking .
3. Click the Themes button, then click Create New Theme (see Figure 14.10).
   

   Figure 14.10    Themes

4. Enter the theme Name and Description, and click Done (see Figure 14.11).
   

   Figure 14.11    New Theme Details

5. Select General Theme, then select Label from the dropdown box (see Figure 14.12). You can select different components from the dropdown list to customize.
6. Each component from the dropdown will have customization options. For this example, let’s change the label font color (see Figure 14.12).
   

   Figure 14.12    General Theme Properties

7. In the General Theme tab select Label, and then click A to the right of the Font Color box and select a color from the available options.
8. Click the Control Specific Styles tab and click the components that you want to hide to select them (see Figure 14.13).
9. Select Hidden from the Visible dropdown box (see Figure 14.13).
10. Once you’ve set all the theme customizations you need, click Save (see Figure 14.13).

Figure 14.13    Hiding Components

14.2.2    Assign the Theme to a Role and Transaction

In this section, we’ll create a role and assign the theme we created in the previous section to that role and a transaction.

1. Log in to the SAP front-end server, and run Transaction /PERSONAS/ADMIN.
2. Click the Display/Search icon under the User and Role Administration section (see Figure 14.14).
   

   Figure 14.14    User and Role Administration

3. Click Add Role, then enter the Role technical name; click Save (see Figure 14.15).
   

   Figure 14.15    Creating Role

4. Now, return to the SAP Screen Personas Administration screen by clicking the back button.
5. Select the theme we created in the previous section, then click Display/Search (see Figure 14.16).
   

   Figure 14.16    Theme Maintenance

Next, we’ll enter the role name we created previously and then enter the transaction to which we want this theme to be assigned. In our example, we’re assigning the theme to Transaction SMEN. Follow these steps:

1. Click Change, then enter the Role name and Transaction code in the Assignment section (see Figure 14.17).
2. Click Assign Theme (see Figure 14.17).
   

   Figure 14.17    Assigning Theme

14.2.3    Create a Flavor

In this section, we’ll create a new flavor for the SAP Easy Access screen by customizing the UI.

1. Start SAP Screen Personas from the SAP Web GUI. Click + to add a new flavor.
2. Enter the flavor Name and Description, then click Create (see Figure 14.18).
   

   Figure 14.18    New Flavor

3. Next, let’s add a logo in the top-left corner. Select the Insert tab, then click Image (see Figure 14.19).
   

   Figure 14.19    Inserting Image

4. Select the image you want to add and click Insert Image. Click Upload Image to upload an image if you don’t see what you need in the image gallery (see Figure 14.20).
   

   Figure 14.20    Image Gallery

5. Next, let’s insert a button that invokes a transaction code. Click Transaction Button from the Insert tab.
6. Enter a Label (in this example, “User Maintenance”) and transaction Code, (“SU01”) then click Done (see Figure 14.21).
7. Follow the previous two steps to add two more transaction buttons, one for Create Sales Order (tcode VA01) and another for Release a Sales Order (tcode VL01N).
   

   Figure 14.21    New Transaction Button

8. Select all the transaction buttons, and then resize, and align the buttons using the align options under the Home tab (see Figure 14.22).
   

   Figure 14.22    Transaction Buttons

9. Next, let’s add a button to log off. Click Menu Items Button under the Insert tab, and select the System/Log Off item from the Menu Items dropdown box. Click Done (see Figure 14.23).
   

   Figure 14.23    Log Off Button

10. Now, let’s add an icon to the System/Log Off button we added in the previous step, select the new System/Log Off button, then click the Assign Icon button.
11. Select an icon from the gallery and click Done (see Figure 14.24).
    

    Figure 14.24    Inserting from Icon Gallery

12. Format the three transaction buttons, formatting options are available from the Home tab (see Figure 14.25).
    

    Figure 14.25    Formatting Options

13. Select all the transaction buttons and add a background color by clicking the Fill Color option under the Home tab.
14. Increasing the font size by selecting the font size from the formatting section under Home tab.
15. Drag and drop the Transaction box from the SAP Menu, to the personas screen (see Figure 14.26).
16. In Section 14.3, we’ll cover some advanced features in SAP Screen Personas, so we need to add more components to the flavor here first.
17. Create a tile with a Text Field box, and rename text field to Sales Order Lookup
18. Add 3 Text input boxes. Add a script buttons, and rename the button as “GO”. For now, these text button, text boxes, and the script button are just dummy components, but we’ll use these in the next sections.
19. Once you add all the components, your screen should look something like the one in Figure 14.26.
20. Save the flavor by clicking Save, and click Exit.
    

    Figure 14.26    New SAP Screen Personas Flavor