Moveworks for Web

Overview

Moveworks for Web is a web-based, embedded chat client that can be hosted in your most frequented employee service portals and intranet sites. It automatically authenticates users by using their existing session on the host site, to grant them access to the full capabilities of the Moveworks platform without leaving their browser.

Notifications Behavior

Critical notifications from the following Moveworks products are sent to both Moveworks for Web and the user's preferred chat platform (Teams, Slack, etc.):

  • Employee Comms
  • Creator Studio Events API
  • Enterprise Approvals (for e.g. ServiceNow)

For all other notifications, they are ONLY sent to the user’s preferred chat platform. The preferred chat platform is determined using the following logic:

  • By default, a user’s preferred chatbot is in the native platform in which Moveworks is installed and configured with the highest "priority" (e.g. Slack, Microsoft Teams, WebEx, etc.)
  • If a user interacts with Moveworks for Web (by either chatting or clicking a link) their preferred chatbot is set to Moveworks for Web for 15 minutes.

This means notifications such as ticket updates are sent only to Moveworks for Web while it is set as the user’s preferred chatbot.

Proactive Greetings

📘

This is only available in the Moveworks Classic experience, users of Moveworks Copilot will not receive proactive greetings.

Proactive welcome is the reachout message we send to users upon landing on a page that hosts Moveworks for Web. By default, this looks like this:

Proactive welcome configs allow you to set rules for when and which type of proactive welcome is triggered based on several factors.

You can determine how often the greeting should trigger, what platforms/pages/URLs to trigger on, and even to trigger to display existing active tickets the user has.

Forms

Clicking on any link to an external resource will lead users to the same destination as configured for your organization's other chat platform(s). For clarity, links to forms will have one of three results:

  • For a simple in-bot-fillable form (i.e. one or less mandatory fields), the behavior is the same in Moveworks for Web as in Slack/Teams/etc., which is to allow users to fill the form conversationally in chat.
  • For a complex in-bot-fillable form (i.e. more than one mandatory field), the user will be able the form out in a modal on the same tab as the Moveworks for Web UI, as long as the modal feature is enabled.
  • For a form that is not in-bot-fillable, the user will be directed to the source system of the form to fill out the form in a new tab on the web browser (this will be consistent with where users are directed in their normal chat platform).

Theming

Moveworks for Web will be configured by our team to use your pre-existing bot's name and avatar for a consistent experience between web and chat platforms. Additionally, you can chose to apply a color theme to the chat window elements to match your bot's color palette.

History Syncing

All your Moveworks for Web bots’ chat histories stay in sync within and across hosts. For example, a user’s history will be shared across ServiceNow pages and across ServiceNow and SharePoint.

Chat histories are not synced between the web bot and native chat platforms. This is consistent with how, for example, Slack and Teams bots are not synced.

All Copilots (web and native chat) have access to the same underlying data and integrations. For example, I could file a ticket in Moveworks for Web on SharePoint and immediately check the status of it and add a comment to it in Slack.

Users have up to a 30 day history on their Moveworks for Web messages per our data retention policies.

How does Moveworks for Web work?

How is the user authenticated?

Each host is implemented differently, but in general, Moveworks will embedded via a Javascript snippet on each page we want it to appear. When a user visits that page, a call is made to Moveworks services, offering a token or other form of authentication provided by the host system, which allows Moveworks to validate authentication for the current user. Moveworks validates the following:

  • A. The user is authenticated into the host system
  • B. The user exists within the Moveworks User Identity
  • C. The user is authorized to access to Moveworks for Web.

Only if all of these checks pass, Moveworks for Web will successfully load. If any of the checks do not pass, then nothing will appear, and the user will not see Moveworks for Web. If the user is authenticated, the script renders an iframe on the page containing the Copilot icon in the bottom right corner of the page.

On which pages does Moveworks for Web show up?

