To activate ACT Widgets

1. Call the widget using startWidget with widgetType as actOnboarding and/or actManagement:

actOnboarding

window.PersoneticsEngage.startWidget({
  configurations: {
    deviceType: "web",
    ctxId: "dashboard",
    params: {
      userId: "",
      pageId: ""
    },
    selectorString: "#perso-responsive-container",
    widgetType: "actOnboarding"
  },
  assets: {
    useRemoteAssets: false,
    baseUrl: "https://bank-assets.s1.amazonaws.com/clientproduct-assets/assets/"
  },
  internationalization: {
    language: "en"
  }
})

actManagement

window.PersoneticsEngage.startWidget({
  configurations: {
    deviceType: "web",
    ctxId: "dashboard",
    params: {
      userId: "",
      pageId: ""
    },
    selectorString: "#perso-responsive-container",
    widgetType: "actManagement"
  },
  assets: {
    useRemoteAssets: false,
    baseUrl: "https://bank-assets.s1.amazonaws.com/clientproduct-assets/assets/"
  },
  internationalization: {
    language: "en"
  }
})

2. The startWidget call includes several parameters. Following this call, a pre-defined WebView should be opened by the bank, and the widget’s render should be injected to it.
   The startWidget may include additional payload parameters, in which case, the startWidget would include an additional “params” parameter:

startWidget ({"widgetType":"actOnboarding", "params”: {…}}) 
startWidget ({"widgetType":"actManagement", "params”: {…}}) 

3. To allow end-users to set their preferences, the widgets send API requests along with the protocol version to the server:
   • setProgramSettings
   • setGoalSettings
   • executeGoalTransfer
     Following startWidget initialization, the request will be sent by the widget through the widget delegate function:

Personetics ACT Widgets -> Delegate: sendRequestToPserver(setProgramSettings (), reqid)
Personetics ACT Widgets -> Delegate: sendRequestToPserver(setGoalSettings (), reqid)
Personetics ACT Widgets -> Delegate: sendRequestToPserver(executeGoalTransfer (), reqid)

Note: The client experience can also be fully implemented by the bank using Server APIs as detailed in the Programs and Goals Server API Suites. If the bank develops an onboarding or management access from their main menu, banner, dashboard, or their own teasers, the ‘startWidget’ and the same protocol are.

actOnboarding End-user Interface

actOnboarding presents the end-user with the relevant programs and goal types and allows the end-user to register to selected programs.

Registering to a savings program and creating a new savings goal

1. The user will be asked to select the following (mandatory):
   • Savings program to register
   • Funding account for the program
   • Target savings account for hosting the goal

2. The user will be asked to create a savings goal (optional).

3. If the response was positive, the end-user will be asked to set the following:
   • Goal type (mandatory)
   • Goal name (mandatory)
   • Goal target amount (optional)
   • Distribution ratio of inflows and outflows posted to the savings account hosting the goal(s) (optional)

actManagement

The actManagement widget enables end-users to manage the saving program and goals settings to which they have subscribed via the the actOnboarding widget.

actManagement Options

actManagement enables the end-user to perform the following operations

• Pause and resume savings programs
• Unenroll from the program
• Switch between programs
• Manage program preferences
• Move money between active goals
• Edit goals
• Prioritize goals
• Create new goals

Pause and Resume Program’s Funding

To pause the program’s funding until a specified date

The user will be asked to choose the date the program’s funding will be restored automatically – unless the user decides to do so before the set date

Resuming Program’s Funding

• In case the program’s funding is paused, the user may decide to restore the program’s funding prior to the chosen date
• The user will be asked to approve the funding restoration

Stop Program’s Funding (Unenroll)

If the user decides to un-enroll from the programs funding all together, a verification message appears.

Switch between savings programs

For end-users enrolled in more than one program, the end-users can switch between their programs.

Moving Money Between Goals

End-users may decide to virtually move money between their savings goals. They will be required to select the source goal, the target goal, and the target amount.

Edit and Manage/Edit Existing Goals

The following Program Management options are available: Edit, Delete, Pause, Resume

Program Management options:

• Clicking the Edit button, presents the end-user with the current settings of the goals to change. These are modifiable by the user. : selected goals, goal name, goal amount

• Clicking the Delete button deletes the goal, following verification of the operation.

• Clicking the Pause button, will prompt the user to select the date on which goal funding will continue automatically
• Clicking the Resume button, resumes the goal’s funding after a verification message.

Adjusting funds distribution between goals

• The user may decide to re-distribute the funds between their savings goals

Set up a new goal

• User may create a new goal as part of the Management widget. Same parameters are required to be set as in the onboarding experience (type, name, target amount and distribution ratio).

Functions Triggered by the Widget

The following actions are being taken by the widget on any preference change or money movement:

1. To update the widget information, a new “widgetDetails” request is sent to the server:

Personetics goals Widget -> Delegate: sendRequestToPserver(widgetDetails(), reqid)

2. An update request is sent to the server “setProgramSettings”, with the user’s savings program preferences:

Personetics goals Widget -> Delegate: sendRequestToPserver(setProgramSettings(), reqid)

3. An update request is sent to the server “setGoalSettings”, with the user’s selected goal details:

Personetics goals Widget -> Delegate: sendRequestToPserver(setGoalSettings(), reqid)

4. In order to move money between the user’s goals, a new “executeGoalTransfer” request is sent to server:

Personetics goals widget -> Delegate: sendRequestToPserver(executeGoalTransfer(), reqid)

5. An event is being raised to the bank application, indicating the insights should be refreshed (see Closing the widget for more details)

Personetics goals Widget -> Delegate: widgetEvent({"eventType":"refreshInsights")

startWidget Goals Widget Parameters

Goals Widget Messages

The Personetics widgets convey messages to the bank’s application.