Creating workplaces for your lines of business

As a BMC Helix Digital Workplace administrator, you can use the BMC Helix Digital Workplace studio to create visually rich pages suited for your lines of business and build your page navigation for the best user experience. The workplace studio provides components and a design canvas to create pages. Each component has properties that you can set and modify, giving you full control over the design, layout, and appearance of a page.

You can create and manage multiple customized pages. You can control page access and visibility.

Components for studio pages 

The component palette contains the following components.

Best practices while creating pages

The following list of practices will help you create pages that fulfil your content objectives:

• With the purpose of the page in mind, order the page components to create a visual hierarchy.
• Place the search bar at the top of the page.
• Add a catalog banner to draw your users' attention to any specific content and place it near the top of your page.
• For consistency, style one content block and then duplicate it.
• Do not use restricted file types for images.

To create a customized page for your lines of business 

All components are stacked vertically, one below the other in the right order, giving length to your page. All content is inside the components. 

1. Log in to the BMC Helix Digital Workplace Administration Console, and navigate to Configuration > Studio. 
2. Click New Page, enter a name for your page, and then click Create

3. Depending on your requirements, drag and drop the page components to build your page.
   
    

   Tip

   To specify another language for the content, click  to enable Translation mode, and select an available supported language. Note that not all fields are translatable.

4. To configure a component, click the component to open its properties panel:

   Component	What to configure
   Search Bar	Categories (show or hide) to enable users to filter catalog items by categories, custom label for the Show categories field, sources for search, size of the search bar, personalize the text within the label by inserting variables, and search icon (show or hide).
   Events	Type of events (active or past), custom labels for selected event type, default view for active events, and event types.
   Catalog Section	Desired catalog section from the list of available sections. The catalog sections created in BMC Helix Digital Workplace Catalog are listed in the list of Section options. For details about how to create catalog sections, see Setting up sections in the Catalog. You can design catalog sections to be displayed as columns, and add up to three columns that will be displayed as carousel sections. You can add large and small catalog sections in a row. Note: Catalog sections added into columns are not displayed as columns on mobile devices.
   Catalog Banner	Desired banner from the list of available banners. The catalog banners created in BMC Helix Digital Workplace Catalog are listed in the list of Section options. For details about how to create banners, see Creating promotional banners.
   Content Block	Template to base the content block on (optional), base properties, background, border, click action, media, text blocks, and buttons. You can duplicate or add content blocks to create a multi-column layout. You can adjust the width to create varying width columns.

5. To preview the page that you have created, select one of the options available  in the title bar:
   

   

   • Full width desktop layout
   • Tablet portal layout
   • Mobile device layout

   Tip

   Consider duplicating components on your page and updating the alignment of text and arrangement of images along with text while creating content for tablets and mobile devices.

6. To save a draft of changes click Save or if you are ready to publish the changes to your end users, click Save & Publish.

After you create the pages in the studio, you must create navigation menus from the pages, to give your users access to information and services through the pages. 

The following video (6:15) shows how to create a page in the BMC Helix Digital Workplace studio:

 https://youtu.be/ZaKwQ0D3AIQ

To configure a search bar

You can show or hide the categories list, customize the label for the categories list, select the sources for search, configure the size, and show or hide the search icon. 

The following animated video shows how you can configure the labels for the categories list and show or hide the search icon.

Sources for search

You can restrict the search to selected sources to narrow search results and make them more relevant. The search bar sources include catalog items, articles, requests, approvals, appointments, locations, assets, and users. By default, all sources are selected.

The following animated video shows how you can select only a few sources.

To configure an events block

You can select whether the events block displays active or past events, specify the labels, the default view, and select the type of events to display in the block.

The following animated video shows how you can configure the labels for active or past events and event types.

To configure a content block

You can base your content blocks on templates. After you configure your content block, you can duplicate it, and then make changes to the duplicated content.

Note the following points about content blocks:

• Content blocks can be stacked both, vertically and horizontally: 
  • Stack them horizontally by duplicating a block. 
  • Stack them vertically by adding a block as a page component or by duplicating an existing block at the row level to add another row.
• To create a multi-column layout, duplicate content blocks in a row or add blocks from the palette.
• To create varying width columns, resize the content blocks in a row. 

• To link to URLs or application pages, use the on-click action on backgrounds, background images, and buttons.

Content block properties are of the following types:

• Base properties: Templates to base the block on, height and appearance of the block, padding, and alignment of the text and image
• Background: Image or color 
• Border: Radius of the content block corners, color, and style, such as solid, dotted, or dashed 
• Click action: Choice to make a clickable block with the click action directing the user to a URL or an application page 
• Media: Image or video (link), its position - the content block edge against which the image or video is to be placed, maximize the image size, while overriding the padding setting
• Text block: Actual text and its color, size, weight 
• Button group: Label, appearance, and the URL or application page to which the user is directed upon clicking the button