Depending on the host, Moveworks for Web can be applied to individual pages or across your entire portal by applying it to your portal's theme. We generally recommend the latter if possible with the host, as it only takes a few seconds to do and your users will have access to the Copilot throughout their entire journey through the portal.

What types of hosts/authentication methods are supported?

  • Any destination that supports HTML embedding can leverage the following SSO based auth methods:
    • SAML
    • OIDC

      📘

      Most common Authentication Providers support SAML and OIDC

      We have tested SAML and OIDC against Azure, Okta, ADFS, and many other industry standard authentication providers.

  • ServiceNow (JWT based auth)
  • SharePoint (JWT based auth)

📘

A Note on authentication with ServiceNow

Although ServiceNow supports a native based auth, Moveworks strongly recommends authenticating web bot with your SSO provider using OIDC OR SAML instead.

Configuration options

Which parts of the design can be customized?

Colors

Moveworks for Web supports custom color options for the following fields (see image below for what each field corresponds to):

  • Border (primary) - Applies to the header and footer
  • Accent (secondary) - Applies to icons, the Copilot title, and any buttons in chat
  • Copilot message (botMessage) - Applies to the background color of messages from the Copilot
  • User Message (userMessage) - Applies to the background color of messages by the user
  • Card (card) - Applies to the background color of non-text chat blocks returned by the Copilot (not depicted in the image below)

👍

We recommend using a lighter color for the Border ( primary) field and a darker color for the Accent (secondary) field for the best visual clarity!

If no customization is specified, the Copilot will use the following defaults:

  • primary - Defaults to #EFEAF3
  • secondary - Defaults to #45007F
  • botMessage - This defaults to the primary color if not defined
  • userMessage - This defaults to the secondary color if not defined
  • card - Defaults to #FFFFFF

Font

Any font can be specified in Moveworks for Web via configuration!

❗️

We recommend sticking to a font that your users will have installed on their devices and is compatible with browsers used in your organization.

Your font will be included in the CSS of the bot installation, with the following defaults appended: Roboto, Helvetica, Arial, sans-serif;If no font is specified, then the defaults will be used.

Avatar and Close Button Size

Moveworks for Web support a set of sizing options as well, to allow for better clarity of your bot deployment:

  • Avatar Size (avatar_size_v2) - This controls the size of the avatar button which is present when the bot is in the closed state
  • Close Button Size (close_button_size) - This controls the size of the close button which is present when the bot is in the open state
  • Speech Bubble Configuration
    • Hide Bubble (hide_bubble) - If true, hide the speech bubble after the configured number of seconds. Otherwise, persist the speech bubble until the user opens the bot
    • Expiration Time (expiration_time) The configured number of seconds after which to hide the speech bubble if the above config is true.

Full Screen Size

Moveworks for Web supports custom specifications for the Full Screen (or maximize) button. If you would prefer to have the option to expand the iframe, but not take up the full screen, you can specify the height and width with valid CSS syntax.

How to embed my bot on a Web page

After you have set up authentication for your Moveworks for Web bot, using SAML, or OIDC, you can use leverage the code snippets below to embed your bot on any web page that supports embedding HTML & Javascript.

📘

Note: Replacing Bot ID

You will need to replace bot_id, which is is the unique bot ID of your bot. You can view this from Moveworks Setup, or ask your Moveworks team.

If your installation does not require any style overrides then use the following:

<script src="https://webchat-kprod.moveworks.io/script/<bot_id>" />
<script src="https://webchat.prod.am-usge1.moveworks.io/script/<bot_id>" />
<script src="https://webchat.prod.am-euc1.moveworks.io/script/<bot_id>" />
<script src="https://webchat.prod.am-cac1.moveworks.io/script/<bot_id>" />

Otherwise use the following:

<div id="webchat">
    <script>
        var script = document.createElement('script');
        script.type = "text/javascript";
        script.onload = function () {
            window.mwwebchat.openMWWebChat(
                '', <!--Leave this blank; this is for token-based deploys. -->
                '<bot_id>',
                {
                    serverUrl: 'https://webchat-kprod.moveworks.io/login/<bot_id>',
                    styles: '<optional, see below>'
                },
            );
        };
        script.src = 'https://webchat-kprod.moveworks.io/movewebchat-client-script.js';
        document.getElementById('webchat').appendChild(script);
    </script>
</div>
<div id="webchat">
    <script>
        var script = document.createElement('script');
        script.type = "text/javascript";
        script.onload = function () {
            window.mwwebchat.openMWWebChat(
                '', <!--Leave this blank; this is for token-based deploys. -->
                '<bot_id>',
                {
                    serverUrl: 'https://webchat.prod.am-usge1.moveworks.io/login/<bot_id>',
                    styles: '<optional, see below>'
                },
            );
        };
        script.src = 'https://webchat.prod.am-usge1.moveworks.io/movewebchat-client-script.js';
        document.getElementById('webchat').appendChild(script);
    </script>
</div>
<div id="webchat">
    <script>
        var script = document.createElement('script');
        script.type = "text/javascript";
        script.onload = function () {
            window.mwwebchat.openMWWebChat(
                '', <!--Leave this blank; this is for token-based deploys. -->
                '<bot_id>',
                {
                    serverUrl: 'https://webchat.prod.am-euc1.moveworks.io/login/<bot_id>',
                    styles: '<optional, see below>'
                },
            );
        };
        script.src = 'https://webchat.prod.am-euc1.moveworks.io/movewebchat-client-script.js';
        document.getElementById('webchat').appendChild(script);
    </script>
</div>
<div id="webchat">
    <script>
        var script = document.createElement('script');
        script.type = "text/javascript";
        script.onload = function () {
            window.mwwebchat.openMWWebChat(
                '', <!--Leave this blank; this is for token-based deploys. -->
                '<bot_id>',
                {
                    serverUrl: 'https://webchat.prod.am-cac1.moveworks.io/login/<bot_id>',
                    styles: '<optional, see below>'
                },
            );
        };
        script.src = 'https://webchat.prod.am-cac1.moveworks.io/movewebchat-client-script.js';
        document.getElementById('webchat').appendChild(script);
    </script>
</div>
  • You can also added these optional parameters along with the serverURL. See below.
    • styles controls the position of the avatar
								{
                    serverUrl: 'https://webchat-kprod.moveworks.io/login/<bot_id>',
                    styles: { 
							        bottom: '0px',
							        right: '10px',
							        zIndex: 999,
							    },
                },
								{
                    serverUrl: 'https://webchat.prod.am-usge1.moveworks.io/login/<bot_id>',
                    styles: { 
							        bottom: '0px',
							        right: '10px',
							        zIndex: 999,
							    },
                },
								{
                    serverUrl: 'https://webchat.prod.am-euc1.moveworks.io/login/<bot_id>',
                    styles: { 
							        bottom: '0px',
							        right: '10px',
							        zIndex: 999,
							    },
                },
								{
                    serverUrl: 'https://webchat.prod.am-cac1.moveworks.io/login/<bot_id>',
                    styles: { 
							        bottom: '0px',
							        right: '10px',
							        zIndex: 999,
							    },
                },

FAQ

Q: How long does Moveworks for Web links stay active?

A: Moveworks for Web links are active for 14 days.

Q: Is the text within chat bubbles configurable?

Yes, the text in with chat bubbles in Moveworks for Web is configurable by configuring the botMessage or userMessage parameters outlined above.

Q: Is it possible to open Moveworks for Web after clicking a button?

Yes, you can leverage the following javascript window.postMessage('mw4web_app_open')to open the bot behind a onclick

Q: Can we have both JWT and SSO simultaneously for M4W and standalone app?

Yes, ServiceNow native auth, and SSO based auth can coexist.