To configure a component for different screen sizes and devices

Design your components to render correctly in different screen sizes and devices. Your end users might log in to BMC Helix Digital Workplace from a desktop, mobile, or any other device. A component that renders correctly on a desktop might render incorrectly on a mobile because screen display area is different. You might need to adjust the component settings and the alignment of text and images to suit different screen sizes and orientation. After you configure a component, preview it to test how the component is rendered in a device size. The title bar of your design canvas lists three sizes for a preview, desktop, tablet, and mobile. 

Consider duplicating the component and configuring its settings to suit a screen size. Hover over a component to see the sizes for which you can configure a component. Specify the screen size for each of your duplicated component instances.

To personalize the user experience by inserting variables

You can personalize the user experience by adding variables to any component that accepts a text input.  For example, you can add variables in text blocks, buttons, URLs, and search bars. Currently, only some variables are available for use. 

1. In a text input field, enter an opening curly brace.
   A list of available variables appears.
2. Select the variable you want to insert.

The following GIF file shows how you can add a variable in the search text field.

To enable the workplace for end users

After you create a combination of pages that form the workplace for various lines of business, you must enable the feature to make it available to your end users.

1. Log in to the BMC Helix Digital Workplace Admin Console, and navigate to Configuration > Application Features .
2. Select the Studio (expose pages to end users) check box.

To manage multiple pages

As a BMC Helix Digital Workplace administrator, you can create multiple pages for your lines of business and manage them. Create a few pages with settings that align the colors and appearance with the branding of your company or lines of business. After you create these pages, you can use them as a template by duplicating them to create other pages. This shortcut will save you the time required to create a page from scratch and will maintain consistency in the look and feel across all pages. The studio page lists all the studio pages you have created with their details.

Page life cycle

The life cycle of a page begins when you start creating a page in the workplace studio. When you create and save your page, it is saved as draft. You can continue making changes to the page until it is ready to be published. Only published pages can be added to the navigation menu and be accessed by users. 

The following table lists the various page statuses:

Page actions

Each page status has actions associated with it. Click Action to view the list of actions.

To make a page available to end users

Publish a page to make the page visible.  Add the page to the navigation menu to make it available to your end users. 

To share a page

You can Copy page URL of a published page to provide a deep link to the page. You can share or distribute the link to outside BMC Helix Digital Workplace via emails, a link on another portal, in knowledge base articles, or community posts. 

To remove the deep link to a page

Unpublish a page to delete the deep link to the page and remove the page from the navigation menu. The page moves to draft state and cannot be viewed by end users.

To change the visibility of a page

Unpublish a page to make the page invisible to the users who have the permissions to view the page. The page moves to a draft state.

To restrict access to studio pages by using entitlements

By default, all users can access the studio pages. However, you can use entitlements to allow or deny access to people groups. When you grant page access to a people group, all users belonging to the group can access the page. For information about people groups, see Creating workplaces for your lines of business.

The Entitlement column lists the entitlements for each page.

1. Select a page.
2. From the list of available actions for the page, select Entitlement.
3. Search for and select the people groups who will have access to the page.
4. Close the dialog box.

Sorting, searching, and filtering pages

To quickly find the page you are looking for, type the first few letters of the page name in the search bar on the page. BMC Helix Digital Workplace performs a Contains search on the page name. Sort the pages to arrange them in ascending or descending order. You can sort on the page name, draft modified date, publication date, and entitlement fields. Use filters to limit the number of pages you want to view. You can filter by page status or dates. The filter date can be before, after, date, or date range.  

To create single and multilevel navigation menus

Use the Navigation manager to create multilevel menus for the desired page navigation and to direct users to the correct content. You can build these menus from the core application, external applications,  studio pages, and embedded pages. Navigation menus give your users access to information and catalog services. You can specify the landing page.

All the pages that you can add to the navigation menu are listed under Application Content.

1. To add a page to the menu, select the page. 
   The page is accessible and visible in the horizontal navigation menu. 
2. To create a multilevel or hierarchical menu, add a menu section, and then add pages under the menu section:  
   
   1. Click Add menu in the Navigation Builder and give a meaningful label to categorize the pages that would be listed under it.
   2. Select the pages that you want to appear under the section. The pages are added at the end of the list.
   3. Drag a page to its desired position under the menu section.

To set the Home page

Specify the page that end users see when they log in to BMC Helix Digital Workplace. 

1. To the navigation menu, add the page at the top level of the navigation menu.
2. Click the Home icon adjacent to the desired page in the Application Content section.
   The icon turns blue.